This commit is contained in:
Tsuki 2024-11-26 15:01:18 +08:00
parent 8cbcc869d3
commit 7a6e41838f
6 changed files with 95 additions and 88 deletions

View File

@ -0,0 +1,15 @@
<svg xmlns="http://www.w3.org/2000/svg" width="200" height="200" viewBox="0 0 200 200">
<circle cx="100" cy="100" r="90" fill="#e0e0e0" stroke="#b0b0b0" stroke-width="2" />
<!-- 雷达网格 -->
<circle cx="100" cy="100" r="70" fill="none" stroke="#a0a0a0" stroke-width="1" />
<circle cx="100" cy="100" r="50" fill="none" stroke="#a0a0a0" stroke-width="1" />
<circle cx="100" cy="100" r="30" fill="none" stroke="#a0a0a0" stroke-width="1" />
<line x1="100" y1="10" x2="100" y2="190" stroke="#a0a0a0" stroke-width="1" />
<line x1="10" y1="100" x2="190" y2="100" stroke="#a0a0a0" stroke-width="1" />
<line x1="30" y1="30" x2="170" y2="170" stroke="#a0a0a0" stroke-width="1" />
<line x1="170" y1="30" x2="30" y2="170" stroke="#a0a0a0" stroke-width="1" />
<!-- 雷达扫描扇形 -->
<path d="M100,100 L100,10 A90,90 0 0,1 160,40 Z" fill="rgba(255, 255, 255, 0.3)" />
<!-- 中心点 -->
<circle cx="100" cy="100" r="5" fill="#ffffff" />
</svg>

After

Width:  |  Height:  |  Size: 964 B

View File

@ -0,0 +1 @@
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M512 85.333333C280.704 85.333333 85.333333 280.746667 85.333333 512s195.370667 426.666667 426.666667 426.666667 426.666667-195.413333 426.666667-426.666667S743.296 85.333333 512 85.333333z m0 768c-185.045333 0-341.333333-156.330667-341.333333-341.333333 0-170.581333 132.906667-316.458667 298.666666-338.218667V259.84C348.458667 280.277333 256 385.408 256 512c0 141.184 114.816 256 256 256 68.053333 0 132.266667-26.709333 180.778667-75.221333l-60.330667-60.373334A169.386667 169.386667 0 0 1 512 682.666667c-94.122667 0-170.666667-76.544-170.666667-170.666667 0-79.274667 54.570667-145.536 128-164.608v91.562667c-25.173333 15.061333-42.666667 42.368-42.666666 73.045333 0 46.122667 39.210667 85.333333 85.333333 85.333333s85.333333-39.210667 85.333333-85.333333c0-30.677333-17.493333-57.984-42.666666-73.045333V173.781333c165.76 21.76 298.666667 167.637333 298.666666 338.218667 0 185.002667-156.288 341.333333-341.333333 341.333333z" /></svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

@ -0,0 +1 @@
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M948.411376 243.34925L529.941637 4.548584c-11.37146-6.822876-25.017213-6.822876-36.388673 0L75.083225 243.34925c-11.37146 6.822876-18.194336 18.194336-18.194336 31.840089V750.51638c0 13.645752 6.822876 25.017213 18.194336 31.840089l418.469739 236.526374c11.37146 6.822876 25.017213 6.822876 36.388673 0l418.469739-236.526374c11.37146-6.822876 18.194336-18.194336 18.194337-31.840089V275.189339c0-13.645752-6.822876-25.017213-18.194337-31.840089zM891.554075 727.773459l-343.418101 195.589117v-120.537479h-75.051638v120.537479L131.940527 727.773459V336.595225l104.617435 59.131593 36.388673-63.680177L168.3292 272.915047 511.747301 79.600222l343.418101 195.589117-104.617435 59.131594 36.388673 63.680177 104.617435-59.131593V727.773459z" fill="#C4C4C4" /><path d="M357.095441 623.156024c-6.822876-6.822876-13.645752-15.920044-18.194337-25.017212h-45.485841c4.548584 25.017213 15.920044 45.485841 31.840089 59.131593 15.920044 13.645752 36.388673 20.468629 56.857301 20.468629 27.291505 0 50.034425-9.097168 68.228762-27.291505 18.194336-15.920044 27.291505-40.937257 27.291505-68.228762 0-13.645752-2.274292-25.017213-9.097168-38.662965-6.822876-11.37146-15.920044-22.742921-29.565797-31.840089 13.645752-9.097168 22.742921-18.194336 27.291505-29.565796 4.548584-11.37146 6.822876-22.742921 6.822876-34.114381 0-22.742921-9.097168-45.485841-25.017213-61.405886-15.920044-18.194336-40.937257-27.291505-68.228762-27.291505-22.742921 0-43.211549 9.097168-59.131593 25.017213-15.920044 15.920044-25.017213 34.114381-27.291505 59.131594h45.485841c2.274292-13.645752 9.097168-22.742921 18.194337-29.565797 9.097168-6.822876 15.920044-9.097168 27.291505-9.097168 13.645752 0 25.017213 4.548584 34.11438 11.37146 9.097168 9.097168 13.645752 20.468629 13.645753 31.840089 0 13.645752-4.548584 22.742921-13.645753 31.840089-9.097168 9.097168-20.468629 13.645752-36.388673 13.645752h-15.920044v38.662965h18.194337c13.645752 0 25.017213 4.548584 34.11438 11.37146 9.097168 9.097168 13.645752 20.468629 13.645753 36.388673 0 15.920044-4.548584 27.291505-13.645753 36.388673-9.097168 9.097168-20.468629 13.645752-34.11438 13.645753-9.097168 4.548584-18.194336 0-27.291505-6.822877zM732.353631 459.406996V454.858412c-2.274292-13.645752-6.822876-25.017213-13.645753-36.388673-25.017213-36.388673-56.857301-54.583009-100.06885-54.583009h-111.440311v311.578012h106.891727c22.742921 0 43.211549-4.548584 59.131593-15.920045 15.920044-9.097168 29.565797-22.742921 38.662965-36.388673 2.274292-4.548584 6.822876-11.37146 9.097168-15.920044 2.274292-4.548584 4.548584-11.37146 4.548585-18.194336 2.274292-13.645752 4.548584-36.388673 4.548584-70.503054v-6.822877c2.274292-22.742921 2.274292-40.937257 2.274292-52.308717z m-47.760134 79.600222c0 18.194336 0 31.840089-2.274292 40.937257-2.274292 9.097168-4.548584 15.920044-9.097168 22.742921l-2.274292 2.274292v2.274292c-11.37146 15.920044-31.840089 25.017213-56.857301 25.017213H557.233142V409.372571H623.187612c20.468629 2.274292 36.388673 11.37146 47.760133 25.017212 6.822876 6.822876 11.37146 15.920044 11.37146 27.291505 2.274292 11.37146 2.274292 27.291505 2.274292 52.308718v25.017212z" fill="#C4C4C4" /></svg>

After

Width:  |  Height:  |  Size: 3.3 KiB

View File

@ -20,6 +20,7 @@ live_design! {
import makepad_widgets::base::*;
import makepad_widgets::theme_desktop_dark::*;
import crate::app_ui::MainView;
import crate::widgets::selector::*;
HELLO = "Hello, World!";
@ -52,10 +53,17 @@ live_design! {
x: 0.5,
y: 0.5
}
<Label> {
text: "Content in the modal"
}
}
selector_modal = <Modal> {
content: {
height: 470
width:650
show_bg: false
selector = <Selector> {}
}
}
notification = <PopupNotification> {
@ -202,8 +210,7 @@ impl MatchEvent for App {
render_task.render().await;
});
let items = vec![
(
let items = vec![(
ItemKey {
path: "path".to_string(),
category: "category".to_string(),
@ -212,68 +219,34 @@ impl MatchEvent for App {
vec![
ItemValue {
name: "Item 1".to_string(),
icon: "icon_radar.svg".to_string(),
},
ItemValue {
name: "Item 2".to_string(),
icon: "icon_threed.svg".to_string(),
},
],
),
(
ItemKey {
path: "path".to_string(),
category: "category".to_string(),
description: "description_1".to_string(),
},
vec![
ItemValue {
name: "Item 1".to_string(),
},
ItemValue {
name: "Item 2".to_string(),
},
],
),
(
ItemKey {
path: "path".to_string(),
category: "category".to_string(),
description: "description_2".to_string(),
},
vec![
ItemValue {
name: "Item 1".to_string(),
},
ItemValue {
name: "Item 2".to_string(),
},
],
),
(
ItemKey {
path: "path".to_string(),
category: "category".to_string(),
description: "description_1".to_string(),
},
vec![
ItemValue {
name: "Item 1".to_string(),
},
ItemValue {
name: "Item 3".to_string(),
},
],
),
];
)];
ui.selector(id!(a)).set_items(cx, items);
ui.selector(id!(selector)).set_items(cx, items);
}
fn handle_signal(&mut self, cx: &mut Cx) {
self.file_manager.try_deal_file(cx);
}
fn handle_actions(&mut self, cx: &mut Cx, actions: &Actions) {
let ui = self.ui.clone();
if ui.button(id!(open_modal)).clicked(actions) {
let modal = ui.modal(id!(selector_modal));
modal.open(cx);
}
}
fn handle_action(&mut self, _cx: &mut Cx, e: &Action) {
let ui = self.ui.clone();
match e.cast() {
AppAction::OpenFile => {
use native_dialog::FileDialog;

View File

@ -70,8 +70,6 @@ live_design! {
x: 0.5,
y: 0.5
}
a = <Selector> {}
}
}

View File

@ -9,6 +9,8 @@ live_design! {
import makepad_draw::shader::std::*;
ICO_SEARCH = dep("crate://self/resources/icons/Icon_Search.svg")
RADAR = dep("crate://self/resources/icons/icon_radar.svg")
THREED = dep("crate://self/resources/icons/icon_threed.svg")
RView = <ViewBase> {
show_bg: true,
@ -50,21 +52,21 @@ live_design! {
}
padding: {
left:10
left:20
}
draw_bg: {
color: #3c3c3c
border_color: #fff
color: #202121
border_color: #9c9c9c
border_width: 0.5
}
class_title = <Label> {
draw_text: {
color: #fff
color: #9c9c9c
text_style: <THEME_FONT_BOLD>{
font_size: 8.0
font_size: 10.0
}
}
@ -125,9 +127,7 @@ live_design! {
}
draw_icon: {
svg_file: dep("crate://self/resources/logo_makepad.svg")
svg_file: (THREED)
fn get_color(self) -> vec4 {
return #0A60FE;
}
@ -151,36 +151,54 @@ live_design! {
Selector = {{Selector}} {
<RoundedShadowView> {
<RoundedView> {
height: Fill
width: Fill
flow: Down
padding: 15.0
padding: 20.0
align: {y:0.0}
draw_bg: {
color: #3c3c3c
shadow_radius: 30.0
color: #202121
radius: 5.0
}
<H3> {
text: "Selector"
}
<View> {
height: Fill
width: Fill
flow: Down
<Label> {
text: "choose a template for your project"
draw_text: {
color: #ffffff
}
margin: {
bottom: 5.0
}
}
<RView> {
height: 26
width: Fill
draw_bg: {
color: #303030
border_color: #9c9c9c
border_width: 0.5
}
}
<RView> {
height: Fill
width: Fill
flow: Down
draw_bg: {
color: #3c3c3c
border_color: #fff
color: #202121
border_color: #9c9c9c
border_width: 0.5
}
@ -217,19 +235,18 @@ live_design! {
spacing:10.0
<Button> {
width: 90
text: "Previous"
}
<Button> {
width: 90
text: "Next"
}
}
}
}
}
@ -251,6 +268,7 @@ pub struct ItemKey {
#[derive(Clone, PartialEq, Eq, Hash)]
pub struct ItemValue {
pub name: String,
pub icon: String,
}
#[derive(Live, LiveHook, Widget)]
@ -332,6 +350,7 @@ impl SelectorList {
self.items.insert(item.clone());
let new_ref = WidgetRef::new_from_ptr(cx, self.item_ref);
new_ref.as_selector_item().set_text(&item.name);
self.item_refs.push(new_ref);
}
}
@ -413,7 +432,7 @@ impl Widget for SelectorItem {
);
let icon_walk = Walk {
width: Size::Fixed(54.0),
width: Size::Fixed(32.0),
height: Size::Fit,
..Default::default()
};