GUI/grim
1
1
Fork 0
Code Issues 6 Pull requests Projects Releases 8 Packages Wiki Activity Actions

gui: fixed font, navigation (in progress)

Browse source
This commit is contained in:
ardocrat 2023-04-22 21:16:17 +03:00
parent 8ef5128ee8
commit 61f02c338d
7 changed files with 180 additions and 158 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

263
src/gui/app.rs
View file

@ -17,14 +17,14 @@ use std::collections::BTreeSet;
use eframe::emath::Align;
use eframe::epaint::FontFamily;
use eframe::Frame;
use egui::{Color32, Context, Direction, Id, Layout, RichText, Rounding, Sense, Separator, Stroke, TextStyle, Ui, Widget};
use egui::{Color32, Context, Direction, Id, Layout, RichText, Rounding, Sense, Separator, Stroke, Widget};
use egui::epaint::Shadow;
use egui::panel::PanelState;
use egui::style::Margin;
use egui_extras::Size;
use egui_extras::StripBuilder;
use wgpu::Color;
use crate::gui::{COLOR_YELLOW, PlatformCallbacks, SYM_ADD, SYM_ARROW_BACK, SYM_ARROW_FORWARD, SYM_MENU};
use crate::gui::*;
use crate::gui::screens::{Screen};
pub struct PlatformApp<Platform> {
@ -35,13 +35,13 @@ pub struct PlatformApp<Platform> {
pub struct Screens {
screens: Vec<Box<dyn Screen>>,
navigation: BTreeSet<String>,
menu_open: bool,
network_screen_open: bool,
}
impl Default for Screens {
fn default() -> Self {
Self::from_screens(vec![
Box::new(super::screens::Wallets::default())
Box::new(screens::Wallets::default())
])
}
}
@ -51,10 +51,10 @@ impl Screens {
let current = screens[0].name().to_owned();
let mut navigation = BTreeSet::new();
navigation.insert(current);
Self { screens, navigation, menu_open: false }
Self { screens, navigation, network_screen_open: false }
}
fn show_screens(&mut self, ui: &mut Ui, frame: &mut Frame, cb: &dyn PlatformCallbacks) {
fn show_screens(&mut self, ui: &mut egui::Ui, frame: &mut Frame, cb: &dyn PlatformCallbacks) {
let Self { screens, navigation, .. } = self;
for screen in screens {
let id = screen.name();
@ -81,155 +81,150 @@ impl Screens {
}
fn menu_is_open(&mut self, frame: &mut Frame) -> bool {
return self.menu_open;
return self.network_screen_open;
}
pub fn ui(&mut self, ui: &mut Ui, frame: &mut Frame, cb: &dyn PlatformCallbacks) {
let menu_open = self.menu_is_open(frame);
let bg_stroke_default = ui.style().visuals.widgets.noninteractive.bg_stroke;
ui.style_mut().visuals.widgets.noninteractive.bg_stroke = Stroke::NONE;
ui.style_mut().visuals.widgets.active.bg_stroke = Stroke::NONE;
egui::SidePanel::left("menu_panel")
.resizable(false)
.exact_width(if !is_landscape(frame) {
frame.info().window_info.size.x - 58.0
} else {
frame.info().window_info.size.y - 58.0
})
pub fn ui(&mut self, ctx: &Context, frame: &mut Frame, cb: &dyn PlatformCallbacks) {
egui::CentralPanel::default()
.frame(egui::Frame {
inner_margin: Margin::same(0.0),
outer_margin: Margin::same(0.0),
rounding: Default::default(),
shadow: Shadow::NONE,
fill: COLOR_YELLOW,
stroke: Stroke::NONE,
.. Default::default()
})
.show_animated_inside(ui, menu_open, |ui| {
//TODO: Menu content
ui.vertical_centered(|ui| {
ui.heading("💻 Backend");
});
.show(ctx, |ui| {
let menu_open = self.menu_is_open(frame);
ui.separator();
});
let bg_stroke_default = ui.style().visuals.widgets.noninteractive.bg_stroke;
ui.style_mut().visuals.widgets.noninteractive.bg_stroke = Stroke::NONE;
ui.style_mut().visuals.widgets.active.bg_stroke = Stroke::NONE;
egui::SidePanel::left("menu_panel")
.resizable(false)
.exact_width(if !is_landscape(frame) {
frame.info().window_info.size.x - 58.0
} else {
frame.info().window_info.size.y - 58.0
})
.frame(egui::Frame {
inner_margin: Margin::same(0.0),
outer_margin: Margin::same(0.0),
rounding: Default::default(),
shadow: Shadow::NONE,
fill: COLOR_YELLOW,
stroke: Stroke::NONE,
})
.show_animated_inside(ui, menu_open, |ui| {
//TODO: Menu content
ui.vertical_centered(|ui| {
ui.heading("🖧 Node");
});
ui.separator();
});
egui::TopBottomPanel::top("title_panel")
.resizable(false)
// .default_height(120.0)
.frame(egui::Frame {
fill: COLOR_YELLOW,
inner_margin: Margin::same(0.0),
outer_margin: Margin::same(0.0),
rounding: Default::default(),
..Default::default()
})
.show_inside(ui, |ui| {
StripBuilder::new(ui)
.size(Size::exact(58.0))
.vertical(|mut strip| {
strip.strip(|builder| {
builder
.size(Size::exact(58.0))
.size(Size::remainder())
.size(Size::exact(58.0))
.horizontal(|mut strip| {
strip.cell(|ui| {
ui.centered_and_justified(|ui| {
let b = egui::widgets::Button::new(
RichText::new(if !menu_open || is_landscape(frame) {
SYM_MENU
} else {
SYM_ARROW_FORWARD
}).size(24.0)
).fill(Color32::TRANSPARENT)
.ui(ui)
.interact(Sense::click_and_drag());
if b.drag_released() || b.clicked() {
self.menu_open = !menu_open
};
});
});
if !menu_open || is_landscape(frame) {
strip.strip(|builder| {
builder
.size(Size::remainder())
.vertical(|mut strip| {
strip.cell(|ui| {
ui.centered_and_justified(|ui| {
ui.label(RichText::new(self.current_screen_title()
.to_uppercase())
.size(20.0)
.color(Color32::BLACK)
);
egui::TopBottomPanel::top("title_panel")
.resizable(false)
// .default_height(120.0)
.frame(egui::Frame {
fill: COLOR_YELLOW,
inner_margin: Margin::same(0.0),
outer_margin: Margin::same(0.0),
rounding: Default::default(),
..Default::default()
})
.show_inside(ui, |ui| {
StripBuilder::new(ui)
.size(Size::exact(58.0))
.vertical(|mut strip| {
strip.strip(|builder| {
builder
.size(Size::exact(58.0))
.size(Size::remainder())
.size(Size::exact(58.0))
.horizontal(|mut strip| {
strip.cell(|ui| {
ui.centered_and_justified(|ui| {
let b = egui::widgets::Button::new(
RichText::new(if !menu_open {
SYM_NETWORK
} else {
if is_landscape(frame) {
SYM_MENU
} else {
SYM_WALLET
}
}).size(24.0)
).fill(Color32::TRANSPARENT)
.ui(ui)
.interact(Sense::click_and_drag());
if b.drag_released() || b.clicked() {
self.network_screen_open = !menu_open
};
});
});
if !menu_open || is_landscape(frame) {
strip.strip(|builder| {
builder
.size(Size::remainder())
.vertical(|mut strip| {
strip.cell(|ui| {
ui.centered_and_justified(|ui| {
ui.label(RichText::new(self.current_screen_title()
.to_uppercase())
.size(20.0)
.color(Color32::BLACK)
);
});
});
});
});
strip.cell(|ui| {
ui.centered_and_justified(|ui| {
let b = egui::widgets::Button::new(
RichText::new(SYM_ADD).size(24.0)
).fill(Color32::TRANSPARENT).ui(ui).interact(Sense::click_and_drag());
if b.drag_released() || b.clicked() {
//TODO: Add wallet
//self.menu_open = !menu_open
};
});
});
}
});
strip.cell(|ui| {
ui.centered_and_justified(|ui| {
let b = egui::widgets::Button::new(
RichText::new(SYM_ADD).size(24.0)
).fill(Color32::TRANSPARENT).ui(ui).interact(Sense::click_and_drag());
if b.drag_released() || b.clicked() {
//TODO: Add wallet
//self.menu_open = !menu_open
};
});
});
}
});
});
});
});
});
// ui.style_mut().visuals.widgets.noninteractive.bg_stroke = bg_stroke_default;
// ctx.style_mut().visuals.widgets.noninteractive.bg_stroke = bg_stroke_default;
// egui::SidePanel::right("screens_content")
// .resizable(false)
// .min_width(frame.info().window_info.size.x)
// .frame(egui::Frame {
// inner_margin: Margin::same(3.0),
// outer_margin: Margin::same(0.0),
// rounding: Default::default(),
// shadow: Shadow::NONE,
// fill: Color32::KHAKI,
// stroke: Stroke::NONE,
// })
// .show_inside(ui, |ui| {
// self.show_screens(ui, frame, cb);
// });
// egui::SidePanel::right("screens_content")
// .resizable(false)
// .min_width(frame.info().window_info.size.x)
// .frame(egui::Frame {
// inner_margin: Margin::same(3.0),
// outer_margin: Margin::same(0.0),
// rounding: Default::default(),
// shadow: Shadow::NONE,
// fill: Color32::KHAKI,
// stroke: Stroke::NONE,
// })
// .show_inside(ui, |ui| {
// self.show_screens(ui, frame, cb);
// });
egui::CentralPanel::default().frame(egui::containers::Frame {
outer_margin: Margin {
left: 0.0,
right: 0.0,
// top: 120.0,
top: 0.0,
bottom: 0.0,
},
rounding: if menu_open {
Rounding {
nw: 5.0,
ne: 0.0,
sw: 0.0,
se: 0.0,
}
} else {
Rounding::none()
},
inner_margin: Margin::same(3.0),
fill: ui.ctx().style().visuals.panel_fill,
stroke: bg_stroke_default,
..Default::default()
})
.show_inside(ui, |ui| {
if !menu_open || is_landscape(frame) {
self.show_screens(ui, frame, cb);
egui::CentralPanel::default().frame(egui::containers::Frame {
inner_margin: Margin::same(3.0),
fill: Color32::from_gray(30),
stroke: Stroke::new(1.0, Color32::from_gray(5)),
..Default::default()
})
.show_inside(ui, |ui| {
self.show_screens(ui, frame, cb);
});
}
});
}

10
src/gui/mod.rs
View file

@ -13,7 +13,9 @@
// limitations under the License.
mod app;
pub use app::PlatformApp;
pub use app::Screens;
pub use app::is_landscape;
pub mod platform;
@ -25,11 +27,9 @@ pub const COLOR_YELLOW: egui::Color32 = egui::Color32::from_rgb(254, 241, 2);
pub const SYM_ARROW_BACK: &str = "⇦";
pub const SYM_ARROW_FORWARD: &str = "⇨";
pub const SYM_ADD: &str = "＋";
pub const SYM_MENU: &str = "∷";//≡
pub trait Ui {
}
pub const SYM_MENU: &str = "∷";
pub const SYM_WALLET: &str = "💼";
pub const SYM_NETWORK: &str = "🖧";
pub trait PlatformCallbacks {
fn show_keyboard(&mut self);

4
src/gui/nav.rs
View file

@ -12,6 +12,10 @@
// See the License for the specific language governing permissions and
// limitations under the License.
use std::collections::BTreeSet;
struct Navigation {
// navigation_stack: BTreeSet<ScreenMode>,
}

33
src/gui/platform/android/mod.rs
View file

@ -12,11 +12,9 @@
// See the License for the specific language governing permissions and
// limitations under the License.
use egui::FontFamily;
use winit::platform::android::activity::AndroidApp;
use crate::gui::{PlatformApp, PlatformCallbacks};
use crate::gui::app::Screens;
use crate::gui::{PlatformApp, PlatformCallbacks, Screens};
#[derive(Clone)]
pub struct Android {
@ -71,13 +69,27 @@ impl PlatformApp<Android> {
use egui::FontFamily::Proportional;
let mut fonts = egui::FontDefinitions::default();
// Tweak emoji icons to look nice against main font y-offset
fonts.font_data.insert(
"emoji-icon-font".to_owned(),
egui::FontData {
font: fonts.font_data.get("emoji-icon-font").unwrap().clone().font,
index: 0,
tweak: egui::FontTweak {
scale: 0.88,
y_offset_factor: 0.26,
y_offset: 0.0,
},
});
fonts.font_data.insert(
"noto".to_owned(),
egui::FontData::from_static(include_bytes!(
"../../../../fonts/noto_light.ttf"
)).tweak(egui::FontTweak {
scale: 1.0,
y_offset_factor: -0.20,
y_offset_factor: -0.25,
y_offset: 0.0
}),
);
@ -142,19 +154,8 @@ impl eframe::App for PlatformApp<Android> {
self.platform.window_size[1] = _y;
self.platform.cutouts = Self::get_display_cutouts(&self.platform.android_app);
}
padding_panels(self, ctx);
egui::CentralPanel::default()
.frame(egui::Frame {
inner_margin: egui::style::Margin::same(0.0),
outer_margin: egui::style::Margin::same(0.0),
fill: ctx.style().visuals.panel_fill,
.. Default::default()
})
.show(ctx, |ui| {
self.screens.ui(ui, frame, &self.platform);
});
self.screens.ui(ctx, frame, &self.platform);
}
}

17
src/gui/screens/main.rs Normal file
View file

@ -0,0 +1,17 @@
// Copyright 2023 The Grim Developers
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
// http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.
pub struct Main {
}

1
src/gui/screens/mod.rs
View file

@ -13,6 +13,7 @@
// limitations under the License.
mod wallets;
mod main;
pub use wallets::Wallets;
use crate::gui::PlatformCallbacks;

10
src/gui/screens/wallets.rs
View file

@ -14,7 +14,7 @@
use std::ops::Deref;
use eframe::Frame;
use egui::{ScrollArea, Ui};
use egui::{Color32, ScrollArea, Ui, Widget};
use crate::gui::app::Screens;
use crate::gui::{PlatformCallbacks};
@ -36,11 +36,15 @@ impl super::Screen for Wallets {
}
fn show(&mut self, ui: &mut Ui, frame: &mut Frame, cb: &dyn PlatformCallbacks) {
// ui.visuals_mut().widgets = Color32::TRANSPARENT;
ScrollArea::vertical()
.auto_shrink([false; 2])
.auto_shrink([false, true])
.show(ui, |ui| {
for item in 1..=55 {
for item in 1..=4 {
ui.heading(format!("This is longest future Wallet #{}", item));
egui::Button::new("TEXT").shortcut_text("Shortcut").ui(ui);
ui.button("OK");
ui.button("Test");
}
});
}