chris/lumina-iced
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

tweaking ui of library_items and the width of the library

Browse source 
These changes make the library and each individual library react to
their size better.
This commit is contained in:
Chris Cochrun 2025-01-15 23:07:12 -06:00
parent d2394c6540
commit a792bc459f
2 changed files with 48 additions and 35 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/main.rs
View file

@ -612,7 +612,7 @@ impl cosmic::Application for App {
.center_y(Length::Fill) .center_y(Length::Fill)
.align_left(Length::Fill) .align_left(Length::Fill)
.width(Length::FillPortion(2)), .width(Length::FillPortion(2)),
library library.width(Length::FillPortion(2))
] ]
.width(Length::Fill) .width(Length::Fill)
.height(Length::Fill) .height(Length::Fill)

81
src/ui/library.rs
View file

@ -1,14 +1,9 @@
use cosmic::{ use cosmic::{
font::default, iced::{alignment::Vertical, Background, Border, Length},
iced::{
alignment::{Horizontal, Vertical},
Background, Border, Color, Length,
},
iced_widget::{column, row as rowm, text as textm}, iced_widget::{column, row as rowm, text as textm},
theme,
widget::{ widget::{
button, container, horizontal_space, icon, mouse_area, row, container, horizontal_space, icon, mouse_area, responsive,
scrollable, text, Column, Container, Space, row, scrollable, text, Container, Space,
}, },
Element, Task, Element, Task,
}; };
@ -165,12 +160,18 @@ impl Library {
let items = scrollable( let items = scrollable(
column({ column({
model.items.iter().map(|item| { model.items.iter().map(|item| {
let text = text::heading(elide_text( let text =
item.title(), Container::new(responsive(|size| {
18, text::heading(elide_text(
)) item.title(),
.center() size.width,
.wrapping(textm::Wrapping::None); ))
.center()
.wrapping(textm::Wrapping::None)
.into()
}))
.center_y(25)
.center_x(Length::Fill);
let icon = icon::from_name({ let icon = icon::from_name({
match model.kind { match model.kind {
LibraryKind::Song => { LibraryKind::Song => {
@ -187,23 +188,27 @@ impl Library {
} }
} }
}); });
Container::new(rowm![icon, text].spacing(10)) Container::new(
.padding(5) rowm![
.width(Length::Fill) horizontal_space().width(0),
.style(|t| { icon,
container::Style::default() text
.background(Background::Color( ]
t.cosmic().button.base.into(), .spacing(10)
)) .align_y(Vertical::Center),
.border( )
Border::default().rounded( .padding(5)
t.cosmic() .width(Length::Fill)
.corner_radii .style(|t| {
.radius_l, container::Style::default()
), .background(Background::Color(
) t.cosmic().button.base.into(),
}) ))
.into() .border(Border::default().rounded(
t.cosmic().corner_radii.radius_l,
))
})
.into()
}) })
}) })
.spacing(2) .spacing(2)
@ -227,9 +232,17 @@ impl Library {
} }
} }
fn elide_text(text: String, amount: usize) -> String { fn elide_text(text: String, width: f32) -> String {
if text.len() > amount { const CHAR_SIZE: f32 = 8.0;
format!("{}...", text.split_at(amount).0) let text_length = text.len() as f32 * CHAR_SIZE;
if text_length > width {
format!(
"{}...",
text.split_at(
((width / CHAR_SIZE) - 3.0).floor() as usize
)
.0
)
} else { } else {
text text
} }