ui: move global modal to root screen, refactor rounded box background painting, optimize center content

This commit is contained in:
ardocrat
2023-06-03 21:35:38 +03:00
parent 5143a39700
commit f95645ea81
8 changed files with 134 additions and 126 deletions
+4 -5
View File
@@ -76,7 +76,6 @@ impl Network {
outer_margin: Margin::same(5.0),
.. Default::default()
})
.resizable(false)
.show_inside(ui, |ui| {
self.draw_tabs(ui);
});
@@ -219,7 +218,7 @@ impl Network {
};
// Draw sync text
let status_color_rgba = Rgba::from(Colors::SUB_TITLE) * color_factor;
let status_color_rgba = Rgba::from(Colors::TEXT) * color_factor;
let status_color = Color32::from(status_color_rgba);
View::ellipsize_text(ui, Node::get_sync_status_text(), 15.0, status_color);
@@ -234,9 +233,9 @@ impl Network {
});
}
pub fn server_off_content(ui: &mut egui::Ui) {
View::center_content(ui, [ui.available_width() - 48.0, 160.0], |ui| {
let text = t!("network.inactive_message","dots" => DOTS_THREE_OUTLINE_VERTICAL);
pub fn disabled_server_content(ui: &mut egui::Ui) {
View::center_content(ui, 142.0, |ui| {
let text = t!("network.disabled_server", "dots" => DOTS_THREE_OUTLINE_VERTICAL);
ui.label(RichText::new(text)
.size(16.0)
.color(Colors::INACTIVE_TEXT)
+3 -3
View File
@@ -39,14 +39,14 @@ impl NetworkTab for NetworkMetrics {
let server_stats = Node::get_stats();
if server_stats.is_none() || server_stats.as_ref().unwrap().diff_stats.height == 0 {
if !Node::is_running() {
Network::server_off_content(ui);
Network::disabled_server_content(ui);
} else {
View::center_content(ui, [280.0, 160.0], |ui| {
View::center_content(ui, 160.0, |ui| {
Spinner::new().size(104.0).color(Colors::GOLD).ui(ui);
ui.add_space(18.0);
ui.label(RichText::new(t!("network_metrics.loading"))
.size(16.0)
.color(Colors::INACTIVE_TEXT)
.color(Colors::TEXT)
);
});
}
+2 -1
View File
@@ -24,6 +24,7 @@ impl NetworkTab for NetworkMining {
}
fn ui(&mut self, ui: &mut Ui) {
todo!()
}
}
+1 -1
View File
@@ -35,7 +35,7 @@ impl NetworkTab for NetworkNode {
let server_stats = Node::get_stats();
if !server_stats.is_some() {
if !Node::is_running() {
Network::server_off_content(ui);
Network::disabled_server_content(ui);
} else {
ui.centered_and_justified(|ui| {
Spinner::new().size(104.0).color(Colors::GOLD).ui(ui);
+38 -32
View File
@@ -13,7 +13,7 @@
// limitations under the License.
use egui::{Button, PointerState, Response, RichText, Sense, Vec2, Widget};
use egui::epaint::{Color32, FontId, Rounding, Stroke};
use egui::epaint::{Color32, FontId, RectShape, Rounding, Stroke};
use egui::epaint::text::TextWrapping;
use egui::text::{LayoutJob, TextFormat};
use egui_extras::{Size, StripBuilder};
@@ -56,7 +56,7 @@ impl View {
/// Sub-header with uppercase characters and more lighter color.
pub fn sub_header(ui: &mut egui::Ui, text: String) {
ui.label(RichText::new(text.to_uppercase()).size(16.0).color(Colors::SUB_TITLE));
ui.label(RichText::new(text.to_uppercase()).size(16.0).color(Colors::TEXT));
}
/// Temporary button click optimization for touch screens.
@@ -90,7 +90,7 @@ impl View {
pub fn tab_button(ui: &mut egui::Ui, icon: &str, active: bool, action: impl FnOnce()) {
let text_color = match active {
true => { Colors::TITLE }
false => { Colors::SUB_TITLE }
false => { Colors::TEXT }
};
let wt = RichText::new(icon.to_string()).size(24.0).color(text_color);
@@ -128,52 +128,58 @@ impl View {
/// | label |
pub fn rounded_box(ui: &mut egui::Ui, value: String, label: String, r: [bool; 4]) {
let mut rect = ui.available_rect_before_wrap();
rect.set_height(46.0);
// Draw box background
ui.painter().rect(
// Create background shape.
let mut bg_shape = RectShape {
rect,
Rounding {
rounding: Rounding {
nw: if r[0] { 8.0 } else { 0.0 },
ne: if r[1] { 8.0 } else { 0.0 },
sw: if r[2] { 8.0 } else { 0.0 },
se: if r[3] { 8.0 } else { 0.0 },
},
Colors::WHITE,
Stroke { width: 1.0, color: Colors::ITEM_STROKE },
);
fill: Colors::WHITE,
stroke: Stroke { width: 1.0, color: Colors::ITEM_STROKE },
};
let bg_idx = ui.painter().add(bg_shape);
ui.vertical_centered_justified(|ui| {
// Correct vertical spacing between items
ui.style_mut().spacing.item_spacing.y = -4.0;
// Draw box content.
let content_resp = ui.allocate_ui_at_rect(rect, |ui| {
ui.vertical_centered_justified(|ui| {
// Correct vertical spacing between items.
ui.style_mut().spacing.item_spacing.y = -4.0;
// Draw box value
let mut job = LayoutJob::single_section(value, TextFormat {
font_id: FontId::proportional(18.0),
color: Colors::BLACK,
.. Default::default()
// Draw box value.
let mut job = LayoutJob::single_section(value, TextFormat {
font_id: FontId::proportional(18.0),
color: Colors::BLACK,
..Default::default()
});
job.wrap = TextWrapping {
max_rows: 1,
break_anywhere: false,
overflow_character: Option::from('﹍'),
..Default::default()
};
ui.label(job);
// Draw box label.
ui.label(RichText::new(label).color(Colors::GRAY).size(15.0));
});
job.wrap = TextWrapping {
max_rows: 1,
break_anywhere: false,
overflow_character: Option::from('﹍'),
..Default::default()
};
ui.label(job);
}).response;
// Draw box label
ui.label(RichText::new(label).color(Colors::GRAY).size(15.0));
});
// Setup background shape to be painted behind box content.
bg_shape.rect = content_resp.rect;
ui.painter().set(bg_idx, bg_shape);
}
/// Draw content in the center of current layout with specified width and height.
pub fn center_content(ui: &mut egui::Ui, w_h: [f32; 2], content: impl FnOnce(&mut egui::Ui)) {
pub fn center_content(ui: &mut egui::Ui, height: f32, content: impl FnOnce(&mut egui::Ui)) {
ui.vertical_centered(|ui| {
let mut rect = ui.available_rect_before_wrap();
let side_margin = (ui.available_width() - w_h[0]) / 2.0;
rect.min += egui::emath::vec2(side_margin, ui.available_height() / 2.0 - w_h[1] / 2.0);
let side_margin = 24.0;
rect.min += egui::emath::vec2(side_margin, ui.available_height() / 2.0 - height / 2.0);
rect.max -= egui::emath::vec2(side_margin, 0.0);
// rect.set_width(w_h[0]);
ui.allocate_ui_at_rect(rect, |ui| {
(content)(ui);
});