ListView viewport update seems to not "take" immediately about slint

[ogoffart]

There is indeed a design flaw: #602
I'm not sure yet what's the best way to solve this.

[npwoods]

bug-demo.zip

[ogoffart]

import { Button, StandardListView, VerticalBox } from "std-widgets.slint";

export component MainWindow inherits Window {
    in-out property <[StandardListViewItem]> model: [
        {text: "000"}, {text: "001"}, {text: "002"}, {text: "003"}, {text: "004"}, {text: "005"}, {text: "006"}, {text: "007"}, {text: "008"}, {text: "009"},
        {text: "010"}, {text: "011"}, {text: "012"}, {text: "013"}, {text: "014"}, {text: "015"}, {text: "016"}, {text: "017"}, {text: "018"}, {text: "019"},
        {text: "020"}, {text: "021"}, {text: "022"}, {text: "023"}, {text: "024"}, {text: "025"}, {text: "026"}, {text: "027"}, {text: "028"}, {text: "029"},
        {text: "030"}, {text: "031"}, {text: "032"}, {text: "033"}, {text: "034"}, {text: "035"}, {text: "036"}, {text: "037"}, {text: "038"}, {text: "039"},
        {text: "040"}, {text: "041"}, {text: "042"}, {text: "043"}, {text: "044"}, {text: "045"}, {text: "046"}, {text: "047"}, {text: "048"}, {text: "049"},
        {text: "050"}, {text: "051"}, {text: "052"}, {text: "053"}, {text: "054"}, {text: "055"}, {text: "056"}, {text: "057"}, {text: "058"}, {text: "059"},
        {text: "060"}, {text: "061"}, {text: "062"}, {text: "063"}, {text: "064"}, {text: "065"}, {text: "066"}, {text: "067"}, {text: "068"}, {text: "069"},
        {text: "070"}, {text: "071"}, {text: "072"}, {text: "073"}, {text: "074"}, {text: "075"}, {text: "076"}, {text: "077"}, {text: "078"}, {text: "079"},
        {text: "080"}, {text: "081"}, {text: "082"}, {text: "083"}, {text: "084"}, {text: "085"}, {text: "086"}, {text: "087"}, {text: "088"}, {text: "089"},
        {text: "090"}, {text: "091"}, {text: "092"}, {text: "093"}, {text: "094"}, {text: "095"}, {text: "096"}, {text: "097"}, {text: "098"}, {text: "099"},
    ];
    private property <length> item-height: my-list-view.viewport-height / my-list-view.model.length;
    private property <int> into-view-item: 0;
    private property <length> into-view-item-y: root.item-y(root.into-view-item);
    out property <length> my-list-view-viewport-y: my-list-view.viewport-y;
    out property <length> my-list-view-visible-height: my-list-view.visible-height;

    pure function item-y(index: int) -> length {
        return my-list-view.viewport-y + index * root.item-height;
    }

    public function bring-into-view(row: int) {
        if (row < 0 || row >= my-list-view.model.length) {
            return;
        }
        into-view-item = row;
        if (into-view-item-y < 0) {
            my-list-view.viewport-y += 0 - into-view-item-y;
        }
        if (into-view-item-y + item-height > my-list-view.visible-height) {
            my-list-view.viewport-y -= into-view-item-y + root.item-height - my-list-view.visible-height;
        }
    }

    min-width: 400px;
    min-height: 400px;
    max-width: 10000px;
    max-height: 10000px;
    VerticalBox {
        Button {
            text: "Bring Into View";
            clicked => { bring-into-view(42); }
        }
        my-list-view := StandardListView {
            model: root.model;
        }
    }

    // the "clicked" work, but the init doesn't
    init => { bring-into-view(42); }
}

I made a reproducer in pure Slint using the init callback.
The problem is that the geometry of the ListView is not yet calculated as the items are not instantiated until they need to be rendered.
And there is no way to force the instantiation otherwise

[npwoods]

I suppose then my question becomes, what is the recommended (or at least, "least worst") way to do this?

[npwoods]

I'm starting to think that this is a design flaw, as it means that there is not a reliable way to simultaneously update both:

• The backing data for a ListView
• Ancillary UI state (e.g. - positioning within the viewport, selected item for StandardListView etc) that might require the above data be processed

[npwoods]

I figured out a hacky workaround to get what I want:

1. On my struct that implements Model, I add a member of type Cell<Option<Box<dyn Future<Output = ()> + 'static>>>
2. When I refresh my model, I put logic that updates the selection (or brings the selected item into view) in a future, and place it into the Cell described above
3. I put the following code in my implementation of Model::row_count():

if let Some(callback) = cell.take() {
	let callback = Pin::from(callback);
	spawn_local(callback).unwrap();
}

This is a gross hack but it seems to work. I'm looking forward to when this hack becomes obsolete ;-)