reivilibre
/
iced-mobile
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Add scrolling progress indicators to `scrollable` example

This commit is contained in:
Héctor Ramón 2021-06-04 20:46:47 +07:00
parent 3051d4ec76
commit ce3a5f19b9
1 changed files with 32 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
examples/scrollable/src/main.rs
View File

@ -1,8 +1,8 @@
mod style; mod style;
use iced::{ use iced::{
button, scrollable, Button, Column, Container, Element, Length, Radio, Row, button, scrollable, Button, Column, Container, Element, Length,
Rule, Sandbox, Scrollable, Settings, Space, Text, ProgressBar, Radio, Row, Rule, Sandbox, Scrollable, Settings, Space, Text,
}; };
pub fn main() -> iced::Result { pub fn main() -> iced::Result {
@ -19,6 +19,7 @@ enum Message {
ThemeChanged(style::Theme), ThemeChanged(style::Theme),
ScrollToTop(usize), ScrollToTop(usize),
ScrollToBottom(usize), ScrollToBottom(usize),
Scrolled(usize, f32),
} }
impl Sandbox for ScrollableDemo { impl Sandbox for ScrollableDemo {
@ -41,11 +42,20 @@ impl Sandbox for ScrollableDemo {
Message::ScrollToTop(i) => { Message::ScrollToTop(i) => {
if let Some(variant) = self.variants.get_mut(i) { if let Some(variant) = self.variants.get_mut(i) {
variant.scrollable.snap_to(0.0); variant.scrollable.snap_to(0.0);
variant.latest_offset = 0.0;
} }
} }
Message::ScrollToBottom(i) => { Message::ScrollToBottom(i) => {
if let Some(variant) = self.variants.get_mut(i) { if let Some(variant) = self.variants.get_mut(i) {
variant.scrollable.snap_to(1.0); variant.scrollable.snap_to(1.0);
variant.latest_offset = 1.0;
}
}
Message::Scrolled(i, offset) => {
if let Some(variant) = self.variants.get_mut(i) {
variant.latest_offset = offset;
} }
} }
} }
@ -82,6 +92,9 @@ impl Sandbox for ScrollableDemo {
.spacing(10) .spacing(10)
.width(Length::Fill) .width(Length::Fill)
.height(Length::Fill) .height(Length::Fill)
.on_scroll(move |offset| {
Message::Scrolled(i, offset)
})
.style(*theme) .style(*theme)
.push(Text::new(variant.title)) .push(Text::new(variant.title))
.push( .push(
@ -143,10 +156,20 @@ impl Sandbox for ScrollableDemo {
.on_press(Message::ScrollToTop(i)), .on_press(Message::ScrollToTop(i)),
); );
Container::new(scrollable) Column::new()
.width(Length::Fill) .width(Length::Fill)
.height(Length::Fill) .height(Length::Fill)
.style(*theme) .spacing(10)
.push(
Container::new(scrollable)
.width(Length::Fill)
.height(Length::Fill)
.style(*theme),
)
.push(ProgressBar::new(
0.0..=1.0,
variant.latest_offset,
))
.into() .into()
}) })
.collect(), .collect(),
@ -181,6 +204,7 @@ struct Variant {
scrollbar_width: Option<u16>, scrollbar_width: Option<u16>,
scrollbar_margin: Option<u16>, scrollbar_margin: Option<u16>,
scroller_width: Option<u16>, scroller_width: Option<u16>,
latest_offset: f32,
} }
impl Variant { impl Variant {
@ -194,6 +218,7 @@ impl Variant {
scrollbar_width: None, scrollbar_width: None,
scrollbar_margin: None, scrollbar_margin: None,
scroller_width: None, scroller_width: None,
latest_offset: 0.0,
}, },
Self { Self {
title: "Slimmed & Margin", title: "Slimmed & Margin",
@ -203,6 +228,7 @@ impl Variant {
scrollbar_width: Some(4), scrollbar_width: Some(4),
scrollbar_margin: Some(3), scrollbar_margin: Some(3),
scroller_width: Some(4), scroller_width: Some(4),
latest_offset: 0.0,
}, },
Self { Self {
title: "Wide Scroller", title: "Wide Scroller",
@ -212,6 +238,7 @@ impl Variant {
scrollbar_width: Some(4), scrollbar_width: Some(4),
scrollbar_margin: None, scrollbar_margin: None,
scroller_width: Some(10), scroller_width: Some(10),
latest_offset: 0.0,
}, },
Self { Self {
title: "Narrow Scroller", title: "Narrow Scroller",
@ -221,6 +248,7 @@ impl Variant {
scrollbar_width: Some(10), scrollbar_width: Some(10),
scrollbar_margin: None, scrollbar_margin: None,
scroller_width: Some(4), scroller_width: Some(4),
latest_offset: 0.0,
}, },
] ]
} }