Components / Filmstrip
Filmstrip
A strip of thumbnails of any length, whose cells come from the app.
Example
The component itself, running in WebAssembly, beside its code in a playground. Try it.
Code
use std::collections::BTreeSet;
use ravenrs::prelude::*;
fn filmstrip() -> impl View {
let selected = State::new(BTreeSet::from([2_usize]));
Filmstrip::new(5_000, |cell: FilmstripCell| {
// The cell belongs to the app: its picture, its stars, its badges.
let shade = (cell.index % 10) as f32 / 10.0;
let picture = ImageData::from_fn(64, 64, move |x, y| {
Color::rgb(0.2 + shade * 0.5, 0.3 + y as f32 / 200.0, 0.7 - x as f32 / 200.0)
});
let picture: AnyView = match picture {
Some(picture) => Box::new(Image::new(picture).height(72.0).stretch()),
None => Box::new(Spacer::new()),
};
VStack::new((picture, Rating::read_only((cell.index % 6) as u32).size(11.0)))
.spacing(4.0)
.align(Align::Center)
})
.cell_name(|index| format!("Photo {}", index + 1))
.selection(selected.binding())
.mode(SelectionMode::Multiple)
.cell_width(120.0)
.height(112.0)
.fade(Semantic::SurfaceElevated)
}