ui: update egui, optimize title panel

This commit is contained in:
ardocrat 2024-07-07 19:21:57 +03:00
parent eaf462a1b2
commit 891ab0a9c4
5 changed files with 134 additions and 137 deletions

70
Cargo.lock generated
View file

@ -23,6 +23,10 @@ name = "accesskit"
version = "0.12.3"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "74a4b14f3d99c1255dcba8f45621ab1a2e7540a0009652d33989005a4d0bfc6b"
dependencies = [
"enumn",
"serde",
]
[[package]]
name = "accesskit_consumer"
@ -195,6 +199,7 @@ dependencies = [
"cfg-if 1.0.0",
"getrandom 0.2.15",
"once_cell",
"serde",
"version_check",
"zerocopy",
]
@ -2077,7 +2082,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "b28bfe653d79bd16c77f659305b195b82bb5ce0c0eb2a4846b82ddbd77586813"
dependencies = [
"bitflags 2.5.0",
"libloading 0.7.4",
"libloading 0.8.3",
"winapi 0.3.9",
]
@ -2546,11 +2551,13 @@ dependencies = [
[[package]]
name = "ecolor"
version = "0.27.2"
source = "git+https://github.com/emilk/egui/?rev=10571e9da5b3658964adc8b85c7e3f8c1353e0db#10571e9da5b3658964adc8b85c7e3f8c1353e0db"
version = "0.28.1"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "2e6b451ff1143f6de0f33fc7f1b68fecfd2c7de06e104de96c4514de3f5396f8"
dependencies = [
"bytemuck",
"emath",
"serde",
]
[[package]]
@ -2616,8 +2623,9 @@ dependencies = [
[[package]]
name = "eframe"
version = "0.27.2"
source = "git+https://github.com/emilk/egui/?rev=10571e9da5b3658964adc8b85c7e3f8c1353e0db#10571e9da5b3658964adc8b85c7e3f8c1353e0db"
version = "0.28.1"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "6490ef800b2e41ee129b1f32f9ac15f713233fe3bc18e241a1afe1e4fb6811e0"
dependencies = [
"ahash 0.8.11",
"bytemuck",
@ -2652,8 +2660,9 @@ dependencies = [
[[package]]
name = "egui"
version = "0.27.2"
source = "git+https://github.com/emilk/egui/?rev=10571e9da5b3658964adc8b85c7e3f8c1353e0db#10571e9da5b3658964adc8b85c7e3f8c1353e0db"
version = "0.28.1"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "20c97e70a2768de630f161bb5392cbd3874fcf72868f14df0e002e82e06cb798"
dependencies = [
"accesskit",
"ahash 0.8.11",
@ -2661,12 +2670,14 @@ dependencies = [
"epaint",
"log",
"nohash-hasher",
"serde",
]
[[package]]
name = "egui-wgpu"
version = "0.27.2"
source = "git+https://github.com/emilk/egui/?rev=10571e9da5b3658964adc8b85c7e3f8c1353e0db#10571e9da5b3658964adc8b85c7e3f8c1353e0db"
version = "0.28.1"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "47c7a7c707877c3362a321ebb4f32be811c0b91f7aebf345fb162405c0218b4c"
dependencies = [
"ahash 0.8.11",
"bytemuck",
@ -2683,8 +2694,9 @@ dependencies = [
[[package]]
name = "egui-winit"
version = "0.27.2"
source = "git+https://github.com/emilk/egui/?rev=10571e9da5b3658964adc8b85c7e3f8c1353e0db#10571e9da5b3658964adc8b85c7e3f8c1353e0db"
version = "0.28.1"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "fac4e066af341bf92559f60dbdf2020b2a03c963415349af5f3f8d79ff7a4926"
dependencies = [
"accesskit_winit",
"ahash 0.8.11",
@ -2700,8 +2712,9 @@ dependencies = [
[[package]]
name = "egui_extras"
version = "0.27.2"
source = "git+https://github.com/emilk/egui/?rev=10571e9da5b3658964adc8b85c7e3f8c1353e0db#10571e9da5b3658964adc8b85c7e3f8c1353e0db"
version = "0.28.1"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "5bb783d9fa348f69ed5c340aa25af78b5472043090e8b809040e30960cc2a746"
dependencies = [
"ahash 0.8.11",
"egui",
@ -2710,12 +2723,14 @@ dependencies = [
"log",
"mime_guess2",
"resvg",
"serde",
]
[[package]]
name = "egui_glow"
version = "0.27.2"
source = "git+https://github.com/emilk/egui/?rev=10571e9da5b3658964adc8b85c7e3f8c1353e0db#10571e9da5b3658964adc8b85c7e3f8c1353e0db"
version = "0.28.1"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "4e2bdc8b38cfa17cc712c4ae079e30c71c00cd4c2763c9e16dc7860a02769103"
dependencies = [
"ahash 0.8.11",
"bytemuck",
@ -2755,10 +2770,12 @@ dependencies = [
[[package]]
name = "emath"
version = "0.27.2"
source = "git+https://github.com/emilk/egui/?rev=10571e9da5b3658964adc8b85c7e3f8c1353e0db#10571e9da5b3658964adc8b85c7e3f8c1353e0db"
version = "0.28.1"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "0a6a21708405ea88f63d8309650b4d77431f4bc28fb9d8e6f77d3963b51249e6"
dependencies = [
"bytemuck",
"serde",
]
[[package]]
@ -2846,6 +2863,17 @@ dependencies = [
"syn 2.0.66",
]
[[package]]
name = "enumn"
version = "0.1.13"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "6fd000fd6988e73bbe993ea3db9b1aa64906ab88766d654973924340c8cddb42"
dependencies = [
"proc-macro2 1.0.85",
"quote 1.0.36",
"syn 2.0.66",
]
[[package]]
name = "env_filter"
version = "0.1.0"
@ -2920,8 +2948,9 @@ dependencies = [
[[package]]
name = "epaint"
version = "0.27.2"
source = "git+https://github.com/emilk/egui/?rev=10571e9da5b3658964adc8b85c7e3f8c1353e0db#10571e9da5b3658964adc8b85c7e3f8c1353e0db"
version = "0.28.1"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "3f0dcc0a0771e7500e94cd1cb797bd13c9f23b9409bdc3c824e2cbc562b7fa01"
dependencies = [
"ab_glyph",
"ahash 0.8.11",
@ -2931,6 +2960,7 @@ dependencies = [
"log",
"nohash-hasher",
"parking_lot 0.12.3",
"serde",
]
[[package]]
@ -11058,7 +11088,7 @@ dependencies = [
"js-sys",
"khronos-egl",
"libc",
"libloading 0.7.4",
"libloading 0.8.3",
"log",
"metal",
"naga",

View file

@ -46,8 +46,8 @@ grin_wallet_util = "5.3.1"
grin_wallet_controller = "5.3.1"
## ui
egui = { version = "0.27.2", default-features = false }
egui_extras = { version = "0.27.2", features = ["image", "svg"] }
egui = { version = "0.28.1", default-features = false }
egui_extras = { version = "0.28.1", features = ["image", "svg"] }
rust-i18n = "2.3.1"
## other
@ -109,7 +109,7 @@ openpnp_capture_sys = "0.4.0"
[target.'cfg(not(target_os = "android"))'.dependencies]
env_logger = "0.11.3"
winit = { version = "0.29.15" }
eframe = { version = "0.27.2", features = ["wgpu", "glow"] }
eframe = { version = "0.28.1", features = ["wgpu", "glow"] }
arboard = "3.2.0"
rfd = "0.14.1"
dark-light = "1.1.1"
@ -120,16 +120,10 @@ jni = "0.21.1"
android-activity = { version = "0.6.0", features = ["game-activity"] }
wgpu = "0.20.1"
winit = { version = "0.29.15", features = ["android-game-activity"] }
eframe = { version = "0.27.2", features = ["wgpu", "android-game-activity"] }
eframe = { version = "0.28.1", features = ["wgpu", "android-game-activity"] }
### patch grin store
#grin_store = "5.3.1"
#[patch.crates-io]
#grin_store = { path = "../grin-store" }
[patch.crates-io]
### patch grin store
#grin_store = { path = "../grin-store" }
### fix cross-compilation support for macos
openpnp_capture_sys = { git = "https://github.com/ardocrat/openpnp-capture-rs", branch = "cross_compilation_support" }
### actual version
egui = { git = "https://github.com/emilk/egui/", rev="10571e9da5b3658964adc8b85c7e3f8c1353e0db" }
egui_extras = { git = "https://github.com/emilk/egui/", rev="10571e9da5b3658964adc8b85c7e3f8c1353e0db" }
eframe = { git = "https://github.com/emilk/egui/", rev="10571e9da5b3658964adc8b85c7e3f8c1353e0db" }

View file

@ -13,7 +13,7 @@
// limitations under the License.
use std::time::Duration;
use egui::{Margin, RichText, ScrollArea};
use egui::{Id, Margin, RichText, ScrollArea};
use egui::scroll_area::ScrollBarVisibility;
use crate::AppConfig;
@ -201,7 +201,7 @@ impl NetworkContent {
};
// Draw title panel.
TitlePanel::ui(TitleType::Single(title_content), |ui| {
TitlePanel::new(Id::from("network_title_panel")).ui(TitleType::Single(title_content), |ui| {
if !show_connections {
View::title_button_big(ui, DOTS_THREE_OUTLINE_VERTICAL, |_| {
AppConfig::toggle_show_connections_network_panel();

View file

@ -12,44 +12,36 @@
// See the License for the specific language governing permissions and
// limitations under the License.
use egui::{Margin, Id};
use egui_extras::{Size, Strip, StripBuilder};
use egui::{Margin, Id, Layout, Align};
use crate::gui::Colors;
use crate::gui::views::{Content, View};
use crate::gui::views::types::{TitleContentType, TitleType};
/// Title panel with left/right action buttons and text in the middle.
pub struct TitlePanel;
pub struct TitlePanel {
/// Widget identifier.
id: Id
}
impl TitlePanel {
/// Default [`TitlePanel`] content height.
pub const DEFAULT_HEIGHT: f32 = 54.0;
pub fn ui(title: TitleType,
/// Create new title panel with provided identifier.
pub fn new(id: Id) -> Self {
Self {
id,
}
}
pub fn ui(&self,
title: TitleType,
mut left_content: impl FnMut(&mut egui::Ui),
mut right_content: impl FnMut(&mut egui::Ui),
ui: &mut egui::Ui) {
// Setup identifier and title type.
let (id, dual_title) = match &title {
TitleType::Single(content) => {
let text = match content {
TitleContentType::Title(text) => text,
TitleContentType::WithSubTitle(text, _, _) => text
};
(Id::from(text.clone()), false)
},
TitleType::Dual(first, _) => {
let first_text = match first {
TitleContentType::Title(text) => text,
TitleContentType::WithSubTitle(text, _, _) => text
};
let id = Id::from(first_text.to_owned()).with("_dual");
(id, true)
},
};
// Draw title panel.
egui::TopBottomPanel::top(id)
egui::TopBottomPanel::top(self.id)
.resizable(false)
.exact_height(Self::DEFAULT_HEIGHT + View::get_top_inset())
.frame(egui::Frame {
@ -63,90 +55,71 @@ impl TitlePanel {
..Default::default()
})
.show_inside(ui, |ui| {
StripBuilder::new(ui)
.size(Size::exact(Self::DEFAULT_HEIGHT))
.size(if dual_title {
Size::exact(Content::SIDE_PANEL_WIDTH - 2.0 * Self::DEFAULT_HEIGHT)
} else {
Size::remainder()
})
.size(if dual_title {
Size::exact(Self::DEFAULT_HEIGHT * 2.0)
} else {
Size::exact(0.0)
})
.size(if dual_title {
Size::remainder()
} else {
Size::exact(0.0)
})
.size(Size::exact(Self::DEFAULT_HEIGHT))
.horizontal(|mut strip| {
strip.cell(|ui| {
// Draw left panel action content.
ui.centered_and_justified(|ui| {
let rect = ui.available_rect_before_wrap();
ui.allocate_ui_with_layout(rect.size(), Layout::right_to_left(Align::Max), |ui| {
ui.horizontal_centered(|ui| {
(right_content)(ui);
});
ui.with_layout(Layout::left_to_right(Align::Min), |ui| {
ui.horizontal_centered(|ui| {
(left_content)(ui);
});
});
// Draw title text content.
match title {
TitleType::Single(content) => {
Self::title_text_content(&mut strip, content);
strip.empty();
strip.empty();
let content_rect = {
let mut r = rect;
r.min.x += Self::DEFAULT_HEIGHT;
r.max.x -= Self::DEFAULT_HEIGHT;
r
};
ui.allocate_ui_at_rect(content_rect, |ui| {
Self::title_text_content(ui, content);
});
}
TitleType::Dual(first, second) => {
Self::title_text_content(&mut strip, first);
strip.empty();
Self::title_text_content(&mut strip, second);
let first_rect = {
let mut r = rect;
r.max.x = r.min.x + Content::SIDE_PANEL_WIDTH - Self::DEFAULT_HEIGHT;
r.min.x += Self::DEFAULT_HEIGHT;
r
};
// Draw first title content.
ui.allocate_ui_at_rect(first_rect, |ui| {
Self::title_text_content(ui, first);
});
let second_rect = {
let mut r = rect;
r.min.x = first_rect.max.x + 2.0 * Self::DEFAULT_HEIGHT;
r.max.x -= Self::DEFAULT_HEIGHT;
r
};
// Draw second title content.
ui.allocate_ui_at_rect(second_rect, |ui| {
Self::title_text_content(ui, second);
});
}
}
strip.cell(|ui| {
// Draw right panel action content.
ui.centered_and_justified(|ui| {
(right_content)(ui);
});
});
});
});
}
/// Setup title text content.
fn title_text_content(strip: &mut Strip, content: TitleContentType) {
fn title_text_content(ui: &mut egui::Ui, content: TitleContentType) {
ui.vertical_centered(|ui| {
match content {
TitleContentType::Title(text) => {
strip.cell(|ui| {
ui.add_space(2.0);
ui.centered_and_justified(|ui| {
ui.add_space(13.0);
View::ellipsize_text(ui, text, 19.0, Colors::title(true));
});
});
}
TitleContentType::WithSubTitle(text, subtitle, animate) => {
strip.strip(|builder| {
Self::with_sub_title(builder, text, subtitle, animate);
});
}
}
}
/// Draw content for [`TitleType::WithSubTitle`] type.
fn with_sub_title(builder: StripBuilder, title: String, subtitle: String, animate_sub: bool) {
builder
.size(Size::remainder())
.size(Size::exact(30.0))
.vertical(|mut strip| {
strip.cell(|ui| {
ui.add_space(4.0);
ui.centered_and_justified(|ui| {
View::ellipsize_text(ui, title, 18.0, Colors::title(true));
});
});
strip.cell(|ui| {
ui.centered_and_justified(|ui| {
View::animate_text(ui, subtitle, 15.0, Colors::text(true), animate_sub);
});
});
ui.add_space(3.0);
View::ellipsize_text(ui, text, 18.0, Colors::title(true));
ui.add_space(-1.0);
View::animate_text(ui, subtitle, 15.0, Colors::text(true), animate)
}
}
});
}
}

View file

@ -275,7 +275,7 @@ impl WalletsContent {
};
// Draw title panel.
TitlePanel::ui(title_content, |ui| {
TitlePanel::new(Id::new("wallets_title_panel")).ui(title_content, |ui| {
if show_wallet && !dual_panel {
View::title_button_big(ui, ARROW_LEFT, |_| {
self.wallets.select(None);