From c91ed8db0d83397623c1239adbc4cd8dbb72f64c Mon Sep 17 00:00:00 2001 From: ardocrat Date: Tue, 4 Jun 2024 14:05:45 +0300 Subject: [PATCH] ui: fix buttons padding, qr light background --- src/gui/views/network/setup/node.rs | 4 +- src/gui/views/qr.rs | 68 ++++++++++++---------- src/gui/views/root.rs | 2 +- src/gui/views/wallets/creation/mnemonic.rs | 2 +- src/gui/views/wallets/setup/recovery.rs | 4 +- src/gui/views/wallets/wallet/content.rs | 6 +- src/gui/views/wallets/wallet/messages.rs | 12 ++-- src/gui/views/wallets/wallet/transport.rs | 12 ++-- src/gui/views/wallets/wallet/txs.rs | 6 +- 9 files changed, 60 insertions(+), 56 deletions(-) diff --git a/src/gui/views/network/setup/node.rs b/src/gui/views/network/setup/node.rs index 61c5342..45705e1 100644 --- a/src/gui/views/network/setup/node.rs +++ b/src/gui/views/network/setup/node.rs @@ -305,7 +305,7 @@ impl NodeSetup { // Show modal buttons. ui.scope(|ui| { // Setup spacing between buttons. - ui.spacing_mut().item_spacing = egui::Vec2::new(6.0, 0.0); + ui.spacing_mut().item_spacing = egui::Vec2::new(8.0, 0.0); // Save button callback. let on_save = || { @@ -408,7 +408,7 @@ impl NodeSetup { // Show modal buttons. ui.scope(|ui| { // Setup spacing between buttons. - ui.spacing_mut().item_spacing = egui::Vec2::new(6.0, 0.0); + ui.spacing_mut().item_spacing = egui::Vec2::new(8.0, 0.0); // Save button callback. let on_save = || { diff --git a/src/gui/views/qr.rs b/src/gui/views/qr.rs index 3d5a4f0..56a0be1 100644 --- a/src/gui/views/qr.rs +++ b/src/gui/views/qr.rs @@ -64,17 +64,6 @@ impl QrCodeContent { /// Draw QR code. pub fn ui(&mut self, ui: &mut egui::Ui, text: String, cb: &dyn PlatformCallbacks) { - if self.animated { - // Show animated QR code. - self.animated_ui(ui, text, cb); - } else { - // Show static QR code. - self.static_ui(ui, text, cb); - } - } - - /// Draw QR code image content. - fn qr_image_ui(&mut self, svg: Vec, ui: &mut egui::Ui) { let mut rect = ui.available_rect_before_wrap(); rect.min += egui::emath::vec2(8.0, 0.0); rect.max -= egui::emath::vec2(8.0, 0.0); @@ -82,8 +71,8 @@ impl QrCodeContent { // Create background shape. let mut bg_shape = egui::epaint::RectShape { rect, - rounding: egui::Rounding::same(3.0), - fill: egui::Color32::WHITE, + rounding: egui::Rounding::default(), + fill: egui::Color32::WHITE.linear_multiply(0.9), stroke: egui::Stroke::NONE, fill_texture_id: Default::default(), uv: egui::Rect::ZERO @@ -92,31 +81,40 @@ impl QrCodeContent { // Draw QR code image content. let mut content_rect = ui.allocate_ui_at_rect(rect, |ui| { - let size = SizeHint::Size(ui.available_width() as u32, ui.available_width() as u32); - let color_img = load_svg_bytes_with_size(svg.as_slice(), Some(size)).unwrap(); - // Create image texture. - let texture_handle = ui.ctx().load_texture("qr_code", - color_img.clone(), - TextureOptions::default()); - self.texture_handle = Some(texture_handle.clone()); - let img_size = egui::emath::vec2(color_img.width() as f32, - color_img.height() as f32); - let sized_img = SizedTexture::new(texture_handle.id(), img_size); - // Add image to content. - ui.add_space(8.0); - ui.add(egui::Image::from_texture(sized_img) - .max_height(ui.available_width()) - .fit_to_original_size(1.0)); ui.add_space(8.0); + if self.animated { + // Show animated QR code. + self.animated_ui(ui, text, cb); + } else { + // Show static QR code. + self.static_ui(ui, text, cb); + } + ui.add_space(6.0); }).response.rect; - // Setup background shape to be painted behind main content. + // Setup background shape to be painted behind content. content_rect.min -= egui::emath::vec2(8.0, 0.0); content_rect.max += egui::emath::vec2(8.0, 0.0); bg_shape.rect = content_rect; ui.painter().set(bg_idx, bg_shape); + } - ui.add_space(6.0); + /// Draw QR code image content. + fn qr_image_ui(&mut self, svg: Vec, ui: &mut egui::Ui) { + let size = SizeHint::Size(ui.available_width() as u32, ui.available_width() as u32); + let color_img = load_svg_bytes_with_size(svg.as_slice(), Some(size)).unwrap(); + // Create image texture. + let texture_handle = ui.ctx().load_texture("qr_code", + color_img.clone(), + TextureOptions::default()); + self.texture_handle = Some(texture_handle.clone()); + let img_size = egui::emath::vec2(color_img.width() as f32, + color_img.height() as f32); + let sized_img = SizedTexture::new(texture_handle.id(), img_size); + // Add image to content. + ui.add(egui::Image::from_texture(sized_img) + .max_height(ui.available_width()) + .fit_to_original_size(1.0)); } /// Draw animated QR code content. @@ -156,6 +154,11 @@ impl QrCodeContent { // Create images from SVG data. self.qr_image_ui(svg, ui); + // Show QR code text. + ui.add_space(6.0); + View::ellipsize_text(ui, text.clone(), 16.0, Colors::inactive_text()); + ui.add_space(6.0); + ui.vertical_centered(|ui| { let sharing = { let r_state = self.qr_image_state.read(); @@ -164,7 +167,6 @@ impl QrCodeContent { if !sharing { // Show button to share QR. let share_txt = format!("{} {}", IMAGES_SQUARE, t!("share")); - ui.add_space(4.0); View::action_button(ui, share_txt, || { { let mut w_state = self.qr_image_state.write(); @@ -178,7 +180,7 @@ impl QrCodeContent { ui.vertical_centered(|ui| { ui.add_space(6.0); View::small_loading_spinner(ui); - ui.add_space(10.0); + ui.add_space(6.0); }); } @@ -230,6 +232,7 @@ impl QrCodeContent { self.qr_image_ui(svg, ui); // Show QR code text. + ui.add_space(6.0); View::ellipsize_text(ui, text.clone(), 16.0, Colors::inactive_text()); ui.add_space(6.0); @@ -254,6 +257,7 @@ impl QrCodeContent { } }); }); + ui.add_space(2.0); } } diff --git a/src/gui/views/root.rs b/src/gui/views/root.rs index 7dea4bc..c6e18b0 100644 --- a/src/gui/views/root.rs +++ b/src/gui/views/root.rs @@ -221,7 +221,7 @@ impl Root { ui.add_space(10.0); // Setup spacing between buttons. - ui.spacing_mut().item_spacing = egui::Vec2::new(6.0, 0.0); + ui.spacing_mut().item_spacing = egui::Vec2::new(8.0, 0.0); ui.columns(2, |columns| { columns[0].vertical_centered_justified(|ui| { diff --git a/src/gui/views/wallets/creation/mnemonic.rs b/src/gui/views/wallets/creation/mnemonic.rs index 1604776..91a1725 100644 --- a/src/gui/views/wallets/creation/mnemonic.rs +++ b/src/gui/views/wallets/creation/mnemonic.rs @@ -404,7 +404,7 @@ impl MnemonicSetup { if self.scan_phrase_not_found.is_some() { // Setup spacing between buttons. - ui.spacing_mut().item_spacing = egui::Vec2::new(6.0, 0.0); + ui.spacing_mut().item_spacing = egui::Vec2::new(8.0, 0.0); ui.columns(2, |columns| { columns[0].vertical_centered_justified(|ui| { diff --git a/src/gui/views/wallets/setup/recovery.rs b/src/gui/views/wallets/setup/recovery.rs index 31fb0fa..231e600 100644 --- a/src/gui/views/wallets/setup/recovery.rs +++ b/src/gui/views/wallets/setup/recovery.rs @@ -226,7 +226,7 @@ impl RecoverySetup { // Show modal buttons. ui.scope(|ui| { // Setup spacing between buttons. - ui.spacing_mut().item_spacing = egui::Vec2::new(6.0, 0.0); + ui.spacing_mut().item_spacing = egui::Vec2::new(8.0, 0.0); ui.columns(2, |columns| { columns[0].vertical_centered_justified(|ui| { @@ -271,7 +271,7 @@ impl RecoverySetup { // Show modal buttons. ui.scope(|ui| { // Setup spacing between buttons. - ui.spacing_mut().item_spacing = egui::Vec2::new(6.0, 0.0); + ui.spacing_mut().item_spacing = egui::Vec2::new(8.0, 0.0); ui.columns(2, |columns| { columns[0].vertical_centered_justified(|ui| { diff --git a/src/gui/views/wallets/wallet/content.rs b/src/gui/views/wallets/wallet/content.rs index fcef2fb..b73c530 100644 --- a/src/gui/views/wallets/wallet/content.rs +++ b/src/gui/views/wallets/wallet/content.rs @@ -314,7 +314,7 @@ impl WalletContent { }); // Setup spacing between buttons. - ui.spacing_mut().item_spacing = egui::Vec2::new(6.0, 0.0); + ui.spacing_mut().item_spacing = egui::Vec2::new(8.0, 0.0); // Show modal buttons. ui.columns(2, |columns| { @@ -378,7 +378,7 @@ impl WalletContent { ui.add_space(6.0); // Setup spacing between buttons. - ui.spacing_mut().item_spacing = egui::Vec2::new(6.0, 0.0); + ui.spacing_mut().item_spacing = egui::Vec2::new(8.0, 0.0); // Show modal buttons. ui.columns(2, |columns| { @@ -478,7 +478,7 @@ impl WalletContent { if self.qr_scan_result.is_some() { // Setup spacing between buttons. - ui.spacing_mut().item_spacing = egui::Vec2::new(6.0, 0.0); + ui.spacing_mut().item_spacing = egui::Vec2::new(8.0, 0.0); ui.columns(2, |columns| { columns[0].vertical_centered_justified(|ui| { diff --git a/src/gui/views/wallets/wallet/messages.rs b/src/gui/views/wallets/wallet/messages.rs index 449d1fc..380df97 100644 --- a/src/gui/views/wallets/wallet/messages.rs +++ b/src/gui/views/wallets/wallet/messages.rs @@ -246,7 +246,7 @@ impl WalletMessages { let data = wallet.get_data().unwrap(); if data.info.amount_currently_spendable > 0 { // Setup spacing between buttons. - ui.spacing_mut().item_spacing = egui::Vec2::new(6.0, 0.0); + ui.spacing_mut().item_spacing = egui::Vec2::new(8.0, 0.0); ui.columns(2, |columns| { columns[0].vertical_centered_justified(|ui| { @@ -419,7 +419,7 @@ impl WalletMessages { ui.add_space(12.0); // Setup spacing between buttons. - ui.spacing_mut().item_spacing = egui::Vec2::new(6.0, 0.0); + ui.spacing_mut().item_spacing = egui::Vec2::new(8.0, 0.0); ui.columns(2, |columns| { columns[0].vertical_centered_justified(|ui| { @@ -532,7 +532,7 @@ impl WalletMessages { ui.scope(|ui| { // Setup spacing between buttons. - ui.spacing_mut().item_spacing = egui::Vec2::new(6.0, 0.0); + ui.spacing_mut().item_spacing = egui::Vec2::new(8.0, 0.0); ui.columns(2, |columns| { columns[0].vertical_centered_justified(|ui| { @@ -689,7 +689,7 @@ impl WalletMessages { let mut show_dandelion = false; ui.scope(|ui| { // Setup spacing between buttons. - ui.spacing_mut().item_spacing = egui::Vec2::new(6.0, 0.0); + ui.spacing_mut().item_spacing = egui::Vec2::new(8.0, 0.0); ui.columns(columns_num, |columns| { let first_column_content = |ui: &mut egui::Ui| { @@ -868,7 +868,7 @@ impl WalletMessages { // Draw QR code content. let text = self.qr_message_text.clone().unwrap(); self.qr_message_content.ui(ui, text.clone(), cb); - ui.add_space(6.0); + ui.add_space(8.0); ui.vertical_centered_justified(|ui| { View::button(ui, t!("close"), Colors::white_or_black(false), || { @@ -911,7 +911,7 @@ impl WalletMessages { ui.add_space(12.0); // Setup spacing between buttons. - ui.spacing_mut().item_spacing = egui::Vec2::new(6.0, 0.0); + ui.spacing_mut().item_spacing = egui::Vec2::new(8.0, 0.0); ui.columns(2, |columns| { columns[0].vertical_centered_justified(|ui| { diff --git a/src/gui/views/wallets/wallet/transport.rs b/src/gui/views/wallets/wallet/transport.rs index c205df5..51d996b 100644 --- a/src/gui/views/wallets/wallet/transport.rs +++ b/src/gui/views/wallets/wallet/transport.rs @@ -335,7 +335,7 @@ impl WalletTransport { ui.add_space(12.0); // Setup spacing between buttons. - ui.spacing_mut().item_spacing = egui::Vec2::new(6.0, 0.0); + ui.spacing_mut().item_spacing = egui::Vec2::new(8.0, 0.0); // Show buttons to close modal or come back to sending input. ui.columns(2, |cols| { @@ -590,15 +590,15 @@ impl WalletTransport { // Draw QR code content. let text = self.qr_address_content.text.clone(); self.qr_address_content.ui(ui, text.clone(), cb); - ui.add_space(10.0); + ui.add_space(6.0); ui.vertical_centered_justified(|ui| { View::button(ui, t!("close"), Colors::white_or_black(false), || { self.qr_address_content.clear_state(); m.close(); }); - ui.add_space(6.0); }); + ui.add_space(6.0); } /// Draw Tor send content. @@ -694,7 +694,7 @@ impl WalletTransport { ui.add_space(6.0); // Setup spacing between buttons. - ui.spacing_mut().item_spacing = egui::Vec2::new(6.0, 0.0); + ui.spacing_mut().item_spacing = egui::Vec2::new(8.0, 0.0); // Show buttons to close modal or come back to sending input. ui.columns(2, |cols| { @@ -810,7 +810,7 @@ impl WalletTransport { } // Setup spacing between buttons. - ui.spacing_mut().item_spacing = egui::Vec2::new(6.0, 0.0); + ui.spacing_mut().item_spacing = egui::Vec2::new(8.0, 0.0); ui.columns(2, |columns| { columns[0].vertical_centered_justified(|ui| { @@ -874,7 +874,7 @@ impl WalletTransport { ui.add_space(12.0); // Setup spacing between buttons. - ui.spacing_mut().item_spacing = egui::Vec2::new(6.0, 0.0); + ui.spacing_mut().item_spacing = egui::Vec2::new(8.0, 0.0); ui.columns(2, |columns| { columns[0].vertical_centered_justified(|ui| { diff --git a/src/gui/views/wallets/wallet/txs.rs b/src/gui/views/wallets/wallet/txs.rs index 1382004..f6f31d5 100644 --- a/src/gui/views/wallets/wallet/txs.rs +++ b/src/gui/views/wallets/wallet/txs.rs @@ -578,7 +578,7 @@ impl WalletTransactions { if !self.tx_info_finalizing { // Setup spacing between buttons. - ui.spacing_mut().item_spacing = egui::Vec2::new(6.0, 0.0); + ui.spacing_mut().item_spacing = egui::Vec2::new(8.0, 0.0); if self.tx_info_show_qr { // Show buttons to close modal or come back to text request content. @@ -833,7 +833,7 @@ impl WalletTransactions { } // Setup spacing between buttons. - ui.spacing_mut().item_spacing = egui::Vec2::new(6.0, 0.0); + ui.spacing_mut().item_spacing = egui::Vec2::new(8.0, 0.0); if self.tx_info_finalize { ui.columns(2, |columns| { @@ -958,7 +958,7 @@ impl WalletTransactions { // Show modal buttons. ui.scope(|ui| { // Setup spacing between buttons. - ui.spacing_mut().item_spacing = egui::Vec2::new(6.0, 0.0); + ui.spacing_mut().item_spacing = egui::Vec2::new(8.0, 0.0); ui.columns(2, |columns| { columns[0].vertical_centered_justified(|ui| {