代码之家 › 专栏 › 技术社区 › jtth

iOS Xamarin的Picker渲染器。形式?

uipickerview xamarin.forms ios c#

jtth · 技术社区 · 7 年前

我是Xamarin的新手。表单编程。要自定义/更改选择器的方式

图片中: -带有文本“Select”的按钮,单击时调用选择器。焦点() -选择按钮后面同时具有黑色背景和文本颜色的选择器 -空ListView -当选取器处于“聚焦”状态时,会弹出“选取器选项控制盘”窗格

选择器实现代码:

Picker picker = new Picker
{
    HorizontalOptions = LayoutOptions.Start,
    VerticalOptions = LayoutOptions.Center,
    WidthRequest = 73,
    HeightRequest = 25,
    BackgroundColor = Color.Black,
    TextColor = Color.Black
};

List<string> myList = new List<string>();
myList.Add("OPTIONS 1");
myList.Add("OPTIONS 2");
myList.Add("OPTIONS 3");
myList.Add("OPTIONS 4");
myList.Add("OPTIONS 5");

foreach (string str in myList)
{
    picker.Items.Add(str);
}

代码自定义用户单击以查看选择器选项控制盘窗格的“框”,但不(或至少看起来)提供任何自定义选择器窗格的选项。

如何在ListView中放置捡拾盘弹出式窗格? 如何更改拾取轮内选项的字体大小以及显示选项的窗格的高度?

tl;dr-如何更改选择器窗格高度、项目字体大小和窗格位置?

就我所知。。。

using Xamarin.Forms;
using Xamarin.Forms.Platform.iOS;

using AppName.iOS;
using AppName;

[assembly: ExportRenderer(typeof(MyPicker), typeof(MyPickerRenderer))]
namespace AppName.iOS
{
    public class MyPickerRenderer : PickerRenderer
    {
        protected override void OnElementChanged(ElementChangedEventArgs<Picker> e)
        {
            base.OnElementChanged(e);

            if (e.OldElement != null)
            {
                // Unsubscribe from event handlers and cleanup any resources
            }

            if (e.NewElement != null)
            {
                // Configure the native control and subscribe to event handlers
            }
        }
    }
}

2 回复 | 直到 7 年前

Ax1le 7 年前

iOS中的拾取轮称为 UIPickerView 我们可以在渲染器中获得以下控件:

UITextField textField = Control;
UIPickerView pickerView = textField.InputView as UIPickerView;

然后我们可以根据您的需要使用 Delegate .

首先我们应该得到 dataSource 在您的情况下,我们可以得到如下结果:

Picker myPicker = Element;
itemList = myPicker.Items.ToList();

其次,创建委托并将列表设置为参数:

pickerView.Delegate = new MyPickerViewDelegate(itemList);

public class MyPickerViewDelegate: UIPickerViewDelegate
{

    List<string> itemList;

    public MyPickerViewDelegate(List<string> list)
    {
        itemList = list;
    }
}

最后,我们可以开始定制以下事件:

//Define the Font size or style
public override NSAttributedString GetAttributedTitle(UIPickerView pickerView, nint row, nint component)
{
    var text = new NSAttributedString(
        itemList[(int)row],
        font: UIFont.SystemFontOfSize(24),
        foregroundColor: UIColor.Red,
        strokeWidth: 4
    );

    return text;
}
//Define the row height
public override nfloat GetRowHeight(UIPickerView pickerView, nint component)
{
    return 80;
}

此外,如果要自定义更灵活的位置(包括放置),可以使用以下方法:

public override UIView GetView(UIPickerView pickerView, nint row, nint component, UIView view)
{
    UIView contentView = new UIView(new CGRect(0, 0, UIScreen.MainScreen.Bounds.Size.Width, 80));

    UILabel label = new UILabel();
    label.Frame = contentView.Bounds;
    contentView.AddSubview(label);

    label.Text = itemList[(int)row];
    //Change the label style
    label.Font = UIFont.SystemFontOfSize(24);
    label.TextColor = UIColor.Red;

    return contentView;
}

以下是我的自定义渲染器,供您参考:

public class MyPickerRenderer : PickerRenderer
{
    List<string> itemList;
    protected override void OnElementChanged(ElementChangedEventArgs<Picker> e)
    {
        base.OnElementChanged(e);

        Picker myPicker = Element;
        itemList = myPicker.Items.ToList();

        UITextField textField = Control;
        UIPickerView pickerView = textField.InputView as UIPickerView;
        pickerView.Delegate = new MyPickerViewDelegate(itemList);
    }
}

Matt Stannett 7 年前

您必须创建自己的 UiPickerView . 这将允许您使用 this guide 或者这个。高度和位置;看来你可以 set the placement 但身高有点难,我只能在objective C或swift中找到例子。

祝你好运!