iOS Xamarin.Forms的Picker渲染器？

Question

我是Xamarin.Forms編程的新手。 想自定義/更改選擇器的方式

在圖片中：-帶有文本“選擇”的按鈕，在單擊時調用picker.Focus（）-在選擇按鈕后面同時具有黑色背景和文本顏色的選擇器-空的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);
}

代碼自定義了用戶單擊以使選擇器選項輪窗格進入視圖的“框”，但是沒有（或至少看起來沒有）提供用於自定義選擇器窗格的任何選項。

如何將Picker Wheel彈出窗格放置在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
            }
        }
    }
}

Answer 1

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);
    }
}

Answer 2

您將必須創建自己的UiPickerView 。 這樣您就可以使用本指南或本指南來設置字體大小。 至於高度和位置； 看來您可以設置位置，但是高度要困難一些，我只能在目標C或swift中找到示例。

祝你好運！