如何设置Xamarin.iOS中UIPickerView的文本颜色与字号？

问题描述 #

我在Xamarin.iOS中通过特定配置，使用UIPickerView模拟下拉列表功能，对应代码如下：

public void ConfigureSelectPicker(UITextField pickerTextField, List<string> theData)
{
    PickerViewModel MyModel = new PickerViewModel();
    MyModel._pickerSource = theData;
    var picker = new UIPickerView
    {
        Model = MyModel,
        ShowSelectionIndicator = true,
        TintColor = UIColor.Blue
    };
    var screenWidth = UIScreen.MainScreen.Bounds.Width;
    var pickerToolBar = new UIToolbar(new RectangleF(0, 0, (float)screenWidth, 44)) { BarStyle = UIBarStyle.Default, Translucent = true };
    var flexibleSpaceButton = new UIBarButtonItem(UIBarButtonSystemItem.FlexibleSpace);
    var doneButton = new UIBarButtonItem(UIBarButtonSystemItem.Done, (sender, e) => pickerTextField.ResignFirstResponder());
    doneButton.Clicked += (object sender, EventArgs e) =>
    {
        pickerTextField.Text = MyModel.SelectedItem;
    };
    pickerToolBar.SetItems(new[] { flexibleSpaceButton, doneButton }, false);

    pickerTextField.InputView = picker;
    pickerTextField.InputAccessoryView = pickerToolBar;
}

但theData列表中的字符串在选择器中出现截断，请问能否修改字号使其完整显示，同时更改文本颜色？

解决方案 #

要解决文本截断并修改样式，需要自定义PickerViewModel的单元格渲染逻辑，重写GetView方法来控制文本显示样式：

修改后的PickerViewModel代码 #

public class PickerViewModel : UIPickerViewModel
{
    public List<string> _pickerSource { get; set; }
    public string SelectedItem { get; private set; }

    public override nint GetRowsInComponent(UIPickerView pickerView, nint component)
    {
        return _pickerSource?.Count ?? 0;
    }

    public override nint GetComponentCount(UIPickerView pickerView)
    {
        return 1;
    }

    public override string GetTitle(UIPickerView pickerView, nint row, nint component)
    {
        return _pickerSource[(int)row];
    }

    // 重写GetView自定义单元格样式，解决截断问题
    public override UIView GetView(UIPickerView pickerView, nint row, nint component, UIView view)
    {
        UILabel label;
        // 复用已有视图提升性能
        if (view != null)
        {
            label = view as UILabel;
        }
        else
        {
            label = new UILabel();
            // 配置自动换行，确保长文本完整显示
            label.LineBreakMode = UILineBreakMode.WordWrap;
            label.Lines = 0;
            label.TextAlignment = UITextAlignment.Center;
            // 添加内边距避免文本贴边
            label.Padding = new UIEdgeInsets(5, 10, 5, 10);
        }

        // 设置文本内容、字号和颜色
        label.Text = _pickerSource[(int)row];
        label.Font = UIFont.SystemFontOfSize(14); // 根据需求调整字号大小
        label.TextColor = UIColor.DarkGray; // 自定义文本颜色

        return label;
    }

    public override void Selected(UIPickerView pickerView, nint row, nint component)
    {
        SelectedItem = _pickerSource[(int)row];
    }
}

关键说明 #

• 通过LineBreakMode = UILineBreakMode.WordWrap和Lines = 0实现文本自动换行，彻底解决长文本截断问题
• 直接修改Font属性调整字号，TextColor属性设置文本颜色，满足样式自定义需求
• 复用已有UIView避免重复创建控件，提升选择器滚动性能

内容的提问来源于stack exchange，提问作者Prescott Chartier