From: Dominik Csapak <d.csapak@proxmox.com>
To: yew-devel@lists.proxmox.com
Subject: [yew-devel] [PATCH yew-widget-toolkit 1/2] widget: data table: column: allow setting vertical align
Date: Tue, 9 Sep 2025 10:16:39 +0200 [thread overview]
Message-ID: <20250909081701.946341-1-d.csapak@proxmox.com> (raw)
by default the vertical align is set to 'baseline', which is good for
text, but if we want to render something else in a column (e.g. a
`Meter`) we must use 'middle' otherwise the element will be also aligned
on the baseline making it not centered.
Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
src/widget/data_table/column.rs | 14 ++++++++++++++
src/widget/data_table/row.rs | 6 +++++-
2 files changed, 19 insertions(+), 1 deletion(-)
diff --git a/src/widget/data_table/column.rs b/src/widget/data_table/column.rs
index 1b95c3e..d702576 100644
--- a/src/widget/data_table/column.rs
+++ b/src/widget/data_table/column.rs
@@ -30,6 +30,9 @@ pub struct DataTableColumn<T: 'static> {
/// Horizontal table cell justification (start, end, left, center, right, justify).
#[prop_or(AttrValue::Static("start"))]
pub justify: AttrValue,
+ /// Vertical table cell align ("top", "bottom", "middle", "baseline").
+ #[prop_or_default]
+ pub vertical_align: Option<AttrValue>,
// only internal, use `apply_render` instead
render_cell: DataTableCellRenderer<T>,
@@ -196,6 +199,17 @@ impl<T: 'static> DataTableColumn<T> {
self.justify = justify.into();
}
+ /// Builder style method to set the vertical cell alignment.
+ pub fn vertical_align(mut self, vertical_align: impl IntoPropValue<Option<AttrValue>>) -> Self {
+ self.set_vertical_align(vertical_align);
+ self
+ }
+
+ /// Method to set the vertical cell alignment.
+ pub fn set_vertical_align(&mut self, vertical_align: impl IntoPropValue<Option<AttrValue>>) {
+ self.vertical_align = vertical_align.into_prop_value();
+ }
+
/// Builder style method to set the render function.
pub fn render(self, render: impl Into<RenderFn<T>>) -> Self {
let render = render.into();
diff --git a/src/widget/data_table/row.rs b/src/widget/data_table/row.rs
index 2770eb9..34bbbdf 100644
--- a/src/widget/data_table/row.rs
+++ b/src/widget/data_table/row.rs
@@ -128,7 +128,11 @@ impl<T: Clone + PartialEq + 'static> Component for PwtDataTableRow<T> {
continue;
}
- let vertical_align = props.vertical_align.to_owned().unwrap_or("baseline".into());
+ let vertical_align = props
+ .vertical_align
+ .to_owned()
+ .or(column.vertical_align.clone())
+ .unwrap_or("baseline".into());
let text_align = column.justify.to_owned();
let cell_active = match props.active_cell {
--
2.47.2
_______________________________________________
yew-devel mailing list
yew-devel@lists.proxmox.com
https://lists.proxmox.com/cgi-bin/mailman/listinfo/yew-devel
next reply other threads:[~2025-09-09 8:17 UTC|newest]
Thread overview: 3+ messages / expand[flat|nested] mbox.gz Atom feed top
2025-09-09 8:16 Dominik Csapak [this message]
2025-09-09 8:16 ` [yew-devel] [PATCH yew-widget-toolkit 2/2] widget: data table: tree column: don't propagate clicks when expanding Dominik Csapak
2025-09-10 13:10 ` [yew-devel] applied: [PATCH yew-widget-toolkit 1/2] widget: data table: column: allow setting vertical align Thomas Lamprecht
Reply instructions:
You may reply publicly to this message via plain-text email
using any one of the following methods:
* Save the following mbox file, import it into your mail client,
and reply-to-all from there: mbox
Avoid top-posting and favor interleaved quoting:
https://en.wikipedia.org/wiki/Posting_style#Interleaved_style
* Reply using the --to, --cc, and --in-reply-to
switches of git-send-email(1):
git send-email \
--in-reply-to=20250909081701.946341-1-d.csapak@proxmox.com \
--to=d.csapak@proxmox.com \
--cc=yew-devel@lists.proxmox.com \
/path/to/YOUR_REPLY
https://kernel.org/pub/software/scm/git/docs/git-send-email.html
* If your mail client supports setting the In-Reply-To header
via mailto: links, try the mailto: link
Be sure your reply has a Subject: header at the top and a blank line
before the message body.
This is a public inbox, see mirroring instructions
for how to clone and mirror all data and code used for this inbox