ListView: when adding/removing items, app immediately crashes on Windows, raise 'ItemTemplate count has exceeded the limit of 23' Exception on Android about fabulous.mauicontrols

[TimLariviere]

Thanks for the report!
I managed to reproduce with the example given 👍

What's happening in your case is that Fabulous expects your items to be a stable reference value (aka mutable list) instead of a non-mutable one (like F# list type where a new list instance is created with each mutation).

If the reference changes, Fabulous will consider the whole list needs to be reloaded and will lose the DataTemplates that were created previously -- causing the crash on Android after reaching the limit of .NET MAUI.

A workaround would be to change the Model type:

type Model = { Items: ObservableCollection<Item> }

Note: I'm using ObservableCollection instead of any System.Collections.IList type, because .NET MAUI expects the collection to raise events when adding/removing items which ObservableCollection do

Then, you can still add and remove items like usual.

let init () =
    let items = ObservableCollection<Item>()
    items.Add(Item.create())
    { Items = items }, Cmd.none

let update msg model =
    match msg with
    | Add ->
        model.Items.Add(Item.create())
        model, Cmd.none
    | RemoveLast ->
        if model.Items.Count > 0 then
            model.Items.RemoveAt(model.Items.Count - 1)
        
        model, Cmd.none

This approach will work, though it has some drawbacks because of the mutated collection (especially if you want clean separation between states).

Virtualized collection widgets like ListView are very tricky to work with in Fabulous, and can easily crash.
I'm not really satisfied with our implementation.

[heldap]

Thanks you for the quick reply :)
This workaround is fine for my needs.

May I close this issue ?
It could be interesting to keep it opened though, as someone else might encounter this issue (since using F# list is instinctive): keeping it opened makes the workaround visible.