Picker doesn't show selected item on Android

fedemkr commented 8 months ago

Description

When the user opens the Picker on Android it will show an alert dialog with the options to select but it's not showing the currently selected option. I think this is a UX issue given that if the dialog covers the picker EditText then the user needs to cancel the action to check what was currently selected. I think the problem is that on the PickerHandler.Android implementation SetItems is being used as you can see here but in my opinion SetSingleChoiceItems should be used which would enrich the dialog displaying the current selected option. I guess something like this should work:

builder.SetSingleChoiceItems(items, VirtualView.SelectedIndex, (s, e) =>
{
    var selectedIndex = e.Which;
    VirtualView.SelectedIndex = selectedIndex;
    base.PlatformView?.UpdatePicker(VirtualView);
});

If the change can't directly be added because is a change in current UI/UX behavior and everyone may not be in favor of this, could a Mode be added there so we can choose how to show the items?

Steps to Reproduce

Just add a Picker to some page with options to select.

Link to public reproduction project repository

No response

Version with bug

8.0.3

Is this a regression from previous behavior?

Yes, this used to work in Xamarin.Forms on the non-AppCompat version but using a NumberPicker which IMO is not ideal.

Last version that worked well

Unknown/Other

Affected platforms

Android

Affected platform versions

No response

Did you find any workaround?

No response

Relevant log output

No response

PureWeen commented 8 months ago

This is what I have so far for a workaround via a custom picker. I couldn't find a better way to get access to the dialog that pops up other than grabbing the private variable.

public class CustomPicker : Picker
{
    #if ANDROID
    protected override void OnHandlerChanging(HandlerChangingEventArgs args)
    {
        base.OnHandlerChanging(args);
        if (args.OldHandler?.PlatformView is MauiPicker picker)
            picker.Click -= OnClick;
    }

    protected override void OnHandlerChanged()
    {
        base.OnHandlerChanged();

        if (Handler?.PlatformView is MauiPicker picker)
            picker.Click += OnClick;
    }

    public async void OnClick (object sender, EventArgs args)
    {
        await Task.Yield();
        var property = (AndroidX.AppCompat.App.AlertDialog)typeof(PickerHandler).GetField("_dialog", BindingFlags.Instance | BindingFlags.NonPublic)?.GetValue (Handler);
        var window = property.Window;
        var view = window.DecorView.FindViewById<Android.Widget.FrameLayout>(Resource.Id.contentPanel);
        var meView = (Android.Widget.AbsListView)view.GetChildAt(0);
        var textView = meView.GetChildAt(SelectedIndex);
        textView.SetBackgroundColor(Colors.Red.ToPlatform());
    }

    #endif
}

fedemkr commented 8 months ago

I can confirm the workaround works, but we decided to copy the MAUI implementation of the handler and change it to use SetSingleChoiceItems so not to rely on Reflection and internal Android layout structure of the dialog that may vary on the future. Just in case someone finds this useful, I changed the code to something alike above, handling dismissing the dialog after selection:

builder.SetSingleChoiceItems(items, VirtualView.SelectedIndex, (s, e) =>
{
    var selectedIndex = e.Which;
    VirtualView.SelectedIndex = selectedIndex;
    base.PlatformView?.UpdatePicker(VirtualView);
    _dialog.Dismiss();
});

Thanks for the help!