Skip to content

Commit 3e0b189

Browse files
committed
Add scrollable alignment option
1 parent 329fbc7 commit 3e0b189

2 files changed

Lines changed: 194 additions & 23 deletions

File tree

examples/scrollable/src/main.rs

Lines changed: 47 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@ struct ScrollableDemo {
1919
scrollbar_margin: u16,
2020
scroller_width: u16,
2121
current_scroll_offset: scrollable::RelativeOffset,
22+
alignment: scrollable::Alignment,
2223
}
2324

2425
#[derive(Debug, Clone, Eq, PartialEq, Copy)]
@@ -31,6 +32,7 @@ enum Direction {
3132
#[derive(Debug, Clone)]
3233
enum Message {
3334
SwitchDirection(Direction),
35+
AlignmentChanged(scrollable::Alignment),
3436
ScrollbarWidthChanged(u16),
3537
ScrollbarMarginChanged(u16),
3638
ScrollerWidthChanged(u16),
@@ -53,6 +55,7 @@ impl Application for ScrollableDemo {
5355
scrollbar_margin: 0,
5456
scroller_width: 10,
5557
current_scroll_offset: scrollable::RelativeOffset::START,
58+
alignment: scrollable::Alignment::Start,
5659
},
5760
Command::none(),
5861
)
@@ -73,6 +76,15 @@ impl Application for ScrollableDemo {
7376
self.current_scroll_offset,
7477
)
7578
}
79+
Message::AlignmentChanged(alignment) => {
80+
self.current_scroll_offset = scrollable::RelativeOffset::START;
81+
self.alignment = alignment;
82+
83+
scrollable::snap_to(
84+
SCROLLABLE_ID.clone(),
85+
self.current_scroll_offset,
86+
)
87+
}
7688
Message::ScrollbarWidthChanged(width) => {
7789
self.scrollbar_width = width;
7890

@@ -164,10 +176,33 @@ impl Application for ScrollableDemo {
164176
.spacing(10)
165177
.width(Length::Fill);
166178

167-
let scroll_controls =
168-
row![scroll_slider_controls, scroll_orientation_controls]
169-
.spacing(20)
170-
.width(Length::Fill);
179+
let scroll_alignment_controls = column(vec![
180+
text("Scrollable alignment:").into(),
181+
radio(
182+
"Start",
183+
scrollable::Alignment::Start,
184+
Some(self.alignment),
185+
Message::AlignmentChanged,
186+
)
187+
.into(),
188+
radio(
189+
"End",
190+
scrollable::Alignment::End,
191+
Some(self.alignment),
192+
Message::AlignmentChanged,
193+
)
194+
.into(),
195+
])
196+
.spacing(10)
197+
.width(Length::Fill);
198+
199+
let scroll_controls = row![
200+
scroll_slider_controls,
201+
scroll_orientation_controls,
202+
scroll_alignment_controls
203+
]
204+
.spacing(20)
205+
.width(Length::Fill);
171206

172207
let scroll_to_end_button = || {
173208
button("Scroll to end")
@@ -203,7 +238,8 @@ impl Application for ScrollableDemo {
203238
Properties::new()
204239
.width(self.scrollbar_width)
205240
.margin(self.scrollbar_margin)
206-
.scroller_width(self.scroller_width),
241+
.scroller_width(self.scroller_width)
242+
.alignment(self.alignment),
207243
)
208244
.id(SCROLLABLE_ID.clone())
209245
.on_scroll(Message::Scrolled),
@@ -227,7 +263,8 @@ impl Application for ScrollableDemo {
227263
Properties::new()
228264
.width(self.scrollbar_width)
229265
.margin(self.scrollbar_margin)
230-
.scroller_width(self.scroller_width),
266+
.scroller_width(self.scroller_width)
267+
.alignment(self.alignment),
231268
)
232269
.style(theme::Scrollable::custom(ScrollbarCustomStyle))
233270
.id(SCROLLABLE_ID.clone())
@@ -268,13 +305,15 @@ impl Application for ScrollableDemo {
268305
Properties::new()
269306
.width(self.scrollbar_width)
270307
.margin(self.scrollbar_margin)
271-
.scroller_width(self.scroller_width),
308+
.scroller_width(self.scroller_width)
309+
.alignment(self.alignment),
272310
)
273311
.horizontal_scroll(
274312
Properties::new()
275313
.width(self.scrollbar_width)
276314
.margin(self.scrollbar_margin)
277-
.scroller_width(self.scroller_width),
315+
.scroller_width(self.scroller_width)
316+
.alignment(self.alignment),
278317
)
279318
.style(theme::Scrollable::Custom(Box::new(
280319
ScrollbarCustomStyle,

0 commit comments

Comments
 (0)