slint-ui / slint

Slint is a declarative GUI toolkit to build native user interfaces for Rust, C++, or JavaScript apps.
https://slint.dev
Other
17.64k stars 607 forks source link

Changed event not working in a ListView #6836

Closed szecket closed 1 day ago

szecket commented 2 days ago

Bug Description

when creating objects using a for loop in a listview, touchareas do not work other than the first item

when creating a vertical layout with a for loop, everything is fine, touch areas respond as expected.

Reproducible Code (if applicable)

import { AboutSlint, Button, VerticalBox, Palette, ListView } from "std-widgets.slint";
export component Demo {
    ListView {
        for index in 10: item := Rectangle {
            height: 20px;
            width: 100px;
            border-color:red;
            border-width:1px;
            TouchArea {
                changed has-hover => {
                        if (self.has-hover) {
                            item.background = Palette.accent-background;
                        }
                        if (!self.has-hover) {
                            item.background = Palette.background;
                        }
                    }
            }
        }
    }
}

Environment Details

Product Impact

the selection popup

ogoffart commented 2 days ago

Indeed there is a bug there. The changed callback is only called for the first item. This is only in a ListView.

P.S: for this usecase, it is better not to use changed event and use bindings that depends on the has-hover property

import { AboutSlint, Button, VerticalBox, Palette, ListView } from "std-widgets.slint";
export component Demo {
    ListView {
        for index in 10: item := Rectangle {
            height: 20px;
            width: 100px;
            border-color:red;
            border-width:1px;
            background: ta.has-hover ? Palette.accent-background: Palette.background;
            ta := TouchArea { }
        }
    }
}