[Android] Button.IsEnabled binding inside a ListViewItem is not always updating correctly

[takla21]

Current behavior

When refreshing the list of Items binded to ListView.ItemsSource in which includes a button that gets enabled/disabled depending on the Item content. The button is not changing its enabled/disabled state according to the ItemsSource actual values.

Items that has IsEnabled = true should've been enabled from the above gif.

<ListView x:Name="Parent"
			  ItemsSource="{Binding Items}"
			  IsItemClickEnabled="True"
			  SelectionMode="None">

		<ListView.ItemTemplate>
			<DataTemplate>
				<Button Command="{Binding DataContext.ClickCommand, ElementName=Parent}"
						Content="{Binding Text}"
						CommandParameter="{Binding}"
						IsEnabled="{Binding IsEnabled}">
				</Button>
			</DataTemplate>
		</ListView.ItemTemplate>
	</ListView>

Expected behavior

Button enabled/disable state inside a ListViewItem should always reflect its binding.

How to reproduce it (as minimally and precisely as possible)

• Download this sample ListViewEnabled.zip
• Deploy on Android
• Click on any button in the list

Workaround

Wrapping the Button inside a Grid works

<Grid>
<Button Command="{Binding DataContext.ClickCommand, ElementName=Parent}"
						Content="{Binding Text}"
						CommandParameter="{Binding}"
						IsEnabled="{Binding IsEnabled}">
</Grid>

Works on UWP/WinUI

Yes

Environment

Uno.WinUI / Uno.WinUI.WebAssembly / Uno.WinUI.Skia

NuGet package version(s)

4.10.0-dev.395

Affected platforms

Android

IDE

Visual Studio 2022

IDE version

17.6.1

Relevant plugins

No response

Anything else we need to know?

It's a regression that was not happening on uno 4.6.44

[jeromelaban]

Thanks for the report. We'll take a look, but note that the enabled state is linked to the CanExecute state of the bound command, this may have an impact on the behavior.

[takla21]

If it can help, in the case of the sample provided, here's the implementation of ICommand. Even with that, the bug happens

 public class Command<T> : ICommand
    {
        private readonly Action<T> _act;

        public Command(Action<T> act)
        {
            _act = act;
        }

        public event EventHandler? CanExecuteChanged;

        public bool CanExecute(object? parameter) => true;

        public void Execute(object? parameter)
        {
            _act((T)parameter);
        }
    }

[jeromelaban]

Thanks. It's still likely that the binding to the command is causing this issue, where the command may not be set initially, causing the resulting IsEnabled to be disabled.

Note for contributors

Enhanced troubleshooting:

<DataTemplate>
	<Button x:Name="test" Command="{Binding DataContext.ClickCommand, ElementName=Parent}"
			CommandParameter="{Binding}"
			IsEnabled="{Binding IsEnabled, FallbackValue=true}">
        <TextBlock>
            <Run Text="Text:" /><Run Text="{Binding}" />
            <Run Text=" IsEnabled Source:" /><Run Text="{Binding IsEnabled}" />
            <Run Text=" IsEnabled Target:" /><Run Text="{Binding IsEnabled, ElementName=test}" />
        </TextBlock>
	</Button>
</DataTemplate>

Which shows a difference in source and target state:

[jeromelaban]

@ramezgerges Let's validate if #12884 may be fixing this issue as well.

[Youssef1313]

This is a template pooling issue. The workaround is FeatureConfiguration.FrameworkTemplate.IsPoolingEnabled = false; but that can have a performance impact.

[Youssef1313]

I wasn't able to get further than identifying the root cause :'(

[jeromelaban]

An update of this topic, wrapping the Button with a Grid will work around the problem.

We've been having similar issues (#11600) with the DataContext being set directly on the root element of a DataTemplate that is causing issues. In this case, it seems to be related to the reuse of the container and the way the DataContext is set to the root element.

@takla21 could you try this workaround and let us know?

[takla21]

@jeromelaban the workaround is indeed working, even on our app