How to (enable/Disable or Text color change) in the items from picker .NET MAUI?

Question

I am binding the observable collection to the picker (Itemsource).
I need to enable only item 2.
How to do that i am not getting?

Answer 1

Hello,

Picker native to Maui does not currently provide content that allows you to modify the pop-up part. For this need, you can implement a fully custom Picker by combining Entry and Popup.

Please refer to the following documentation and sample code:

• Popup

Item:

public class Item
{
    public string Name { get; set; }
    public bool IsEnabled {  get; set; }
}

Entry:

<Entry IsReadOnly="True" x:Name="test_entry">
    <Entry.GestureRecognizers>
        <TapGestureRecognizer Tapped="TapGestureRecognizer_Tapped"/>
    </Entry.GestureRecognizers>
</Entry>

private async void TapGestureRecognizer_Tapped(object sender, TappedEventArgs e)
{
    var popup = new NewPage1();
    // The data returned by the Popup is taken as the result
    var result = await this.ShowPopupAsync(popup,CancellationToken.None);
    if (result is Item)
    {
        var item = (Item)result;
        test_entry.Text = item.Name;
    }
}

Popup:

<toolkit:Popup xmlns="
http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="
http://schemas.microsoft.com/winfx/2009/xaml"
               xmlns:local="clr-namespace:MauiApp10"
             xmlns:toolkit="
http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
             x:Class="MauiApp10.NewPage1">
<toolkit:Popup.BindingContext>
    <local:PopupViewModel/>
</toolkit:Popup.BindingContext>
<VerticalStackLayout>
    <ListView  x:Name="ListView"  ItemsSource="{Binding Items}" SelectionMode="Single" ItemSelected="ListView_ItemSelected">
        <ListView.ItemTemplate>
             <DataTemplate>
                  <ViewCell>
                       <Label Text="{Binding Name}" IsEnabled="{Binding IsEnabled}" />
                  </ViewCell>
             </DataTemplate>
         </ListView.ItemTemplate>
       </ListView>
   </VerticalStackLayout>
</toolkit:Popup>

private async void ListView_ItemSelected(object sender, SelectedItemChangedEventArgs e)
{
	var item = e.SelectedItem as Item;
    // If the selected item is Not Enable, a alert window will be displayed.
	if (item.IsEnabled) {
        await this.CloseAsync(e.SelectedItem);
	}
	else
	{
        await App.Current.MainPage.DisplayAlert("Alert", "Items in a non-Enable state cannot be selected.", "OK");
    }
}

Best Regards,

Alec Liu.

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

Answer 2

Try this:

XAML

<Picker

 IsEnabled="{Binding ControlsEnabled}"

 ItemsSource="{Binding PickerItems}"

 SelectedItem="{Binding PickerItem}" />

.CS

EnableControls = new Command(OnEnableControls);

DisableControls = new Command(OnDisableControls);

public Command EnableControls { get; }

private void OnEnableControls() { ControlsEnabled = true; }

public Command DisableControls { get; }

private void OnDisableControls() { ControlsEnabled = false; }

public bool ControlsEnabled

{

  get => controlsEnabled; 

  set => SetProperty(ref controlsEnabled, value); 

}

private bool controlsEnabled;

Regards!