question

DavidSpecter-8404 avatar image
0 Votes"
DavidSpecter-8404 asked JarvanZhang-MSFT edited

Custom picker dialog render

Hi,
Is there a possibility of having a dialog picker with round edges?

Best Regards,
Davide.

dotnet-xamarin
· 3
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

Is there a possibility of having a dialog picker with round edges

For this function, try to create a custom picker renderer to create the corner radius for the dialog on each platform. For example, add corner radius for the date picker.

protected override DatePickerDialog CreateDatePickerDialog(int year, int month, int day)
{
     var dialog = base.CreateDatePickerDialog(year, month, day);
     dialog.Window.SetBackgroundDrawableResource(Resource.Drawable.background_drawable);
     return dialog;
}
0 Votes 0 ·

Hi Jarvan,
Your answer is completely fine for a datepicker but I asked for a "Normal" picker.
Unfortunately there's no method in custom render (or I didn't find it) that mention the dialog part.

Best Regards,
Davide.


0 Votes 0 ·

Sorry for the mistake. I'm trying to find out a solution with picker and will update it as soon as posible.

0 Votes 0 ·

1 Answer

JarvanZhang-MSFT avatar image
0 Votes"
JarvanZhang-MSFT answered JarvanZhang-MSFT edited

Hello,​

Welcome to our Microsoft Q&A platform!

Unfortunately there's no method in custom render (or I didn't find it) that mention the dialog par

It doesn't provide a way to get the dialog directly. Try customizing a dialog and add the corner radius. Then set it as the dialog.

To add the radius, we also need to create a drawable xml and set the xml as background for the dialog's content view. Then set the dialog' background to transparent.

Here is the sample code, you could refer to it.

public class CustomPickerRenderer : PickerRenderer
{
    public CustomPickerRenderer(Context context) : base(context)
    {
    }
    protected override void OnElementChanged(ElementChangedEventArgs<Picker> e)
    {
        base.OnElementChanged(e);
        Control.Click += PickerClickEvent;
    }
    protected override void Dispose(bool disposing)
    {
        Control.Click -= PickerClickEvent;
        base.Dispose(disposing);
    }
    private void PickerClickEvent(object sender, EventArgs e)
    {
        Picker picker = Element;
        var dialog = new Dialog(Forms.Context);
        dialog.Window.SetBackgroundDrawable(new ColorDrawable(Android.Graphics.Color.Transparent)); //set the dialog background to transparent
        ...
        dialog.Show();
    }

    class MyAdaptr : BaseAdapter
    {
        private IList<string> mList;
        public MyAdaptr(IList<string> itemsSource)
        {
            mList = itemsSource;
        }
        ...
    }
}

A similar thread you could refer to: https://stackoverflow.com/questions/57078371/apply-styles-on-picker-items-in-xamarin-forms

Best Regards,

Jarvan Zhang


If the response is helpful, 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.


5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.