ui: fix list items paddings
This commit is contained in:
parent
5cd3994163
commit
6497d6798b
2 changed files with 98 additions and 91 deletions
|
@ -13,14 +13,14 @@
|
||||||
// limitations under the License.
|
// limitations under the License.
|
||||||
|
|
||||||
use chrono::{DateTime, NaiveDateTime, Utc};
|
use chrono::{DateTime, NaiveDateTime, Utc};
|
||||||
use egui::{RichText, Rounding, ScrollArea, Stroke};
|
use egui::{RichText, Rounding, ScrollArea, Stroke, vec2};
|
||||||
use grin_servers::DiffBlock;
|
use grin_servers::DiffBlock;
|
||||||
|
|
||||||
use crate::gui::Colors;
|
use crate::gui::Colors;
|
||||||
use crate::gui::icons::{AT, COINS, CUBE_TRANSPARENT, HASH, HOURGLASS_LOW, HOURGLASS_MEDIUM, TIMER};
|
use crate::gui::icons::{AT, COINS, CUBE_TRANSPARENT, HASH, HOURGLASS_LOW, HOURGLASS_MEDIUM, TIMER};
|
||||||
use crate::gui::platform::PlatformCallbacks;
|
use crate::gui::platform::PlatformCallbacks;
|
||||||
use crate::gui::views::network::{NetworkTab, NetworkTabType};
|
|
||||||
use crate::gui::views::{Modal, Network, View};
|
use crate::gui::views::{Modal, Network, View};
|
||||||
|
use crate::gui::views::network::{NetworkTab, NetworkTabType};
|
||||||
use crate::node::Node;
|
use crate::node::Node;
|
||||||
|
|
||||||
/// Chain metrics tab content.
|
/// Chain metrics tab content.
|
||||||
|
@ -131,7 +131,7 @@ impl NetworkTab for NetworkMetrics {
|
||||||
.stick_to_bottom(true)
|
.stick_to_bottom(true)
|
||||||
.show_rows(
|
.show_rows(
|
||||||
ui,
|
ui,
|
||||||
BLOCK_ITEM_HEIGHT,
|
BLOCK_ITEM_HEIGHT - 1.0,
|
||||||
blocks_size,
|
blocks_size,
|
||||||
|ui, row_range| {
|
|ui, row_range| {
|
||||||
for index in row_range {
|
for index in row_range {
|
||||||
|
@ -154,7 +154,7 @@ impl NetworkTab for NetworkMetrics {
|
||||||
fn on_modal_ui(&mut self, ui: &mut egui::Ui, modal: &Modal, cb: &dyn PlatformCallbacks) {}
|
fn on_modal_ui(&mut self, ui: &mut egui::Ui, modal: &Modal, cb: &dyn PlatformCallbacks) {}
|
||||||
}
|
}
|
||||||
|
|
||||||
const BLOCK_ITEM_HEIGHT: f32 = 74.90;
|
const BLOCK_ITEM_HEIGHT: f32 = 77.0;
|
||||||
|
|
||||||
/// Draw block difficulty item.
|
/// Draw block difficulty item.
|
||||||
fn block_item_ui(ui: &mut egui::Ui, db: &DiffBlock, rounding: [bool; 2]) {
|
fn block_item_ui(ui: &mut egui::Ui, db: &DiffBlock, rounding: [bool; 2]) {
|
||||||
|
@ -163,63 +163,62 @@ fn block_item_ui(ui: &mut egui::Ui, db: &DiffBlock, rounding: [bool; 2]) {
|
||||||
ui.add_space(4.0);
|
ui.add_space(4.0);
|
||||||
}
|
}
|
||||||
|
|
||||||
ui.horizontal(|ui| {
|
let mut rect = ui.available_rect_before_wrap();
|
||||||
ui.add_space(6.0);
|
rect.set_height(BLOCK_ITEM_HEIGHT);
|
||||||
ui.vertical(|ui| {
|
ui.allocate_ui_at_rect(rect, |ui| {
|
||||||
// Draw round background.
|
ui.horizontal(|ui| {
|
||||||
let mut rect = ui.available_rect_before_wrap();
|
ui.add_space(6.0);
|
||||||
rect.set_height(BLOCK_ITEM_HEIGHT);
|
ui.vertical(|ui| {
|
||||||
ui.painter().rect(
|
// Draw round background.
|
||||||
rect,
|
rect.min += vec2(8.0, 0.0);
|
||||||
Rounding {
|
ui.painter().rect(
|
||||||
nw: if rounding[0] { 8.0 } else { 0.0 },
|
rect,
|
||||||
ne: if rounding[0] { 8.0 } else { 0.0 },
|
Rounding {
|
||||||
sw: if rounding[1] { 8.0 } else { 0.0 },
|
nw: if rounding[0] { 8.0 } else { 0.0 },
|
||||||
se: if rounding[1] { 8.0 } else { 0.0 },
|
ne: if rounding[0] { 8.0 } else { 0.0 },
|
||||||
},
|
sw: if rounding[1] { 8.0 } else { 0.0 },
|
||||||
Colors::WHITE,
|
se: if rounding[1] { 8.0 } else { 0.0 },
|
||||||
Stroke { width: 1.0, color: Colors::ITEM_STROKE }
|
},
|
||||||
);
|
Colors::WHITE,
|
||||||
|
Stroke { width: 1.0, color: Colors::ITEM_STROKE }
|
||||||
|
);
|
||||||
|
|
||||||
|
ui.add_space(2.0);
|
||||||
|
|
||||||
ui.add_space(2.0);
|
|
||||||
ui.horizontal(|ui| {
|
|
||||||
ui.add_space(5.0);
|
|
||||||
// Draw block hash.
|
// Draw block hash.
|
||||||
ui.heading(RichText::new(format!("{} {}", HASH, db.block_hash))
|
ui.horizontal(|ui| {
|
||||||
.color(Colors::BLACK)
|
ui.add_space(5.0);
|
||||||
.size(17.0));
|
ui.label(RichText::new(format!("{} {}", HASH, db.block_hash))
|
||||||
});
|
.color(Colors::BLACK)
|
||||||
ui.horizontal(|ui| {
|
.size(17.0));
|
||||||
ui.add_space(6.0);
|
});
|
||||||
// Draw block difficulty and height.
|
// Draw block difficulty and height.
|
||||||
ui.heading(RichText::new(format!("{} {}", CUBE_TRANSPARENT, db.difficulty))
|
ui.horizontal(|ui| {
|
||||||
.color(Colors::TITLE)
|
ui.add_space(6.0);
|
||||||
.size(16.0));
|
let diff_text = format!("{} {} {} {}",
|
||||||
ui.add_space(2.0);
|
CUBE_TRANSPARENT,
|
||||||
ui.heading(RichText::new(AT).color(Colors::TITLE).size(16.0));
|
db.difficulty,
|
||||||
ui.add_space(2.0);
|
AT,
|
||||||
ui.heading(RichText::new(db.block_height.to_string())
|
db.block_height);
|
||||||
.color(Colors::TITLE)
|
ui.label(RichText::new(diff_text).color(Colors::TITLE).size(16.0));
|
||||||
.size(16.0));
|
});
|
||||||
});
|
|
||||||
ui.horizontal(|ui| {
|
|
||||||
ui.add_space(6.0);
|
|
||||||
// Draw block date.
|
// Draw block date.
|
||||||
ui.heading(RichText::new(format!("{} {}s", TIMER, db.duration))
|
ui.horizontal(|ui| {
|
||||||
.color(Colors::GRAY)
|
ui.add_space(6.0);
|
||||||
.size(16.0));
|
let block_time = NaiveDateTime::from_timestamp_opt(db.time as i64, 0).unwrap();
|
||||||
ui.add_space(4.0);
|
let block_date: DateTime<Utc> = DateTime::from_utc(block_time, Utc);
|
||||||
|
let block_time_text = block_date.format("%d/%m/%Y %H:%M:%S UTC").to_string();
|
||||||
|
ui.label(RichText::new(format!("{} {}s {} {}",
|
||||||
|
TIMER,
|
||||||
|
db.duration,
|
||||||
|
HOURGLASS_LOW,
|
||||||
|
block_time_text))
|
||||||
|
.color(Colors::GRAY)
|
||||||
|
.size(16.0));
|
||||||
|
});
|
||||||
|
|
||||||
ui.heading(RichText::new(HOURGLASS_LOW).color(Colors::GRAY).size(16.0));
|
|
||||||
ui.add_space(2.0);
|
ui.add_space(2.0);
|
||||||
// Draw block time.
|
|
||||||
let block_time = NaiveDateTime::from_timestamp_opt(db.time as i64, 0).unwrap();
|
|
||||||
let block_datetime: DateTime<Utc> = DateTime::from_utc(block_time, Utc);
|
|
||||||
ui.heading(RichText::new(block_datetime.format("%d/%m/%Y %H:%M:%S UTC").to_string())
|
|
||||||
.color(Colors::GRAY)
|
|
||||||
.size(16.0));
|
|
||||||
});
|
});
|
||||||
ui.add_space(2.0);
|
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
}
|
}
|
|
@ -188,46 +188,54 @@ impl NetworkTab for NetworkNode {
|
||||||
|
|
||||||
/// Draw connected peer info item.
|
/// Draw connected peer info item.
|
||||||
fn peer_item_ui(ui: &mut egui::Ui, peer: &PeerStats, rounding: [bool; 2]) {
|
fn peer_item_ui(ui: &mut egui::Ui, peer: &PeerStats, rounding: [bool; 2]) {
|
||||||
ui.vertical(|ui| {
|
let mut rect = ui.available_rect_before_wrap();
|
||||||
// Draw round background.
|
rect.set_height(77.0);
|
||||||
let mut rect = ui.available_rect_before_wrap();
|
ui.allocate_ui_at_rect(rect, |ui| {
|
||||||
rect.set_height(74.9);
|
ui.vertical(|ui| {
|
||||||
ui.painter().rect(
|
// Draw round background.
|
||||||
rect,
|
ui.painter().rect(
|
||||||
Rounding {
|
rect,
|
||||||
nw: if rounding[0] { 8.0 } else { 0.0 },
|
Rounding {
|
||||||
ne: if rounding[0] { 8.0 } else { 0.0 },
|
nw: if rounding[0] { 8.0 } else { 0.0 },
|
||||||
sw: if rounding[1] { 8.0 } else { 0.0 },
|
ne: if rounding[0] { 8.0 } else { 0.0 },
|
||||||
se: if rounding[1] { 8.0 } else { 0.0 },
|
sw: if rounding[1] { 8.0 } else { 0.0 },
|
||||||
},
|
se: if rounding[1] { 8.0 } else { 0.0 },
|
||||||
Colors::WHITE,
|
},
|
||||||
Stroke { width: 1.0, color: Colors::ITEM_STROKE }
|
Colors::WHITE,
|
||||||
);
|
Stroke { width: 1.0, color: Colors::ITEM_STROKE }
|
||||||
|
);
|
||||||
|
|
||||||
ui.add_space(2.0);
|
ui.add_space(2.0);
|
||||||
|
|
||||||
|
// Draw peer address
|
||||||
|
ui.horizontal(|ui| {
|
||||||
|
ui.add_space(5.0);
|
||||||
|
let addr_text = format!("{} {}", PLUGS_CONNECTED, &peer.addr);
|
||||||
|
ui.label(RichText::new(addr_text).color(Colors::BLACK).size(17.0));
|
||||||
|
});
|
||||||
|
// Draw peer difficulty and height
|
||||||
|
ui.horizontal(|ui| {
|
||||||
|
ui.add_space(6.0);
|
||||||
|
let diff_text = format!("{} {} {} {}",
|
||||||
|
PACKAGE,
|
||||||
|
peer.total_difficulty,
|
||||||
|
AT,
|
||||||
|
peer.height);
|
||||||
|
ui.label(RichText::new(diff_text).color(Colors::TITLE).size(16.0));
|
||||||
|
});
|
||||||
|
// Draw peer user-agent
|
||||||
|
ui.horizontal(|ui| {
|
||||||
|
ui.add_space(6.0);
|
||||||
|
let agent_text = format!("{} {}", DEVICES, &peer.user_agent);
|
||||||
|
ui.label(RichText::new(agent_text).color(Colors::GRAY).size(16.0));
|
||||||
|
});
|
||||||
|
|
||||||
// Draw peer address
|
|
||||||
ui.horizontal(|ui| {
|
|
||||||
ui.add_space(5.0);
|
|
||||||
let addr_text = format!("{} {}", PLUGS_CONNECTED, &peer.addr);
|
|
||||||
ui.label(RichText::new(addr_text).color(Colors::BLACK).size(17.0));
|
|
||||||
});
|
|
||||||
// Draw peer difficulty and height
|
|
||||||
ui.horizontal(|ui| {
|
|
||||||
ui.add_space(6.0);
|
|
||||||
let diff_text = format!("{} {}", PACKAGE, peer.total_difficulty);
|
|
||||||
ui.label(RichText::new(diff_text).color(Colors::TITLE).size(16.0));
|
|
||||||
ui.add_space(2.0);
|
ui.add_space(2.0);
|
||||||
ui.label(RichText::new(AT).color(Colors::TITLE).size(16.0));
|
|
||||||
ui.add_space(2.0);
|
|
||||||
ui.label(RichText::new(peer.height.to_string()).color(Colors::TITLE).size(16.0));
|
|
||||||
});
|
});
|
||||||
// Draw peer user-agent
|
|
||||||
ui.horizontal(|ui| {
|
|
||||||
ui.add_space(6.0);
|
|
||||||
let agent_text = format!("{} {}", DEVICES, &peer.user_agent);
|
|
||||||
ui.label(RichText::new(agent_text).color(Colors::GRAY).size(16.0));
|
|
||||||
});
|
|
||||||
ui.add_space(2.0);
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Add space after the last item.
|
||||||
|
if rounding[1] {
|
||||||
|
ui.add_space(5.0);
|
||||||
|
}
|
||||||
}
|
}
|
Loading…
Reference in a new issue