leyoda/libcosmic
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fixed table view issues with selection on compact view and some spacing problems

Browse source
This commit is contained in:
Adam Cosner 2024-12-30 14:37:27 -05:00
parent e608192030
commit ad4ed38538
3 changed files with 85 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

24
examples/table-view/src/main.rs
View file

@ -28,7 +28,7 @@ impl std::fmt::Display for Category {
} }
} }
impl table::model::category::ItemCategory for Category { impl table::ItemCategory for Category {
fn width(&self) -> iced::Length { fn width(&self) -> iced::Length {
match self { match self {
Self::Name => iced::Length::Fill, Self::Name => iced::Length::Fill,
@ -54,7 +54,7 @@ impl Default for Item {
} }
} }
impl table::model::category::ItemInterface<Category> for Item { impl table::ItemInterface<Category> for Item {
fn get_icon(&self, category: Category) -> Option<cosmic::widget::Icon> { fn get_icon(&self, category: Category) -> Option<cosmic::widget::Icon> {
if category == Category::Name { if category == Category::Name {
Some(cosmic::widget::icon::from_name("application-x-executable-symbolic").icon()) Some(cosmic::widget::icon::from_name("application-x-executable-symbolic").icon())
@ -104,7 +104,7 @@ pub enum Message {
/// The [`App`] stores application-specific state. /// The [`App`] stores application-specific state.
pub struct App { pub struct App {
core: Core, core: Core,
table_model: table::Model<table::model::selection::SingleSelect, Item, Category>, table_model: table::SingleSelectModel<Item, Category>,
} }
/// Implement [`cosmic::Application`] to integrate with COSMIC. /// Implement [`cosmic::Application`] to integrate with COSMIC.
@ -192,9 +192,19 @@ impl cosmic::Application for App {
/// Creates a view after each update. /// Creates a view after each update.
fn view(&self) -> Element<Self::Message> { fn view(&self) -> Element<Self::Message> {
table::TableView::new(&self.table_model) cosmic::widget::responsive(|size| {
.on_item_select(Message::ItemSelect) if size.width < 600.0 {
.on_category_select(Message::CategorySelect) table::SingleSelectTableView::new(&self.table_model)
.element_standard() .on_item_select(Message::ItemSelect)
.on_category_select(Message::CategorySelect)
.element_compact()
} else {
table::SingleSelectTableView::new(&self.table_model)
.on_item_select(Message::ItemSelect)
.on_category_select(Message::CategorySelect)
.element_standard()
}
})
.into()
} }
} }

15
src/widget/table/mod.rs
View file

@ -2,6 +2,19 @@
//! //!
pub mod model; pub mod model;
pub use model::{Entity, Model}; pub use model::{
category::ItemCategory,
category::ItemInterface,
selection::{MultiSelect, SingleSelect},
Entity, Model,
};
pub mod widget; pub mod widget;
pub use widget::TableView; pub use widget::TableView;
pub type SingleSelectTableView<'a, Item, Category, Message> =
TableView<'a, SingleSelect, Item, Category, Message>;
pub type SingleSelectModel<Item, Category> = Model<SingleSelect, Item, Category>;
pub type MultiSelectTableView<'a, Item, Category, Message> =
TableView<'a, MultiSelect, Item, Category, Message>;
pub type MultiSelectModel<Item, Category> = Model<MultiSelect, Item, Category>;

67
src/widget/table/widget/mod.rs
View file

@ -199,12 +199,11 @@ where
.apply(Element::from)] .apply(Element::from)]
} else { } else {
self.model self.model
.order
.iter() .iter()
.map(|entity| { .map(|entity| {
let item = self.model.item(*entity).unwrap(); let item = self.model.item(entity).unwrap();
let categories = &self.model.categories; let categories = &self.model.categories;
let selected = self.model.is_active(*entity); let selected = self.model.is_active(entity);
vec![ vec![
divider::horizontal::default() divider::horizontal::default()
@ -222,20 +221,12 @@ where
.apply(container) .apply(container)
.width(category.width()) .width(category.width())
.align_y(Alignment::Center) .align_y(Alignment::Center)
.padding(self.item_padding)
.apply(Element::from) .apply(Element::from)
}) })
.collect::<Vec<Element<'a, Message>>>() .collect::<Vec<Element<'a, Message>>>()
.apply(widget::row::with_children) .apply(widget::row::with_children)
.apply(widget::mouse_area)
.apply(|mouse_area| {
if let Some(ref on_item_select) = self.on_item_select {
mouse_area.on_press((on_item_select)(*entity))
} else {
mouse_area
}
})
.apply(container) .apply(container)
.padding(self.item_padding)
.class(theme::Container::custom(move |theme| { .class(theme::Container::custom(move |theme| {
widget::container::Style { widget::container::Style {
icon_color: if selected { icon_color: if selected {
@ -262,6 +253,14 @@ where
shadow: Default::default(), shadow: Default::default(),
} }
})) }))
.apply(widget::mouse_area)
.apply(|mouse_area| {
if let Some(ref on_item_select) = self.on_item_select {
mouse_area.on_press((on_item_select)(entity))
} else {
mouse_area
}
})
.apply(Element::from), .apply(Element::from),
] ]
}) })
@ -273,6 +272,8 @@ where
.flatten() .flatten()
.collect::<Vec<Element<'a, Message>>>() .collect::<Vec<Element<'a, Message>>>()
.apply(widget::column::with_children) .apply(widget::column::with_children)
.spacing(self.item_spacing)
.padding(self.element_padding)
.apply(Element::from) .apply(Element::from)
} }
@ -283,7 +284,9 @@ where
.iter() .iter()
.map(|entity| { .map(|entity| {
let item = self.model.item(entity).unwrap(); let item = self.model.item(entity).unwrap();
let selected = self.model.is_active(entity);
widget::column() widget::column()
.spacing(self.item_spacing)
.push( .push(
widget::divider::horizontal::default() widget::divider::horizontal::default()
.apply(container) .apply(container)
@ -291,6 +294,7 @@ where
) )
.push( .push(
widget::row() widget::row()
.spacing(space_xxxs)
.align_y(Alignment::Center) .align_y(Alignment::Center)
.push_maybe( .push_maybe(
item.get_icon(Category::default()).map(|icon| icon.size(48)), item.get_icon(Category::default()).map(|icon| icon.size(48)),
@ -321,12 +325,49 @@ where
}), }),
) )
.apply(container) .apply(container)
.padding(self.item_padding), .padding(self.item_padding)
.width(iced::Length::Fill)
.class(theme::Container::custom(move |theme| {
widget::container::Style {
icon_color: if selected {
Some(theme.cosmic().on_accent_color().into())
} else {
None
},
text_color: if selected {
Some(theme.cosmic().on_accent_color().into())
} else {
None
},
background: if selected {
Some(iced::Background::Color(
theme.cosmic().accent_color().into(),
))
} else {
None
},
border: Border {
radius: theme.cosmic().radius_xs().into(),
..Default::default()
},
shadow: Default::default(),
}
}))
.apply(widget::mouse_area)
.apply(|ma| {
if let Some(on_item_select) = &self.on_item_select {
ma.on_press((on_item_select)(entity))
} else {
ma
}
}),
) )
.apply(Element::from) .apply(Element::from)
}) })
.collect::<Vec<Element<'a, Message>>>() .collect::<Vec<Element<'a, Message>>>()
.apply(widget::column::with_children) .apply(widget::column::with_children)
.spacing(self.item_spacing)
.padding(self.element_padding)
.apply(Element::from) .apply(Element::from)
} }
} }