Xamarin.Forms 中 Picker 的自定义渲染器

Posted

技术标签:

【中文标题】Xamarin.Forms 中 Picker 的自定义渲染器【英文标题】:Custom Renderer for Picker in Xamarin.Forms 【发布时间】:2018-09-29 03:43:48 【问题描述】:

我想自定义我的选择器。我为我的选择器创建了一个自定义渲染器,但我不知道自定义设置如何。如何更改项目的字体样式和大小?以及如何删除这两行?

public class CustomPickerRenderer : PickerRenderer

    public CustomPickerRenderer(Context context) : base(context)
    
        AutoPackage = false;
    

    protected override void OnElementChanged(ElementChangedEventArgs<Picker> e)
    
        base.OnElementChanged(e);
        if (e.OldElement == null)
        
            Control.Background = null;
            var layoutParams = new MarginLayoutParams(Control.LayoutParameters);
            layoutParams.SetMargins(0, 0, 0, 0);
            Control.LayoutParameters = layoutParams;
            Control.SetPadding(0, 0, 0, 0);
            SetPadding(0, 0, 0, 0);
        
    

【问题讨论】:

【参考方案1】:

如果要设置文本的fontSize,首先需要自定义一个从NumberPicker扩展的子类,并覆盖AddView方法。

 public class TextColorNumberPicker: NumberPicker

    public TextColorNumberPicker(Context context) : base(context)
    

    

    public override void AddView(View child, int index, ViewGroup.LayoutParams @params)
    
        base.AddView(child, index, @params);
        UpdateView(child);
    

    public void UpdateView(View view)
    
        if ( view is EditText ) 

            //set the font of text
            ((EditText)view).TextSize = 8;
        
    

如果你想删除这些行,你应该重写NumberPicker

android 自定义渲染器中

public class MyAndroidPicker:PickerRenderer


    IElementController ElementController => Element as IElementController;


    public MyAndroidPicker()
    

    


    private AlertDialog _dialog;

    protected override void OnElementChanged(ElementChangedEventArgs<Picker> e)
    
        base.OnElementChanged(e);

        if (e.NewElement == null || e.OldElement != null)
            return;

        Control.Click += Control_Click;
    

    protected override void Dispose(bool disposing)
    
        Control.Click -= Control_Click;
        base.Dispose(disposing);
    


    private void SetPickerDividerColor(TextColorNumberPicker picker)
    
        Field[] fields = picker.Class.GetDeclaredFields();

        foreach (Field pf in fields)
        
            if(pf.Name.Equals("mSelectionDivider"))
            
                pf.Accessible = true;
                // set the color as transparent
                pf.Set(picker, new ColorDrawable(this.Resources.GetColor(Android.Resource.Color.Transparent)));

            
        

    


    private void Control_Click(object sender, EventArgs e)
    

        Picker model = Element;

        var picker = new TextColorNumberPicker(Context);
        if (model.Items != null && model.Items.Any())
        

            picker.MaxValue = model.Items.Count - 1;
            picker.MinValue = 0;
            picker.SetBackgroundColor(Android.Graphics.Color.Yellow);
            picker.SetDisplayedValues(model.Items.ToArray());

            //call the method after you setting DisplayedValues
            SetPickerDividerColor(picker);
            picker.WrapSelectorWheel = false;
            picker.Value = model.SelectedIndex;
        

        var layout = new LinearLayout(Context)  Orientation = Orientation.Vertical ;
        layout.AddView(picker);

        ElementController.SetValueFromRenderer(VisualElement.IsFocusedProperty, true);

        var builder = new AlertDialog.Builder(Context);
        builder.SetView(layout);

        builder.SetTitle(model.Title ?? "");
        builder.SetNegativeButton("Cancel  ", (s, a) =>
        
            ElementController.SetValueFromRenderer(VisualElement.IsFocusedProperty, false);
            // It is possible for the Content of the Page to be changed when Focus is changed.
            // In this case, we'll lose our Control.
            Control?.ClearFocus();
            _dialog = null;
        );
        builder.SetPositiveButton("Ok ", (s, a) =>
        
            ElementController.SetValueFromRenderer(Picker.SelectedIndexProperty, picker.Value);
            // It is possible for the Content of the Page to be changed on SelectedIndexChanged.
            // In this case, the Element & Control will no longer exist.
            if (Element != null)
            
                if (model.Items.Count > 0 && Element.SelectedIndex >= 0)
                    Control.Text = model.Items[Element.SelectedIndex];
                ElementController.SetValueFromRenderer(VisualElement.IsFocusedProperty, false);
                // It is also possible for the Content of the Page to be changed when Focus is changed.
                // In this case, we'll lose our Control.
                Control?.ClearFocus();
            
            _dialog = null;
        );

        _dialog = builder.Create();
        _dialog.DismissEvent += (ssender, args) =>
        
            ElementController?.SetValueFromRenderer(VisualElement.IsFocusedProperty, false);
        ;
        _dialog.Show();
    


【讨论】:

嗨 Lucas,如果我只想在 android 中自定义渲染我的选择器,我应该把这个文件保存在哪里?

以上是关于Xamarin.Forms 中 Picker 的自定义渲染器的主要内容,如果未能解决你的问题,请参考以下文章

Xamarin.forms--------------Picker

Picker.Items 中使用的 Xamarin.Forms 标记扩展

Xamarin Forms Picker - iOS 上的“完成”文本

Xamarin Forms - 在页面加载时使用异步数据加载 Picker 控件

更改 Xamarin Forms Picker 按钮样式 [重复]

在 Xamarin Forms 中的 Picker 项目上应用样式