mirror of
https://github.com/jwinterm/grim.git
synced 2026-10-23 16:28:31 +02:00
ui: window resize, tabs and creation navigation paddings, title panel hiding
This commit is contained in:
@@ -12,7 +12,7 @@
|
||||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
|
||||
use egui::{Margin, RichText, ScrollArea, Stroke};
|
||||
use egui::{Margin, RichText, ScrollArea};
|
||||
use egui::scroll_area::ScrollBarVisibility;
|
||||
|
||||
use crate::AppConfig;
|
||||
@@ -48,7 +48,7 @@ impl NetworkContent {
|
||||
let dual_panel = Root::is_dual_panel_mode(ui);
|
||||
|
||||
// Show title panel.
|
||||
self.title_ui(ui, show_connections);
|
||||
self.title_ui(ui, dual_panel || Root::is_network_panel_open(), show_connections);
|
||||
|
||||
// Show integrated node tabs content.
|
||||
if !show_connections {
|
||||
@@ -57,10 +57,10 @@ impl NetworkContent {
|
||||
.frame(egui::Frame {
|
||||
fill: Colors::fill(),
|
||||
inner_margin: Margin {
|
||||
left: View::get_left_inset() + 4.0,
|
||||
right: View::far_right_inset_margin(ui) + 4.0,
|
||||
top: 6.0,
|
||||
bottom: View::get_bottom_inset() + 5.0,
|
||||
left: View::get_left_inset() + View::TAB_ITEMS_PADDING,
|
||||
right: View::far_right_inset_margin(ui) + View::TAB_ITEMS_PADDING,
|
||||
top: View::TAB_ITEMS_PADDING,
|
||||
bottom: View::get_bottom_inset() + View::TAB_ITEMS_PADDING,
|
||||
},
|
||||
outer_margin: if View::is_desktop() {
|
||||
Margin {
|
||||
@@ -115,11 +115,7 @@ impl NetworkContent {
|
||||
// Show connections content.
|
||||
egui::CentralPanel::default()
|
||||
.frame(egui::Frame {
|
||||
stroke: if show_connections {
|
||||
View::item_stroke()
|
||||
} else {
|
||||
Stroke::NONE
|
||||
},
|
||||
stroke: View::item_stroke(),
|
||||
inner_margin: Margin {
|
||||
left: if show_connections {
|
||||
View::get_left_inset() + 4.0
|
||||
@@ -171,7 +167,7 @@ impl NetworkContent {
|
||||
fn tabs_ui(&mut self, ui: &mut egui::Ui) {
|
||||
ui.vertical_centered(|ui| {
|
||||
// Setup spacing between tabs.
|
||||
ui.style_mut().spacing.item_spacing = egui::vec2(6.0, 0.0);
|
||||
ui.style_mut().spacing.item_spacing = egui::vec2(View::TAB_ITEMS_PADDING, 0.0);
|
||||
// Setup vertical padding inside tab button.
|
||||
ui.style_mut().spacing.button_padding = egui::vec2(0.0, 4.0);
|
||||
|
||||
@@ -203,7 +199,7 @@ impl NetworkContent {
|
||||
}
|
||||
|
||||
/// Draw title content.
|
||||
fn title_ui(&mut self, ui: &mut egui::Ui, show_connections: bool) {
|
||||
fn title_ui(&mut self, ui: &mut egui::Ui, show_panel: bool, show_connections: bool) {
|
||||
// Setup values for title panel.
|
||||
let title_text = self.node_tab_content.get_type().title().to_uppercase();
|
||||
let subtitle_text = Node::get_sync_status_text();
|
||||
@@ -215,7 +211,7 @@ impl NetworkContent {
|
||||
};
|
||||
|
||||
// Draw title panel.
|
||||
TitlePanel::ui(TitleType::Single(title_content), |ui| {
|
||||
TitlePanel::ui(TitleType::Single(title_content), show_panel, |ui| {
|
||||
if !show_connections {
|
||||
View::title_button_big(ui, DOTS_THREE_OUTLINE_VERTICAL, |_| {
|
||||
AppConfig::toggle_show_connections_network_panel();
|
||||
|
||||
@@ -27,6 +27,7 @@ impl TitlePanel {
|
||||
pub const DEFAULT_HEIGHT: f32 = 54.0;
|
||||
|
||||
pub fn ui(title: TitleType,
|
||||
show: bool,
|
||||
mut left_content: impl FnMut(&mut egui::Ui),
|
||||
mut right_content: impl FnMut(&mut egui::Ui),
|
||||
ui: &mut egui::Ui) {
|
||||
@@ -57,7 +58,7 @@ impl TitlePanel {
|
||||
fill: Colors::yellow(),
|
||||
..Default::default()
|
||||
})
|
||||
.show_inside(ui, |ui| {
|
||||
.show_animated_inside(ui, show, |ui| {
|
||||
StripBuilder::new(ui)
|
||||
.size(Size::exact(Self::DEFAULT_HEIGHT))
|
||||
.size(if dual_title {
|
||||
|
||||
@@ -218,6 +218,9 @@ impl View {
|
||||
});
|
||||
}
|
||||
|
||||
/// Padding for tab items.
|
||||
pub const TAB_ITEMS_PADDING: f32 = 5.0;
|
||||
|
||||
/// Tab button with white background fill color, contains only icon.
|
||||
pub fn tab_button(ui: &mut egui::Ui, icon: &str, active: bool, action: impl FnOnce()) {
|
||||
ui.scope(|ui| {
|
||||
|
||||
@@ -103,10 +103,13 @@ impl WalletsContent {
|
||||
let wallet_panel_width = self.wallet_panel_width(ui, empty_list, dual_panel, show_wallet);
|
||||
let content_width = ui.available_width();
|
||||
|
||||
// Flag to check if wallet list is hidden on the screen.
|
||||
let list_hidden = content_width == 0.0 || empty_list || create_wallet
|
||||
|| (dual_panel && show_wallet && !self.show_wallets_at_dual_panel)
|
||||
|| (!dual_panel && show_wallet) || (!dual_panel && Root::is_network_panel_open());
|
||||
|
||||
// Show title panel.
|
||||
View::max_width_ui(ui, ui.available_width(), |ui| {
|
||||
self.title_ui(ui, dual_panel, create_wallet, show_wallet);
|
||||
});
|
||||
self.title_ui(ui, dual_panel, create_wallet, show_wallet);
|
||||
|
||||
// Show wallet panel content.
|
||||
egui::SidePanel::right("wallet_panel")
|
||||
@@ -161,15 +164,9 @@ impl WalletsContent {
|
||||
}
|
||||
});
|
||||
|
||||
// Flag to check if wallet list is hidden on the screen.
|
||||
let list_hidden = content_width == 0.0 || empty_list || create_wallet
|
||||
|| (dual_panel && show_wallet && !self.show_wallets_at_dual_panel)
|
||||
|| (!dual_panel && show_wallet);
|
||||
|
||||
// Setup flag to show wallets bottom panel if wallet is not showing
|
||||
// at non-dual panel mode and network is no open or showing at dual panel mode.
|
||||
let show_bottom_panel = !list_hidden &&
|
||||
((!show_wallet && !dual_panel && !Root::is_network_panel_open()) || dual_panel);
|
||||
let show_bottom_panel = !list_hidden || dual_panel;
|
||||
|
||||
// Show wallets bottom panel.
|
||||
if show_bottom_panel {
|
||||
@@ -177,10 +174,10 @@ impl WalletsContent {
|
||||
.frame(egui::Frame {
|
||||
fill: Colors::fill(),
|
||||
inner_margin: Margin {
|
||||
left: View::get_left_inset() + 4.0,
|
||||
right: View::far_right_inset_margin(ui) + 4.0,
|
||||
top: 6.0,
|
||||
bottom: View::get_bottom_inset() + 5.0,
|
||||
left: View::get_left_inset() + View::TAB_ITEMS_PADDING,
|
||||
right: View::far_right_inset_margin(ui) + View::TAB_ITEMS_PADDING,
|
||||
top: View::TAB_ITEMS_PADDING,
|
||||
bottom: View::get_bottom_inset() + View::TAB_ITEMS_PADDING,
|
||||
},
|
||||
outer_margin: if View::is_desktop() {
|
||||
Margin {
|
||||
@@ -204,7 +201,7 @@ impl WalletsContent {
|
||||
})
|
||||
.show_inside(ui, |ui| {
|
||||
// Setup spacing between tabs.
|
||||
ui.style_mut().spacing.item_spacing = egui::vec2(6.0, 0.0);
|
||||
ui.style_mut().spacing.item_spacing = egui::vec2(View::TAB_ITEMS_PADDING, 0.0);
|
||||
// Setup vertical padding inside buttons.
|
||||
ui.style_mut().spacing.button_padding = egui::vec2(10.0, 4.0);
|
||||
|
||||
@@ -235,6 +232,9 @@ impl WalletsContent {
|
||||
}
|
||||
})
|
||||
.show_inside(ui, |ui| {
|
||||
if list_hidden {
|
||||
return;
|
||||
}
|
||||
// Update ui after 1 sec at single panel mode.
|
||||
if !dual_panel {
|
||||
ui.ctx().request_repaint_after(Duration::from_millis(1000));
|
||||
@@ -300,7 +300,7 @@ impl WalletsContent {
|
||||
};
|
||||
|
||||
// Draw title panel.
|
||||
TitlePanel::ui(title_content, |ui| {
|
||||
TitlePanel::ui(title_content, dual_panel || !Root::is_network_panel_open(), |ui| {
|
||||
if show_wallet && !dual_panel {
|
||||
View::title_button_big(ui, ARROW_LEFT, |_| {
|
||||
self.wallets.select(None);
|
||||
|
||||
@@ -73,13 +73,26 @@ impl WalletCreation {
|
||||
egui::TopBottomPanel::bottom("wallet_creation_step_panel")
|
||||
.frame(egui::Frame {
|
||||
fill: Colors::fill(),
|
||||
stroke: View::default_stroke(),
|
||||
inner_margin: Margin {
|
||||
left: View::far_left_inset_margin(ui) + 8.0,
|
||||
right: View::get_right_inset() + 8.0,
|
||||
top: 4.0,
|
||||
bottom: View::get_bottom_inset(),
|
||||
},
|
||||
outer_margin: if View::is_desktop() {
|
||||
Margin {
|
||||
left: if !Root::is_dual_panel_mode(ui) {
|
||||
-0.5
|
||||
} else {
|
||||
0.0
|
||||
},
|
||||
right: -0.5,
|
||||
top: 0.0,
|
||||
bottom: -0.5,
|
||||
}
|
||||
} else {
|
||||
Margin::ZERO
|
||||
},
|
||||
..Default::default()
|
||||
})
|
||||
.show_inside(ui, |ui| {
|
||||
|
||||
@@ -128,10 +128,10 @@ impl WalletContent {
|
||||
.frame(egui::Frame {
|
||||
fill: Colors::fill(),
|
||||
inner_margin: Margin {
|
||||
left: View::far_left_inset_margin(ui) + 4.0,
|
||||
right: View::get_right_inset() + 4.0,
|
||||
top: 6.0,
|
||||
bottom: View::get_bottom_inset() + 5.0,
|
||||
left: View::far_left_inset_margin(ui) + View::TAB_ITEMS_PADDING,
|
||||
right: View::get_right_inset() + View::TAB_ITEMS_PADDING,
|
||||
top: View::TAB_ITEMS_PADDING,
|
||||
bottom: View::get_bottom_inset() + View::TAB_ITEMS_PADDING,
|
||||
},
|
||||
outer_margin: if View::is_desktop() {
|
||||
Margin {
|
||||
@@ -526,7 +526,7 @@ impl WalletContent {
|
||||
fn tabs_ui(&mut self, ui: &mut egui::Ui, wallet: &Wallet) {
|
||||
ui.scope(|ui| {
|
||||
// Setup spacing between tabs.
|
||||
ui.style_mut().spacing.item_spacing = egui::vec2(6.0, 0.0);
|
||||
ui.style_mut().spacing.item_spacing = egui::vec2(View::TAB_ITEMS_PADDING, 0.0);
|
||||
// Setup vertical padding inside tab button.
|
||||
ui.style_mut().spacing.button_padding = egui::vec2(0.0, 4.0);
|
||||
|
||||
|
||||
Reference in New Issue
Block a user