Question

我是Xamrin.Forms编程的新手。我想自定义“Picker＆＃39;查看控件。在上图中有：

-Button with the text＆＃39; Select＆＃39; （点击时调用picker.Focus（）），
- 选择按钮后面有黑色背景和文字颜色的拍子，
-Empty ListView，
- 当选择器被聚焦时，弹出选择器选项轮窗格

如何，a）将轮窗移动到空白ListView中，或者b）延长轮窗的高度（以覆盖更多的屏幕）？ PS的例子：

Picker渲染器实现代码，现在（由@Land提供）：

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

            UITextField textField = Control;
            UIPickerView pickerView = textField.InputView as UIPickerView;
            Picker myPicker = Element;
            List<string> itemList;
            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(12),
                foregroundColor: UIColor.Black,
                strokeWidth: 1
            );

            return text;
        }

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

        //Customize more flexible (including placement) use following method:

        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, UIScreen.MainScreen.Bounds.Size.Height));

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

            label.Text = itemList[(int)row];
            //Change the label style
            label.Font = UIFont.SystemFontOfSize(12);
            label.TextColor = UIColor.Black;
            label.TextAlignment = UIKit.UITextAlignment.Center;

            return contentView;
        }
    }

}

Answer 1

a）将方框窗格移动到空白ListView
中

根据设计，UITextField的inputView将从底部飞入视图。如果你想将它放在ListView中。您可以尝试创建一个新控件而不是Picker。

b）延长轮窗的高度（以覆盖更多的轮窗）屏幕）？

是的，我们可以通过设置inputView的框架来实现这一点：

UIPickerView pickerView = textField.InputView as UIPickerView;
textField.InputView.Frame = new CGRect(0, 0, 320, 320);

但是当我们这样做时，它将与inputAccessoryView重叠（使用＆＃34; Done＆＃34;按钮来选择项目）。所以我们也需要自定义这个视图：

UIView accessoryView = new UIView(new CGRect(100, 100, 320, 144));
UIButton btn = new UIButton(UIButtonType.System);
btn.SetTitle("Done", UIControlState.Normal);
btn.AddTarget((sender, args) =>
{
    textField.Text = itemList[(int)(pickerView.SelectedRowInComponent(0))];
    textField.ResignFirstResponder();
}, UIControlEvent.TouchUpInside);
accessoryView.AddSubview(btn);
//Place the button at super view's top, right position.
btn.TranslatesAutoresizingMaskIntoConstraints = false;
accessoryView.AddConstraint(NSLayoutConstraint.Create(btn, NSLayoutAttribute.Trailing, NSLayoutRelation.Equal, accessoryView, NSLayoutAttribute.Trailing, 1, -10));
accessoryView.AddConstraint(NSLayoutConstraint.Create(btn, NSLayoutAttribute.Top, NSLayoutRelation.Equal, accessoryView, NSLayoutAttribute.Top, 1, 5));

textField.InputAccessoryView = accessoryView;

调整CGRect()的最后一个参数以满足延长轮窗高度的要求（在我的测试中，InputView的默认高度约为220，InputAccessoryView约为44.相应地调整它们。

拾取器渲染器高度/位置调整？

1 个答案: