andodeki/simplestacknavigation
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

refoctor to latest rik branch

Browse source
This commit is contained in:
aOK 2023-12-15 14:51:54 +03:00
parent 21b28f7f11
commit d9e2a0b603
14 changed files with 494 additions and 640 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
Cargo.toml
View file

@ -22,5 +22,8 @@ panic = "abort"
strip = true
[dependencies]
makepad-widgets = { version = "0.6.0" }
# makepad-widgets = { path = "../../../../sample/makepad/widgets", version = "0.6.0" }
# makepad-widgets = { git = "https://github.com/makepad/makepad/", branch = "rik" }
# makepad-widgets = { path = "../../../samples/makepad/widgets", version = "0.6.0" }
makepad-widgets = { path = "../makepad/widgets", version = "0.6.0" }

3
README.md
View file

@ -9,6 +9,7 @@ This template should help get you started developing with Makepad Rust UI.
# Desktop in Debug Mode
cargo run
MAKEPAD=lines cargo +nightly run simplestacknavigation
# Desktop in Release Mode
cargo run --release
@ -34,5 +35,5 @@ cargo makepad apple ios install-toolchain
cargo makepad android --abi=all install-toolchain
git add .
git commit -m "welcome screen centered"
git commit -m "refoctor to latest rik branch"
git push -u origin main

115
makepad_state.ron Normal file
View file

@ -0,0 +1,115 @@
(
dock_items:[
Tab(
id:file_tree,
name:"Explore",
closable:false,
kind:StudioFileTree,
),
Tabs(
id:file_tree_tabs,
tabs:[
file_tree,
search,
run_list,
],
selected:0,
closable:false,
),
Tab(
id:log_list,
name:"Log",
closable:false,
kind:LogList,
),
Splitter(
id:split2,
axis:Horizontal,
align:Weighted(0.5),
a:edit_tabs,
b:run_tabs,
),
Tabs(
id:log_tabs,
tabs:[
log_list,
profiler,
],
selected:0,
closable:false,
),
Tab(
id:file1,
name:"app.rs",
closable:true,
kind:StudioEditor,
),
Splitter(
id:root,
axis:Horizontal,
align:FromA(230),
a:file_tree_tabs,
b:split1,
),
Tab(
id:run_first,
name:"View",
closable:false,
kind:RunFirst,
),
Tabs(
id:edit_tabs,
tabs:[
edit_first,
17924207437592000735,
],
selected:1,
closable:false,
),
Tab(
id:search,
name:"Search",
closable:false,
kind:Search,
),
Tab(
id:edit_first,
name:"Edit",
closable:false,
kind:EditFirst,
),
Tab(
id:profiler,
name:"Profiler",
closable:false,
kind:Profiler,
),
Splitter(
id:split1,
axis:Vertical,
align:FromB(200),
a:split2,
b:log_tabs,
),
Tab(
id:17924207437592000735,
name:"makepad_state.ron",
closable:true,
kind:StudioEditor,
),
Tabs(
id:run_tabs,
tabs:[
run_first,
],
selected:0,
closable:false,
),
Tab(
id:run_list,
name:"Run",
closable:false,
kind:RunList,
),
],
)

61
src/app.rs
View file

@ -9,10 +9,8 @@ live_design!{
import crate::welcome::welcome_screen::WelcomeScreen
import crate::counter::counter_screen::CounterScreen
import crate::shared::clickable_view::ClickableView
import crate::shared::stack_navigation::*;
import crate::shared::styles::*;
import crate::shared::helpers::*;
@ -37,11 +35,10 @@ live_design!{
}
App = {{App}} {
ui: <Window>{
window: {
position: vec2(0, 0),
// inner_size: vec2(360, 800)
inner_size: vec2(360, 800)
dpi_override: 2
},
pass: {clear_color: #2A}
@ -82,14 +79,11 @@ app_main!(App);
#[derive(Live)]
pub struct App {
#[live] ui: WidgetRef,
#[rust] counter: usize,
#[rust] navigation_destinations: HashMap<StackViewAction, LiveId>,
}
impl LiveHook for App {
fn before_live_design(cx: &mut Cx) {
impl LiveRegister for App {
fn live_register(cx: &mut Cx) {
crate::makepad_widgets::live_design(cx);
// welcome
crate::welcome::welcome_screen::live_design(cx);
// counter
@ -106,30 +100,15 @@ impl LiveHook for App {
crate::shared::stack_navigation::live_design(cx);
crate::shared::clickable_view::live_design(cx);
}
}
impl LiveHook for App {
fn after_new_from_doc(&mut self, _cx: &mut Cx) {
self.init_navigation_destinations();
self.init_navigation_destinations();
}
}
impl App{
fn init_navigation_destinations(&mut self) {
self.navigation_destinations = HashMap::new();
self.navigation_destinations.insert(StackViewAction::ShowCounterScreen, live_id!(my_counter_stack_view));
}
async fn _do_network_request(_cx:CxRef, _ui:WidgetRef, _url:&str)->String{
"".to_string()
}
}
impl AppMain for App{
fn handle_event(&mut self, cx: &mut Cx, event: &Event) {
if let Event::Draw(event) = event {
return self.ui.draw_widget_all(&mut Cx2d::new(cx, event));
}
let actions = self.ui.handle_widget_event(cx, event);
impl MatchEvent for App{
fn handle_actions(&mut self, cx:&mut Cx, actions:&Actions){
self.ui.radio_button_set(ids!(
mobile_modes.tab1,
))
@ -149,3 +128,27 @@ impl AppMain for App{
);
}
}
impl App{
fn init_navigation_destinations(&mut self) {
self.navigation_destinations = HashMap::new();
self.navigation_destinations.insert(StackViewAction::ShowCounterScreen, live_id!(my_counter_stack_view));
}
async fn _do_network_request(_cx:CxRef, _ui:WidgetRef, _url:&str)->String{
"".to_string()
}
// fn handle_event(&mut self, cx: &mut Cx, event: &Event) {
// if let Event::Draw(event) = event {
// return self.ui.draw_widget_all(&mut Cx2d::new(cx, event));
// }
// let actions = self.ui.handle_widget_event(cx, event);
// }
}
impl AppMain for App {
fn handle_event(&mut self, cx: &mut Cx, event: &Event) {
self.match_event(cx, event);
self.ui.handle_event(cx, event, &mut Scope::empty());
}
}

214
src/counter/counter_screen.rs
View file

@ -1,5 +1,3 @@
use crate::shared::clickable_view::*;
use crate::shared::stack_view_action::StackViewAction;
use makepad_widgets::widget::WidgetCache;
use makepad_widgets::*;
@ -15,84 +13,81 @@ live_design! {
import crate::shared::search_bar::SearchBar;
import crate::shared::custom_button::CustomButton;
IMG_DEFAULT_AVATAR = dep("crate://self/resources/img/default_avatar.png")
IMG_FAVORITES = dep("crate://self/resources/img/favorites.png")
IMG_MY_POSTS = dep("crate://self/resources/img/my-posts.png")
IMG_STICKER_GALLERY = dep("crate://self/resources/img/sticker-gallery.png")
IMG_SETTINGS = dep("crate://self/resources/img/settings.png")
IMG_QR = dep("crate://self/resources/img/qr_icon.png")
Counter = {{Counter}} {
view: {
width: Fill, height: Fit
spacing: 10.
width: Fill, height: Fill
flow: Down,
spacing: 10.
draw_bg: {
color: #000
}
// draw_bg: {
// fn pixel(self) -> vec4 {
// return mix(#3, #1, self.pos.y);
// }
// }
CounterInfo = <View> {
width: Fill, height: Fill
flow: Right,
spacing: 10.,
align: {
x: 0.5,
y: 0.5
},
show_bg: true
draw_bg: {
color: #000
color: #fff
}
CounterInfo = <View> {
width: Fill, height: Fill
flow: Right,
spacing: 10.,
align: {
x: 0.5,
y: 0.5
},
show_bg: true
draw_bg: {
color: #fff
}
<View> {
width: Fit
height: Fill
show_bg: false
<View> {
width: Fit
height: Fill
show_bg: false
align: {x: 0.5, y: 0.5}
container = <RoundedView> {
width: 360
height: 400
align: {x: 0.5, y: 0.5}
container = <RoundedView> {
width: 360
height: 400
align: {x: 0.5, y: 0.5}
spacing: 2.0
draw_bg: {
color: #ddd,
radius: (CARD_CORNER_RADIUS)
}
<View> {
width: Fit, height: Fill
flow: Down,
align: {x: 0.5, y: 0.5},
padding: {top: 5., left: 10., right: 10.}, spacing: 20.
spacing: 2.0
draw_bg: {
color: #ddd,
radius: (CARD_CORNER_RADIUS)
}
<View> {
width: Fit, height: Fill
flow: Down,
align: {x: 0.5, y: 0.5},
padding: {top: 5., left: 10., right: 10.}, spacing: 20.
avatar = <Image> {
source: (LOGO_MAKEPAD),
width: 300., height: 80.
avatar = <Image> {
source: (LOGO_MAKEPAD),
width: 300., height: 80.
}
button1 = <CustomButton> {
button = {
text: "Hello world"
}
button1 = <CustomButton> {
button = {
text: "Hello world"
}
message_input = <SearchBar> {
show_bg: false
input = {
width: Fill, height: Fit, margin: 0
empty_message: "Click to count"
draw_bg: {
color: #fff
border_width: 0.5,
border_color: #b4b4b4,
}
}
message_input = <SearchBar> {
show_bg: false
input = {
width: Fill, height: Fit, margin: 0
empty_message: "Click to count"
draw_bg: {
color: #fff
border_width: 0.5,
border_color: #b4b4b4,
}
}
}
label1 = <Label> {
draw_text: {
color: #000
},
text: "Counter: 0"
}
}
label1 = <Label> {
draw_text: {
color: #000
},
text: "Counter: 0"
}
}
}
}
}
}
@ -102,54 +97,33 @@ live_design! {
}
}
#[derive(Live)]
#[derive(Live, LiveHook, Widget)]
pub struct Counter {
#[live]
view:View,
#[deref] view: View,
#[rust] counter: usize,
}
impl LiveHook for Counter {
fn before_live_design(cx: &mut Cx) {
register_widget!(cx, Counter);
}
}
impl Widget for Counter {
fn handle_widget_event_with(
&mut self,
cx: &mut Cx,
event: &Event,
dispatch_action: &mut dyn FnMut(&mut Cx, WidgetActionItem),
) {
let uid = self.widget_uid();
self.handle_event_with(cx, event, &mut |cx, action: StackViewAction| {
dispatch_action(cx, WidgetActionItem::new(action.into(), uid));
});
}
fn redraw(&mut self, cx: &mut Cx) {
self.view.redraw(cx);
}
fn find_widgets(&mut self, path: &[LiveId], cached: WidgetCache, results: &mut WidgetSet) {
self.view.find_widgets(path, cached, results);
}
fn draw_walk_widget(&mut self, cx: &mut Cx2d, walk: Walk) -> WidgetDraw {
self.view.draw_walk_widget(cx, walk)
}
}
impl Counter {
fn handle_event_with(
&mut self,
cx: &mut Cx,
event: &Event,
_dispatch_action: &mut dyn FnMut(&mut Cx, StackViewAction),
) {
let actions = self.view.handle_widget_event(cx, event);
fn handle_event(&mut self, cx: &mut Cx, event: &Event, scope: &mut Scope) {
let actions = cx.capture_actions(|cx| self.view.handle_event(cx, event, scope));
// if self
// .view
// .clickable_view(id!(my_profile_frame))
// .clicked(&actions)
// {
// let uid = self.widget_uid();
// cx.widget_action(uid, &scope.path, StackViewAction::ShowMyProfile);
// }
// if self.view.button(id!(welcome_frame)).clicked(&actions)
// {
// let uid = self.widget_uid();
// cx.widget_action(uid, &scope.path, StackViewAction::ShowCounterScreen);
// // dispatch_action(cx, StackViewAction::ShowCounterScreen);
// let user_prompt1 = self.view.text_input(id!(message_input.input)).text();
// log!("WELCOME BUTTON CLICKED: {}", user_prompt1);
// }
if self.view.button(id!(button1)).clicked(&actions)
{
log!("BUTTON CLICKED {}", self.counter);
@ -158,4 +132,26 @@ impl Counter {
label.set_text_and_redraw(cx,&format!("Counter: {}", self.counter));
}
}
fn draw_walk(&mut self, cx: &mut Cx2d, scope: &mut Scope, walk: Walk) -> DrawStep {
self.view.draw_walk(cx, scope, walk)
}
}
// impl Counter {
// fn handle_event_with(
// &mut self,
// cx: &mut Cx,
// event: &Event,
// _dispatch_action: &mut dyn FnMut(&mut Cx, StackViewAction),
// ) {
// let actions = self.view.handle_widget_event(cx, event);
// if self.view.button(id!(button1)).clicked(&actions)
// {
// log!("BUTTON CLICKED {}", self.counter);
// self.counter += 1;
// let label = self.view.label(id!(label1));
// label.set_text_and_redraw(cx,&format!("Counter: {}", self.counter));
// }
// }
// }

12
index.html → src/index.html
View file

@ -3,25 +3,25 @@
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<title>Makepad Template</title>
<title>Simple UI example</title>
<script type='module'>
import {WasmWebGL} from "/makepad-template/platform/src/os/web/web_gl.js"
import {WasmWebGL} from "/makepad/platform/src/os/web/web_gl.js"
const wasm = await WasmWebGL.fetch_and_instantiate_wasm(
"makepad-template/target/wasm32-unknown-unknown/release/login.wasm"
"/makepad/target/wasm32-unknown-unknown/release/simplestacknavigation.wasm"
);
class MyWasmApp {
constructor(wasm) {
let canvas = document.getElementsByClassName('full_canvas')[0];
this.webgl = new WasmWebGL (wasm, this, canvas);
this.bridge = new WasmWebGL (wasm, this, canvas);
}
}
let app = new MyWasmApp(wasm);
</script>
<script type='module' src='/makepad-template/platform/src/os/web/auto_reload.js'></script>
<link rel='stylesheet' type='text/css' href='/makepad-template/platform/src/os/web/full_canvas.css'>
<script type='module' src='/makepad/platform/src/os/web/auto_reload.js'></script>
<link rel='stylesheet' type='text/css' href='/makepad/platform/src/os/web/full_canvas.css'>
</head>
<body>
<canvas class='full_canvas'></canvas>

67
src/shared/clickable_view.rs
View file

@ -14,82 +14,41 @@ live_design! {
}
}
#[derive(Live)]
#[derive(Live, LiveHook, Widget)]
pub struct ClickableView {
#[deref]
view:View,
view: View,
}
impl LiveHook for ClickableView {
fn before_live_design(cx: &mut Cx) {
register_widget!(cx, ClickableView);
}
}
#[derive(Clone, WidgetAction)]
#[derive(Clone, DefaultNone, Debug)]
pub enum ClickableViewAction {
None,
Click,
}
impl Widget for ClickableView {
fn handle_widget_event_with(
&mut self,
cx: &mut Cx,
event: &Event,
dispatch_action: &mut dyn FnMut(&mut Cx, WidgetActionItem),
) {
let uid = self.widget_uid();
self.handle_event_with(cx, event, &mut |cx, action| {
dispatch_action(cx, WidgetActionItem::new(action.into(), uid));
});
}
fn handle_event(&mut self, cx: &mut Cx, event: &Event, scope: &mut Scope) {
let uid = self.widget_uid().clone();
fn redraw(&mut self, cx: &mut Cx) {
self.view.redraw(cx);
}
fn walk(&mut self, cx: &mut Cx) -> Walk {
self.view.walk(cx)
}
fn find_widgets(&mut self, path: &[LiveId], cached: WidgetCache, results: &mut WidgetSet) {
self.view.find_widgets(path, cached, results);
}
fn draw_walk_widget(&mut self, cx: &mut Cx2d, walk: Walk) -> WidgetDraw {
self.view.draw_walk_widget(cx, walk)
}
}
impl ClickableView {
pub fn handle_event_with(
&mut self,
cx: &mut Cx,
event: &Event,
dispatch_action: &mut dyn FnMut(&mut Cx, ClickableViewAction),
) {
match event.hits(cx, self.view.area()){
Hit::FingerDown(_fe) => {
cx.set_key_focus(self.view.area());
}
Hit::FingerUp(fe) => if fe.was_tap() {
dispatch_action(cx, ClickableViewAction::Click);
cx.widget_action(uid, &scope.path, ClickableViewAction::Click);
}
_ =>()
}
}
fn draw_walk(&mut self, cx: &mut Cx2d, scope: &mut Scope, walk: Walk) -> DrawStep {
self.view.draw_walk(cx, scope, walk)
}
}
#[derive(Debug, Clone, PartialEq, WidgetRef)]
pub struct ClickableViewRef(WidgetRef);
impl ClickableViewRef {
pub fn clicked(&self, actions: &WidgetActions) -> bool {
if let Some(item) = actions.find_single_action(self.widget_uid()) {
if let ClickableViewAction::Click = item.action() {
return true;
}
pub fn clicked(&self, actions: &Actions) -> bool {
if let ClickableViewAction::Click = actions.find_widget_action(self.widget_uid()).cast() {
return true;
}
false
}

155
src/shared/dropdown_menu.rs
View file

@ -81,7 +81,7 @@ live_design! {
}
}
#[derive(Live)]
#[derive(Live, Widget)]
pub struct WechatDropDown {
#[animator]
animator: Animator,
@ -91,7 +91,7 @@ pub struct WechatDropDown {
#[layout]
layout: Layout,
#[live]
#[live] #[redraw]
draw_bg: DrawQuad,
#[live]
draw_icon: DrawIcon,
@ -124,10 +124,6 @@ pub struct WechatDropDown {
}
impl LiveHook for WechatDropDown {
fn before_live_design(cx: &mut Cx) {
register_widget!(cx, WechatDropDown)
}
fn after_apply(&mut self, cx: &mut Cx, from: ApplyFrom, _index: usize, _nodes: &[LiveNode]) {
if self.popup_menu.is_none() || !from.is_from_doc() {
return;
@ -144,7 +140,7 @@ impl LiveHook for WechatDropDown {
});
}
}
#[derive(Clone, WidgetAction, Debug)]
#[derive(Clone, DefaultNone, Debug)]
pub enum WechatDropDownAction {
Select(usize, LiveValue),
None,
@ -180,14 +176,42 @@ impl WechatDropDown {
self.draw_bg.redraw(cx);
cx.sweep_unlock(self.draw_bg.area());
}
}
pub fn handle_event_with(
&mut self,
cx: &mut Cx,
event: &Event,
dispatch_action: &mut dyn FnMut(&mut Cx, WechatDropDownAction),
) {
// It is named WechatDropDown because DropDown is already a widget in makepad_widgets
impl Widget for WechatDropDown {
fn widget_to_data(
&self,
_cx: &mut Cx,
actions: &Actions,
nodes: &mut LiveNodeVec,
path: &[LiveId],
) -> bool {
match actions.find_widget_action(self.widget_uid()).cast() {
WechatDropDownAction::Select(_, value) => {
nodes.write_field_value(path, value.clone());
true
}
_ => false,
}
}
fn data_to_widget(&mut self, cx: &mut Cx, nodes: &[LiveNode], path: &[LiveId]) {
if let Some(value) = nodes.read_field_value(path) {
if let Some(index) = self.values.iter().position(|v| v == value) {
if self.selected_item != index {
self.selected_item = index;
self.redraw(cx);
}
} else {
// error!("Value not in values list {:?}", value);
}
}
}
fn handle_event(&mut self, cx: &mut Cx, event: &Event, scope: &mut Scope) {
self.animator_handle_event(cx, event);
let uid = self.widget_uid();
if self.is_open && self.popup_menu.is_some() {
let global = cx.global::<PopupMenuGlobal>().clone();
@ -199,16 +223,17 @@ impl WechatDropDown {
event,
self.draw_bg.area(),
&mut |cx, action| if let PopupMenuAction::WasSelected(node_id) = action {
self.selected_item = node_id.0 .0 as usize;
dispatch_action(
cx,
self.selected_item = node_id.0.0 as usize;
cx.widget_action(
uid,
&scope.path,
WechatDropDownAction::Select(
self.selected_item,
self.values
.get(self.selected_item)
.cloned()
.unwrap_or(LiveValue::None),
),
.unwrap_or(LiveValue::None)
)
);
self.draw_bg.redraw(cx);
close = true;
@ -237,12 +262,16 @@ impl WechatDropDown {
KeyCode::ArrowUp => {
if self.selected_item > 0 {
self.selected_item -= 1;
dispatch_action(
cx,
cx.widget_action(
uid,
&scope.path,
WechatDropDownAction::Select(
self.selected_item,
self.values[self.selected_item].clone(),
),
self.values
.get(self.selected_item)
.cloned()
.unwrap_or(LiveValue::None)
)
);
self.set_closed(cx);
self.draw_bg.redraw(cx);
@ -251,12 +280,16 @@ impl WechatDropDown {
KeyCode::ArrowDown => {
if !self.values.is_empty() && self.selected_item < self.values.len() - 1 {
self.selected_item += 1;
dispatch_action(
cx,
cx.widget_action(
uid,
&scope.path,
WechatDropDownAction::Select(
self.selected_item,
self.values[self.selected_item].clone(),
),
self.values
.get(self.selected_item)
.cloned()
.unwrap_or(LiveValue::None)
)
);
self.set_closed(cx);
self.draw_bg.redraw(cx);
@ -289,7 +322,7 @@ impl WechatDropDown {
};
}
pub fn draw_walk(&mut self, cx: &mut Cx2d, walk: Walk) {
fn draw_walk(&mut self, cx: &mut Cx2d, _scope: &mut Scope, walk: Walk) -> DrawStep {
// cx.clear_sweep_lock(self.draw_bg.area());
self.draw_bg.begin(cx, walk, self.layout);
@ -314,73 +347,15 @@ impl WechatDropDown {
popup_menu.end(cx, self.draw_bg.area());
}
DrawStep::done()
}
}
// It is named WechatDropDown because DropDown is already a widget in makepad_widgets
impl Widget for WechatDropDown {
fn widget_to_data(
&self,
_cx: &mut Cx,
actions: &WidgetActions,
nodes: &mut LiveNodeVec,
path: &[LiveId],
) -> bool {
match actions.single_action(self.widget_uid()) {
WechatDropDownAction::Select(_, value) => {
nodes.write_field_value(path, value.clone());
true
}
_ => false,
}
}
fn data_to_widget(&mut self, cx: &mut Cx, nodes: &[LiveNode], path: &[LiveId]) {
if let Some(value) = nodes.read_field_value(path) {
if let Some(index) = self.values.iter().position(|v| v == value) {
if self.selected_item != index {
self.selected_item = index;
self.redraw(cx);
}
} else {
// error!("Value not in values list {:?}", value);
}
}
}
fn redraw(&mut self, cx: &mut Cx) {
self.draw_bg.redraw(cx);
}
fn handle_widget_event_with(
&mut self,
cx: &mut Cx,
event: &Event,
dispatch_action: &mut dyn FnMut(&mut Cx, WidgetActionItem),
) {
let uid = self.widget_uid();
self.handle_event_with(cx, event, &mut |cx, action| {
dispatch_action(cx, WidgetActionItem::new(action.into(), uid))
});
}
fn walk(&mut self, _cx: &mut Cx) -> Walk {
self.walk
}
fn draw_walk_widget(&mut self, cx: &mut Cx2d, walk: Walk) -> WidgetDraw {
self.draw_walk(cx, walk);
WidgetDraw::done()
}
}
#[derive(Clone, PartialEq, WidgetRef)]
pub struct WechatDropDownRef(WidgetRef);
impl WechatDropDownRef {
pub fn item_clicked(&mut self, item_id: &[LiveId], actions: &WidgetActions) -> bool {
if let Some(item) = actions.find_single_action(self.widget_uid()) {
if let WechatDropDownAction::Select(_id, value) = item.action() {
pub fn item_clicked(&mut self, item_id: &[LiveId], actions: &Actions) -> bool {
if let Some(item) = actions.find_widget_action(self.widget_uid()) {
if let WechatDropDownAction::Select(_id, value) = item.cast() {
return LiveValue::Bool(true) == value.enum_eq(item_id)
}
}

52
src/shared/header.rs
View file

@ -165,59 +165,23 @@ live_design! {
}
}
#[derive(Live)]
#[derive(Live, LiveHook, Widget)]
pub struct HeaderDropDownMenu {
#[deref]
view: View,
}
impl LiveHook for HeaderDropDownMenu {
fn before_live_design(cx: &mut Cx) {
register_widget!(cx, HeaderDropDownMenu);
}
}
impl Widget for HeaderDropDownMenu {
fn handle_widget_event_with(
&mut self,
cx: &mut Cx,
event: &Event,
dispatch_action: &mut dyn FnMut(&mut Cx, WidgetActionItem),
) {
fn handle_event(&mut self, cx: &mut Cx, event: &Event, scope: &mut Scope) {
let uid = self.widget_uid();
self.handle_event_with(cx, event, &mut |cx, action: StackViewAction| {
dispatch_action(cx, WidgetActionItem::new(action.into(), uid));
});
}
fn redraw(&mut self, cx: &mut Cx) {
self.view.redraw(cx);
}
fn walk(&mut self, cx: &mut Cx) -> Walk {
self.view.walk(cx)
}
fn find_widgets(&mut self, path: &[LiveId], cached: WidgetCache, results: &mut WidgetSet) {
self.view.find_widgets(path, cached, results);
}
fn draw_walk_widget(&mut self, cx: &mut Cx2d, walk: Walk) -> WidgetDraw {
self.view.draw_walk_widget(cx, walk)
}
}
impl HeaderDropDownMenu {
pub fn handle_event_with(
&mut self,
cx: &mut Cx,
event: &Event,
dispatch_action: &mut dyn FnMut(&mut Cx, StackViewAction),
) {
let actions = self.view.handle_widget_event(cx, event);
let actions = cx.capture_actions(|cx| self.view.handle_event(cx, event, scope));
if self.wechat_drop_down(id!(menu)).item_clicked(id!(AddContact), &actions) {
dispatch_action(cx, StackViewAction::ShowAddContact);
cx.widget_action(uid, &scope.path, StackViewAction::ShowAddContact);
}
}
fn draw_walk(&mut self, cx: &mut Cx2d, scope: &mut Scope, walk: Walk) -> DrawStep {
self.view.draw_walk(cx, scope, walk)
}
}

143
src/shared/popup_menu.rs
View file

@ -7,41 +7,6 @@ live_design! {
import makepad_widgets::theme_desktop_dark::*;
import crate::shared::styles::*;
DrawBg = {{DrawBg}} {
instance color: #4
instance color_selected: #5
instance border_radius: 4.0
fn pixel(self) -> vec4 {
let sdf = Sdf2d::viewport(self.pos * self.rect_size)
sdf.box(
1.0,
1.0,
self.rect_size.x,
self.rect_size.y,
self.border_radius
)
sdf.fill_keep(mix(self.color, self.color_selected, self.hover))
return sdf.result;
}
}
DrawName = {{DrawName}} {
text_style: <REGULAR_TEXT>{font_size: 9},
fn get_color(self) -> vec4 {
return mix(
mix(
THEME_COLOR_TEXT_DEFAULT,
THEME_COLOR_TEXT_SELECTED,
self.selected
),
THEME_COLOR_TEXT_HOVER,
self.hover
)
}
}
MenuItem = {{MenuItem}} {
align: {y: 0.5},
padding: {left: 5., top: 10., bottom: 10., right: 5.},
@ -49,6 +14,46 @@ live_design! {
width: Fill,
height: Fit
draw_bg: {
instance color: #4
instance color_selected: #5
instance border_radius: 4.0
instance selected: 0.0
instance hover: 0.0
fn pixel(self) -> vec4 {
let sdf = Sdf2d::viewport(self.pos * self.rect_size)
sdf.box(
1.0,
1.0,
self.rect_size.x,
self.rect_size.y,
self.border_radius
)
sdf.fill_keep(mix(self.color, self.color_selected, self.hover))
return sdf.result;
}
}
draw_name: {
text_style: <REGULAR_TEXT>{font_size: 9},
instance selected: 0.0
instance hover: 0.0
fn get_color(self) -> vec4 {
return mix(
mix(
THEME_COLOR_TEXT_DEFAULT,
THEME_COLOR_TEXT_SELECTED,
self.selected
),
THEME_COLOR_TEXT_HOVER,
self.hover
)
}
}
icon_walk: {width: 15., height: Fit, margin: {bottom: 3.}}
draw_icon: {
color: #f2f2f2;
@ -152,29 +157,7 @@ live_design! {
}
}
#[derive(Live, LiveHook)]
#[repr(C)]
struct DrawBg {
#[deref]
draw_super: DrawQuad,
#[live]
selected: f32,
#[live]
hover: f32,
}
#[derive(Live, LiveHook)]
#[repr(C)]
struct DrawName {
#[deref]
draw_super: DrawText,
#[live]
selected: f32,
#[live]
hover: f32,
}
#[derive(Live)]
#[derive(Live, LiveRegister, WidgetWrap)]
pub struct PopupMenu {
#[live]
draw_list: DrawList2d,
@ -182,9 +165,9 @@ pub struct PopupMenu {
#[live]
menu_item: Option<LivePtr>,
#[live]
#[live] #[redraw]
draw_bg: DrawQuad,
#[live]
#[live] #[redraw]
draw_icon: DrawIcon,
#[live]
icon_walk: Walk,
@ -213,10 +196,6 @@ pub struct PopupMenu {
}
impl LiveHook for PopupMenu {
fn before_live_design(cx: &mut Cx) {
register_widget!(cx, PopupMenu)
}
fn after_apply(&mut self, cx: &mut Cx, from: ApplyFrom, index: usize, nodes: &[LiveNode]) {
if let Some(index) = nodes.child_by_name(index, live_id!(list_node).as_field()) {
for (_, node) in self.menu_items.iter_mut() {
@ -228,28 +207,14 @@ impl LiveHook for PopupMenu {
}
impl Widget for PopupMenu {
fn handle_widget_event_with(
&mut self,
_cx: &mut Cx,
_event: &Event,
_dispatch_action: &mut dyn FnMut(&mut Cx, WidgetActionItem),
) {
fn handle_event(&mut self, _cx: &mut Cx, _event: &Event, _scope: &mut Scope) {
}
fn draw_walk_widget(&mut self, cx: &mut Cx2d, walk: Walk) -> WidgetDraw {
fn draw_walk(&mut self, cx: &mut Cx2d, _scope: &mut Scope, walk: Walk) -> DrawStep {
self.draw_bg.begin(cx, walk, self.layout);
self.draw_icon.draw_walk(cx, self.icon_walk);
self.draw_bg.end(cx);
WidgetDraw::done()
}
fn walk(&mut self, _cx: &mut Cx) -> Walk {
self.walk
}
fn redraw(&mut self, cx: &mut Cx) {
self.draw_bg.redraw(cx);
self.draw_icon.redraw(cx);
DrawStep::done()
}
}
@ -347,19 +312,19 @@ impl PopupMenu {
}
}
#[derive(Live, LiveHook)]
#[derive(Live, LiveHook, LiveRegister, WidgetWrap)]
pub struct MenuItem {
#[layout]
layout: Layout,
#[walk]
walk: Walk,
#[live]
draw_bg: DrawBg,
#[live]
draw_name: DrawName,
#[live] #[redraw]
draw_bg: DrawQuad,
#[live] #[redraw]
draw_name: DrawText,
#[live]
#[live] #[redraw]
draw_icon: DrawIcon,
#[live]
icon_walk: Walk,
@ -377,7 +342,7 @@ pub struct MenuItem {
selected: f32,
}
#[derive(Default, Clone)]
#[derive(Default, Clone, Debug)]
pub enum MenuItemAction {
WasSweeped,
WasSelected,
@ -385,7 +350,7 @@ pub enum MenuItemAction {
None,
}
#[derive(Clone, WidgetAction, Debug)]
#[derive(Clone, DefaultNone, Debug)]
pub enum PopupMenuAction {
WasSweeped(MenuItemId),
WasSelected(MenuItemId),

1
src/shared/search_bar.rs
View file

@ -20,7 +20,6 @@ live_design! {
clip_y: true,
align: {y: 0.5}
empty_message: "Search"
// text: "Here"
draw_bg: {
color: #fff
}

121
src/shared/stack_navigation.rs
View file

@ -32,7 +32,6 @@ live_design! {
visible: false
width: Fill, height: Fill
flow: Down
// flow: Overlay
show_bg: true
draw_bg: {
color: #fff
@ -41,6 +40,7 @@ live_design! {
header = <Header> {}
// TBD Adjust this based on actual screen size
// offset: 400.0
offset: 2.0
animator: {
@ -51,7 +51,7 @@ live_design! {
from: {all: Forward {duration: 0.3}}
// Bug: Constants are not working as part of an live state value
// apply: {offset: 400.0}
apply: {offset: 0.0}
apply: {offset: 2.0}
}
show = {
@ -71,7 +71,7 @@ live_design! {
}
}
#[derive(Live)]
#[derive(Live, LiveHook, Widget)]
pub struct StackNavigationView {
#[deref]
view:View,
@ -83,75 +83,35 @@ pub struct StackNavigationView {
animator: Animator,
}
impl LiveHook for StackNavigationView {
fn before_live_design(cx: &mut Cx) {
register_widget!(cx, StackNavigationView);
}
}
impl Widget for StackNavigationView {
fn walk(&mut self, cx: &mut Cx) -> Walk {
self.view.walk(cx)
}
fn redraw(&mut self, cx: &mut Cx) {
self.view.redraw(cx)
}
fn find_widgets(&mut self, path: &[LiveId], cached: WidgetCache, results: &mut WidgetSet) {
self.view.find_widgets(path, cached, results);
}
fn handle_widget_event_with(
&mut self,
cx: &mut Cx,
event: &Event,
dispatch_action: &mut dyn FnMut(&mut Cx, WidgetActionItem),
) {
self.handle_event_with(cx, event, dispatch_action);
}
fn draw_walk_widget(&mut self, cx: &mut Cx2d, walk: Walk) -> WidgetDraw {
self.view.draw_walk_widget(
cx,
walk.with_abs_pos(DVec2 {
x: self.offset,
y: 0.,
}),
)
}
}
impl StackNavigationView {
pub fn handle_event_with(
&mut self,
cx: &mut Cx,
event: &Event,
dispatch_action: &mut dyn FnMut(&mut Cx, WidgetActionItem),
) {
fn handle_event(&mut self, cx:&mut Cx, event:&Event, scope:&mut Scope) {
if self.animator_handle_event(cx, event).is_animating() {
self.view.redraw(cx);
}
let actions = self.view.handle_widget_event(cx, event);
let actions = cx.capture_actions(|cx| self.view.handle_event(cx, event, scope));
if self.button(id!(left_button)).clicked(&actions) {
self.animator_play(cx, id!(slide.hide));
}
for action in actions.into_iter() {
dispatch_action(cx, action);
}
if self.animator.animator_in_state(cx, id!(slide.hide))
&& !self.animator.is_track_animating(cx, id!(slide))
{
self.apply_over(cx, live! {visible: false});
}
}
}
#[derive(Clone, PartialEq, WidgetRef)]
pub struct StackNavigationViewRef(pub WidgetRef);
fn draw_walk(&mut self, cx:&mut Cx2d, scope:&mut Scope, walk:Walk) -> DrawStep{
self.view.draw_walk(
cx,
scope,
walk.with_abs_pos(DVec2 {
x: self.offset,
y: 0.,
}),
)
}
}
impl StackNavigationViewRef {
pub fn show(&mut self, cx: &mut Cx) {
@ -186,42 +146,39 @@ enum ActiveStackView {
Active(LiveId),
}
#[derive(Live)]
#[derive(Live, LiveRegisterWidget, WidgetRef)]
pub struct StackNavigation {
#[deref]
view: View,
#[rust]
active_stack_view: ActiveStackView,
}
impl LiveHook for StackNavigation {
fn before_live_design(cx: &mut Cx) {
register_widget!(cx, StackNavigation);
}
fn after_new_from_doc(&mut self, _cx: &mut Cx) {
self.active_stack_view = ActiveStackView::None;
}
}
impl Widget for StackNavigation {
fn handle_widget_event_with(
&mut self,
cx: &mut Cx,
event: &Event,
dispatch_action: &mut dyn FnMut(&mut Cx, WidgetActionItem),
) {
let mut actions = vec![];
fn handle_event(&mut self, cx: &mut Cx, event: &Event, scope: &mut Scope) {
for widget_ref in self.get_active_views(cx).iter() {
for a in widget_ref.handle_widget_event(cx, event) {
actions.push(a);
}
widget_ref.handle_event(cx, event, scope);
}
}
for action in actions.into_iter() {
dispatch_action(cx, action);
fn draw_walk(&mut self, cx: &mut Cx2d, scope: &mut Scope, walk: Walk) -> DrawStep {
for widget_ref in self.get_active_views(cx.cx).iter() {
widget_ref.draw_walk(cx, scope, walk) ?;
}
DrawStep::done()
}
}
impl WidgetNode for StackNavigation {
fn walk(&mut self, cx:&mut Cx) -> Walk{
self.view.walk(cx)
}
fn redraw(&mut self, cx: &mut Cx) {
@ -231,18 +188,11 @@ impl Widget for StackNavigation {
}
fn find_widgets(&mut self, path: &[LiveId], cached: WidgetCache, results: &mut WidgetSet) {
// We're only usingView widget ability to find widgets
self.view.find_widgets(path, cached, results);
}
fn draw_walk_widget(&mut self, cx: &mut Cx2d, walk: Walk) -> WidgetDraw {
for widget_ref in self.get_active_views(cx.cx).iter() {
widget_ref.draw_walk_widget(cx, walk) ?;
}
WidgetDraw::done()
}
}
impl StackNavigation {
pub fn show_stack_view_by_id(&mut self, stack_view_id: LiveId, cx: &mut Cx) {
if let ActiveStackView::None = self.active_stack_view {
@ -277,9 +227,6 @@ impl StackNavigation {
}
}
#[derive(Clone, PartialEq, WidgetRef, Debug)]
pub struct StackNavigationRef(pub WidgetRef);
impl StackNavigationRef {
pub fn show_stack_view_by_id(&mut self, stack_view_id: LiveId, cx: &mut Cx) {
if let Some(mut inner) = self.borrow_mut() {
@ -287,9 +234,9 @@ impl StackNavigationRef {
}
}
pub fn handle_stack_view_actions(&mut self, cx: &mut Cx, actions: &WidgetActions, destinations: &HashMap<StackViewAction, LiveId>) {
pub fn handle_stack_view_actions(&mut self, cx: &mut Cx, actions: &Actions, destinations: &HashMap<StackViewAction, LiveId>) {
for action in actions {
let stack_view_action = action.action();
let stack_view_action = action.as_widget_action().cast();
if let Some(stack_view_id) = destinations.get(&stack_view_action) {
self.show_stack_view_by_id(*stack_view_id, cx);
break;

4
src/shared/stack_view_action.rs
View file

@ -1,11 +1,11 @@
use makepad_widgets::*;
#[derive(Clone, WidgetAction, Eq, Hash, PartialEq)]
#[derive(Clone, DefaultNone, Eq, Hash, PartialEq, Debug)]
pub enum StackViewAction {
None,
ShowAddContact,
ShowMoments,
ShowMyProfile,
ShowCounterScreen,
ShowMyProfile,
ShowChat,
}

177
src/welcome/welcome_screen.rs
View file

@ -14,84 +14,53 @@ live_design! {
import crate::shared::search_bar::SearchBar;
import crate::shared::custom_button::CustomButton;
IMG_DEFAULT_AVATAR = dep("crate://self/resources/img/default_avatar.png")
IMG_FAVORITES = dep("crate://self/resources/img/favorites.png")
IMG_MY_POSTS = dep("crate://self/resources/img/my-posts.png")
IMG_STICKER_GALLERY = dep("crate://self/resources/img/sticker-gallery.png")
IMG_SETTINGS = dep("crate://self/resources/img/settings.png")
IMG_QR = dep("crate://self/resources/img/qr_icon.png")
Welcome = {{Welcome}} {
view: {
width: Fill, height: Fill
spacing: 10.
draw_bg: {
color: #000
}
WelcomeInfo = <View> {
width: Fill, height: Fill
flow: Right,
spacing: 10.,
// padding: {top: 100., bottom: 100., right: 10., left: 10.}
align: {
x: 0.5,
y: 0.5
},
show_bg: true
// show_bg: true
draw_bg: {
color: #f00 //Color Red
}
<View> {
align: {x: 0.5, y: 0.5}
container = <RoundedView> {
width: 360
height: 400
flow: Down
align: {x: 0.5, y: 0.5}
spacing: 2.0
draw_bg: {
color: #fff
color: #ddd,
radius: (CARD_CORNER_RADIUS)
}
<View> {
width: Fill height: Fill
show_bg: false
// align:{ x: 0.5 }
align: {x: 0.5, y: 0.5}
container = <RoundedView> {
width: 360
height: 400
flow: Down
align: {x: 0.5, y: 0.5}
// margin: {left: 200.0, right: 200.0, top: 100.0, bottom: 100.0}
spacing: 2.0
draw_bg: {
color: #ddd,
// border_width: 1.0,
// border_color: #000,
radius: (CARD_CORNER_RADIUS)
width: Fit, height: Fill
flow: Down,
align: {x: 0, y: 0.5},
padding: {top: 5., left: 10., right: 10.}, spacing: 20.
username = <Label> {
draw_text:{
color: #000,
text_style: <TEXT_SUB>{font_size: 20.},
}
<View> {
width: Fill, height: Fill
flow: Down,
align: {x: 0, y: 0.5},
padding: {top: 5., left: 10., right: 10.}, spacing: 20.
username = <Label> {
draw_text:{
color: #000,
text_style: <TEXT_SUB>{font_size: 20.},
}
text:"Welcome To Simple Nav"
}
message_input = <SearchBar> {
show_bg: false
input = {
width: Fill, height: Fit, margin: 0
empty_message: "Enter Your Name"
draw_bg: {
color: #fff
border_width: 0.5,
border_color: #b4b4b4,
}
}
}
welcome_frame = <CustomButton> {
button = {
text: "Welcome"
}
text:"Welcome To Simple Nav"
}
message_input = <SearchBar> {
show_bg: false
input = {
width: Fill, height: Fit, margin: 0
empty_message: "Enter Your Name"
draw_bg: {
color: #fff
border_width: 0.5,
border_color: #b4b4b4,
}
}
}
welcome_frame = <CustomButton> {
button = {
text: "Welcome"
}
}
}
}
}
}
@ -102,75 +71,33 @@ live_design! {
}
}
#[derive(Live)]
#[derive(Live, LiveHook, Widget)]
pub struct Welcome {
#[live]
view:View,
}
impl LiveHook for Welcome {
fn before_live_design(cx: &mut Cx) {
register_widget!(cx, Welcome);
}
#[deref] view: View
}
impl Widget for Welcome {
fn handle_widget_event_with(
&mut self,
cx: &mut Cx,
event: &Event,
dispatch_action: &mut dyn FnMut(&mut Cx, WidgetActionItem),
) {
let uid = self.widget_uid();
self.handle_event_with(cx, event, &mut |cx, action: StackViewAction| {
dispatch_action(cx, WidgetActionItem::new(action.into(), uid));
});
}
fn redraw(&mut self, cx: &mut Cx) {
self.view.redraw(cx);
}
fn find_widgets(&mut self, path: &[LiveId], cached: WidgetCache, results: &mut WidgetSet) {
self.view.find_widgets(path, cached, results);
}
fn draw_walk_widget(&mut self, cx: &mut Cx2d, walk: Walk) -> WidgetDraw {
self.view.draw_walk_widget(cx, walk)
}
}
impl Welcome {
fn handle_event_with(
&mut self,
cx: &mut Cx,
event: &Event,
dispatch_action: &mut dyn FnMut(&mut Cx, StackViewAction),
) {
let actions = self.view.handle_widget_event(cx, event);
fn handle_event(&mut self, cx: &mut Cx, event: &Event, scope: &mut Scope) {
let actions = cx.capture_actions(|cx| self.view.handle_event(cx, event, scope));
// if self
// .view
// .clickable_view(id!(welcome_frame))
// .clickable_view(id!(my_profile_frame))
// .clicked(&actions)
// {
// dispatch_action(cx, StackViewAction::ShowCounterScreen);
// // let input11 = self.view.text_input(id!(message_input));
// let user_prompt1 = self.view.text_input(id!(message_input.input)).text();
// log!("WELCOME BUTTON CLICKED: {}", user_prompt1);
// let uid = self.widget_uid();
// cx.widget_action(uid, &scope.path, StackViewAction::ShowMyProfile);
// }
if self.view.button(id!(welcome_frame)).clicked(&actions)
{
dispatch_action(cx, StackViewAction::ShowCounterScreen);
let uid = self.widget_uid();
cx.widget_action(uid, &scope.path, StackViewAction::ShowCounterScreen);
// dispatch_action(cx, StackViewAction::ShowCounterScreen);
let user_prompt1 = self.view.text_input(id!(message_input.input)).text();
log!("WELCOME BUTTON CLICKED: {}", user_prompt1);
// log!("BUTTON CLICKED {}", self.counter);
// self.counter += 1;
// let label = self.view.label(id!(label1));
// label.set_text_and_redraw(cx,&format!("Counter: {}", self.counter));
}
}
fn draw_walk(&mut self, cx: &mut Cx2d, scope: &mut Scope, walk: Walk) -> DrawStep {
self.view.draw_walk(cx, scope, walk)
}
}