ui: optimize panels width
This commit is contained in:
parent
48630fc6be
commit
f54993483f
6 changed files with 42 additions and 67 deletions
|
@ -93,8 +93,6 @@ impl NetworkContent {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
let content_width = ui.available_width();
|
|
||||||
|
|
||||||
// Show connections content.
|
// Show connections content.
|
||||||
egui::CentralPanel::default()
|
egui::CentralPanel::default()
|
||||||
.frame(egui::Frame {
|
.frame(egui::Frame {
|
||||||
|
@ -130,15 +128,12 @@ impl NetworkContent {
|
||||||
.show(ui, |ui| {
|
.show(ui, |ui| {
|
||||||
ui.add_space(1.0);
|
ui.add_space(1.0);
|
||||||
ui.vertical_centered(|ui| {
|
ui.vertical_centered(|ui| {
|
||||||
// Setup wallet list width.
|
let max_width = if !Root::is_dual_panel_mode(frame) {
|
||||||
let mut rect = ui.available_rect_before_wrap();
|
Root::SIDE_PANEL_WIDTH * 1.3
|
||||||
let mut width = ui.available_width();
|
} else {
|
||||||
if !Root::is_dual_panel_mode(frame) {
|
ui.available_width()
|
||||||
width = f32::min(width, Root::SIDE_PANEL_WIDTH * 1.4)
|
};
|
||||||
}
|
View::max_width_ui(ui, max_width, |ui| {
|
||||||
rect.set_width(width);
|
|
||||||
|
|
||||||
ui.allocate_ui(rect.size(), |ui| {
|
|
||||||
self.connections.ui(ui, frame, cb);
|
self.connections.ui(ui, frame, cb);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -33,6 +33,25 @@ impl View {
|
||||||
/// Stroke for hovered items and buttons.
|
/// Stroke for hovered items and buttons.
|
||||||
pub const HOVER_STROKE: Stroke = Stroke { width: 1.0, color: Colors::ITEM_HOVER };
|
pub const HOVER_STROKE: Stroke = Stroke { width: 1.0, color: Colors::ITEM_HOVER };
|
||||||
|
|
||||||
|
/// Draw content with maximum width value.
|
||||||
|
pub fn max_width_ui(ui: &mut egui::Ui,
|
||||||
|
max_width: f32,
|
||||||
|
add_content: impl FnOnce(&mut egui::Ui)) {
|
||||||
|
// Setup content width.
|
||||||
|
let mut width = ui.available_width();
|
||||||
|
if width == 0.0 {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
let mut rect = ui.available_rect_before_wrap();
|
||||||
|
width = f32::min(width, max_width);
|
||||||
|
rect.set_width(width);
|
||||||
|
|
||||||
|
// Draw content.
|
||||||
|
ui.allocate_ui(rect.size(), |ui| {
|
||||||
|
(add_content)(ui);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
/// Callback on Enter key press event.
|
/// Callback on Enter key press event.
|
||||||
pub fn on_enter_key(ui: &mut egui::Ui, cb: impl FnOnce()) {
|
pub fn on_enter_key(ui: &mut egui::Ui, cb: impl FnOnce()) {
|
||||||
if ui.ctx().input(|i| i.key_pressed(egui::Key::Enter)) {
|
if ui.ctx().input(|i| i.key_pressed(egui::Key::Enter)) {
|
||||||
|
|
|
@ -228,7 +228,7 @@ impl WalletsContent {
|
||||||
|
|
||||||
// Setup title.
|
// Setup title.
|
||||||
let title_content = if self.wallets.is_selected_open() && (!dual_panel
|
let title_content = if self.wallets.is_selected_open() && (!dual_panel
|
||||||
|| (dual_panel && !show_list)) {
|
|| (dual_panel && !show_list)) && !create_wallet {
|
||||||
let title_text = self.wallet_content.current_tab.get_type().name().to_uppercase();
|
let title_text = self.wallet_content.current_tab.get_type().name().to_uppercase();
|
||||||
if self.wallet_content.current_tab.get_type() == WalletTabType::Settings {
|
if self.wallet_content.current_tab.get_type() == WalletTabType::Settings {
|
||||||
TitleType::Single(TitleContentType::Title(title_text))
|
TitleType::Single(TitleContentType::Title(title_text))
|
||||||
|
@ -332,17 +332,12 @@ impl WalletsContent {
|
||||||
.show(ui, |ui| {
|
.show(ui, |ui| {
|
||||||
ui.vertical_centered(|ui| {
|
ui.vertical_centered(|ui| {
|
||||||
// Setup wallet list width.
|
// Setup wallet list width.
|
||||||
let mut rect = ui.available_rect_before_wrap();
|
let max_width = if !dual_panel {
|
||||||
let mut width = ui.available_width();
|
Root::SIDE_PANEL_WIDTH * 1.3
|
||||||
if !dual_panel {
|
} else {
|
||||||
width = f32::min(width, Root::SIDE_PANEL_WIDTH * 1.4)
|
ui.available_width()
|
||||||
}
|
};
|
||||||
if width == 0.0 {
|
View::max_width_ui(ui, max_width, |ui| {
|
||||||
return;
|
|
||||||
}
|
|
||||||
rect.set_width(width);
|
|
||||||
|
|
||||||
ui.allocate_ui(rect.size(), |ui| {
|
|
||||||
let mut list = self.wallets.list().clone();
|
let mut list = self.wallets.list().clone();
|
||||||
// Remove deleted wallet from the list.
|
// Remove deleted wallet from the list.
|
||||||
list.retain(|w| !w.is_deleted());
|
list.retain(|w| !w.is_deleted());
|
||||||
|
|
|
@ -95,17 +95,7 @@ impl WalletCreation {
|
||||||
.show_inside(ui, |ui| {
|
.show_inside(ui, |ui| {
|
||||||
ui.vertical_centered(|ui| {
|
ui.vertical_centered(|ui| {
|
||||||
ui.vertical_centered(|ui| {
|
ui.vertical_centered(|ui| {
|
||||||
// Setup content width.
|
View::max_width_ui(ui, Root::SIDE_PANEL_WIDTH * 2.0, |ui| {
|
||||||
let available_width = ui.available_width();
|
|
||||||
if available_width == 0.0 {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
let mut rect = ui.available_rect_before_wrap();
|
|
||||||
let width = f32::min(available_width, Root::SIDE_PANEL_WIDTH * 2.0);
|
|
||||||
rect.set_width(width);
|
|
||||||
|
|
||||||
// Draw step control content.
|
|
||||||
ui.allocate_ui(rect.size(), |ui| {
|
|
||||||
self.step_control_ui(ui, on_create);
|
self.step_control_ui(ui, on_create);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
@ -137,17 +127,12 @@ impl WalletCreation {
|
||||||
.auto_shrink([false; 2])
|
.auto_shrink([false; 2])
|
||||||
.show(ui, |ui| {
|
.show(ui, |ui| {
|
||||||
ui.vertical_centered(|ui| {
|
ui.vertical_centered(|ui| {
|
||||||
// Setup content width.
|
let max_width = if self.step == Some(Step::SetupConnection) {
|
||||||
let available_width = ui.available_width();
|
Root::SIDE_PANEL_WIDTH * 1.3
|
||||||
if available_width == 0.0 {
|
} else {
|
||||||
return;
|
Root::SIDE_PANEL_WIDTH * 2.0
|
||||||
}
|
};
|
||||||
let mut rect = ui.available_rect_before_wrap();
|
View::max_width_ui(ui, max_width, |ui| {
|
||||||
let width = f32::min(available_width, Root::SIDE_PANEL_WIDTH * 2.0);
|
|
||||||
rect.set_width(width);
|
|
||||||
|
|
||||||
// Draw step content.
|
|
||||||
ui.allocate_ui(rect.size(), |ui| {
|
|
||||||
self.step_content_ui(ui, frame, cb);
|
self.step_content_ui(ui, frame, cb);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -59,17 +59,8 @@ impl WalletContent {
|
||||||
})
|
})
|
||||||
.show_animated_inside(ui, !Self::block_navigation_on_sync(wallet), |ui| {
|
.show_animated_inside(ui, !Self::block_navigation_on_sync(wallet), |ui| {
|
||||||
ui.vertical_centered(|ui| {
|
ui.vertical_centered(|ui| {
|
||||||
// Setup tabs width.
|
|
||||||
let available_width = ui.available_width();
|
|
||||||
if available_width == 0.0 {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
let mut rect = ui.available_rect_before_wrap();
|
|
||||||
let width = f32::min(available_width, Root::SIDE_PANEL_WIDTH * 1.3);
|
|
||||||
rect.set_width(width);
|
|
||||||
|
|
||||||
// Draw wallet tabs.
|
// Draw wallet tabs.
|
||||||
ui.allocate_ui(rect.size(), |ui| {
|
View::max_width_ui(ui, Root::SIDE_PANEL_WIDTH * 1.3, |ui| {
|
||||||
self.tabs_ui(ui);
|
self.tabs_ui(ui);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -15,7 +15,7 @@
|
||||||
use egui::{Id, ScrollArea};
|
use egui::{Id, ScrollArea};
|
||||||
|
|
||||||
use crate::gui::platform::PlatformCallbacks;
|
use crate::gui::platform::PlatformCallbacks;
|
||||||
use crate::gui::views::Root;
|
use crate::gui::views::{Root, View};
|
||||||
use crate::gui::views::wallets::setup::{CommonSetup, ConnectionSetup, RecoverySetup};
|
use crate::gui::views::wallets::setup::{CommonSetup, ConnectionSetup, RecoverySetup};
|
||||||
use crate::gui::views::wallets::wallet::types::{WalletTab, WalletTabType};
|
use crate::gui::views::wallets::wallet::types::{WalletTab, WalletTabType};
|
||||||
use crate::gui::views::wallets::wallet::WalletContent;
|
use crate::gui::views::wallets::wallet::WalletContent;
|
||||||
|
@ -64,17 +64,7 @@ impl WalletTab for WalletSettings {
|
||||||
.auto_shrink([false; 2])
|
.auto_shrink([false; 2])
|
||||||
.show(ui, |ui| {
|
.show(ui, |ui| {
|
||||||
ui.vertical_centered(|ui| {
|
ui.vertical_centered(|ui| {
|
||||||
// Setup tab content width.
|
View::max_width_ui(ui, Root::SIDE_PANEL_WIDTH * 1.3, |ui| {
|
||||||
let available_width = ui.available_width();
|
|
||||||
if available_width == 0.0 {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
let mut rect = ui.available_rect_before_wrap();
|
|
||||||
let width = f32::min(available_width, Root::SIDE_PANEL_WIDTH * 1.3);
|
|
||||||
rect.set_width(width);
|
|
||||||
|
|
||||||
// Draw current tab content.
|
|
||||||
ui.allocate_ui(rect.size(), |ui| {
|
|
||||||
// Show common wallet setup.
|
// Show common wallet setup.
|
||||||
self.common_setup.ui(ui, frame, wallet, cb);
|
self.common_setup.ui(ui, frame, wallet, cb);
|
||||||
// Show wallet connections setup.
|
// Show wallet connections setup.
|
||||||
|
|
Loading…
Reference in a new issue