Function freya_components::VirtualScrollView

pub fn VirtualScrollView<Builder: Clone + Fn(usize, &Option<BuilderArgs>) -> Element, BuilderArgs: Clone + PartialEq>(
    props: VirtualScrollViewProps<Builder, BuilderArgs>,
) -> Element

One-direction scrollable area that dynamically builds and renders items based in their size and current available size, this is intended for apps using large sets of data that need good performance.

Use cases: text editors, chats, etc.

Example

fn app() -> Element {
    rsx!(VirtualScrollView {
        length: 5,
        item_size: 80.0,
        direction: "vertical",
        builder: move |i, _other_args: &Option<()>| {
            rsx! {
                label {
                    key: "{i}",
                    height: "80",
                    "Number {i}"
                }
            }
        }
    })
}

With a Scroll Controller

fn app() -> Element {
    let mut scroll_controller = use_scroll_controller(|| ScrollConfig::default());

    rsx!(VirtualScrollView {
        scroll_controller,
        length: 5,
        item_size: 80.0,
        direction: "vertical",
        builder: move |i, _other_args: &Option<()>| {
            rsx! {
                label {
                    key: "{i}",
                    height: "80",
                    onclick: move |_| {
                         scroll_controller.scroll_to(ScrollPosition::Start, ScrollDirection::Vertical);
                    },
                    "Number {i}"
                }
            }
        }
    })
}