Xamarin iOS UiPickerView教程

时间:2016-04-08 22:20:08

标签: ios xamarin uipickerview

我试图找到一些关于在Xamarin iOS中使用UiPickerView的基本说明。 Stack Overflow上有一些问题可以回答某些问题,但我只是想简单概述一下,希望能够将UiPickerView添加到ViewController,连接数据和注册事件。作为Xamarin和iOS的菜鸟,我很难对所有这些控件的代码进行编目。

5 个答案:

答案 0 :(得分:6)

//将PickerViewModel设置为PickerView

var examplePVM = new ExamplePickerViewModel(myListOfItems);
YourPickerView.Model = examplePVM ;

//创建PickerViewModel

public class ExamplePickerViewModel : UIPickerViewModel
{
    private List<string> _myItems;
    protected int selectedIndex = 0;

    public ExamplePickerViewModel(List<string> items)
    {
        _myItems = items;
    }

    public string SelectedItem
    {
        get { return _myItems[selectedIndex]; }
    }

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

    public override nint GetRowsInComponent (UIPickerView picker, nint component)
    {
        return _myItems.Count;
    }

    public override string GetTitle (UIPickerView picker, nint row, nint component)
    {
        return _myItems[row];
    }

    public override void Selected (UIPickerView picker, nint row, nint component)
    {
        selectedIndex = (int)row; 
    }
}

答案 1 :(得分:2)

// Textfield Click event
private bool OnTodeapartmentShouldBeginEditing(UITextField textField)
{

// Creating Picker view 
pickerView = new UIPickerView(new CGRect(UIScreen.MainScreen.Bounds.X-UIScreen.MainScreen.Bounds.Width, UIScreen.MainScreen.Bounds.Height -230, UIScreen.MainScreen.Bounds.Width, 180));
pickerView.BackgroundColor = UIColor.From#d3d3d3;
pickerView.ShowSelectionIndicator = true;

// create done button
done = new UIButton(new CGRect(pickerView.Frame.X, pickerView.Frame.Y - 50, UIScreen.MainScreen.Bounds.Width, 50));
done.BackgroundColor = UIColor.Purple;
done.SetTitle("Department List", UIControlState.Normal);

picker = new PickerDataModel(); 
if (departmentList.DepartmentDetail != null)
{

foreach (var item in departmentList.DepartmentDetail)
{
picker.Items.Add(item.Name);
}
pickerView.Model = picker;

view.AddSubviews(pickerView, done);
// value change event of picker view
picker.ValueChanged += (s, e) =>
{
selectedValue = picker.SelectedItem;
txtDepartment.Text = selectedValue;

deptID = departmentList.DepartmentDetail.Find(x => x.Name == selectedValue).DepartmentId;

}; 
}
}

新类文件enter image description here    //拾取器视图的Picker Data Model Class,此类文件用于辅助部分以供常用

public class PickerDataModel : UIPickerViewModel
{
public event EventHandler<EventArgs> ValueChanged;

/// <summary>
/// The items to show up in the picker
/// </summary>
public List<string> Items { get; private set; }

/// <summary>
/// The current selected item
/// </summary>
public string SelectedItem
{
get { return Items[SelectedIndex]; }
}

public int SelectedIndex
{
get
{
return selectedIndex;
}

set
{
selectedIndex = value;
}
}

private int selectedIndex;

public PickerDataModel()
{
Items = new List<string>();
}

/// <summary>
/// Called by the picker to determine how many rows are in a given spinner item
/// </summary>
public override nint GetRowsInComponent(UIPickerView picker, nint component)
{
return Items.Count;
}

/// <summary>
/// called by the picker to get the text for a particular row in a particular
/// spinner item
/// </summary>
public override string GetTitle(UIPickerView picker, nint row, nint component)
{
return Items[(int)row];
}

/// <summary>
/// called by the picker to get the number of spinner items
/// </summary>
public override nint GetComponentCount(UIPickerView picker)
{
return 1;
}

/// <summary>
/// called when a row is selected in the spinner
/// </summary>
public override void Selected(UIPickerView picker, nint row, nint component)
{
SelectedIndex = (int)row;
if (ValueChanged != null)
{
ValueChanged(this, new EventArgs());
}

}
} [enter image description here][1]


  [1]: https://i.stack.imgur.com/Ld1uU.png

答案 2 :(得分:1)

MonoCatalog-MonoDevelop示例中的PickerViewController file听起来就像您要求的那样。

特别是CreateCustomPicker函数hereCustomPickerModel类型定义here

答案 3 :(得分:0)

我创建了一个blog post来涵盖UIPickerView的基础知识。这可能是令人困惑的基本想法:

  1. 将UIPickerView添加到故事板等,并为其命名。
  2. 创建一个从UIPickerViewModel
  3. 延伸的类
  4. 设置选择器的模型pickerExample.Model = new YourListPicker(YourList);

答案 4 :(得分:0)

UIPickerView in Xamarin.iOS With Example Gender Selector

public class PickerView : UIViewController
{
    public PickerView() { }


    UITextField SelectGenderTextField = new UITextField();
    UIPickerView GenderPicker = new UIPickerView();

    public override void ViewDidLoad()
    {
        base.ViewDidLoad();
        AddTextField();
        GenderPicker();

        Constraint();
    }
  }

文本字段以显示选择器中的选定数据

    private void AddTextField()
    {
        SelectGenderTextField.Placeholder = "Select Gender";
        SelectGenderTextField.Layer.BorderWidth = 1;
        SelectGenderTextField.Layer.BorderColor = UIColor.Black.CGColor;
        SelectGenderTextField.Layer.MasksToBounds = true;
        SelectGenderTextField.Layer.SublayerTransform = CATransform3D.MakeTranslation(5, 0, 0); //to Create a Space At The beginning of the text field


        SelectGenderTextField.InputView = GenderPicker; //To Start The UIPickerView from The bottom.

    }

拾取器初始化和设置数据

    private void GenderPicker()
    {
        var genderList = new List<string> {
       "Male","Female"
    };

        var picker = new GenderPickerModel(genderList);

        GenderPicker.Model = picker;

        picker.ValueChanged += (sender, e) => {

            SelectGenderTextField.Text = picker.SelectedGenderByUser; //Update The Selected Value In the TextField

            View.EndEditing(true);// To Dismiss the Picker View Once The User Select The Value
        };

    }

使用了Cirrious.FluentLayouts。触摸约束

  private void Constraint()
    {
        View.AddSubviews(SelectGenderTextField);

        View.SubviewsDoNotTranslateAutoresizingMaskIntoConstraints();

        View.AddConstraints(


            SelectGenderTextField.WithRelativeWidth(View, 0.80f),
            SelectGenderTextField.WithRelativeHeight(View, 0.05f),
            SelectGenderTextField.WithSameCenterX(View),
            SelectGenderTextField.WithSameCenterY(View)


            );
    }

GenderPickerModel类

class GenderPickerModel : UIPickerViewModel
{
    public EventHandler ValueChanged;
    public string SelectedGenderByUser;
    private List<string> genderList;

    public GenderPickerModel(List<string> genderList)
    {
        this.genderList = genderList;
    }

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

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

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

    public override void Selected(UIPickerView pickerView, nint row, nint component)
    {
        var gender = genderList[(int)row];
        SelectedGenderByUser = gender;
        ValueChanged(null,null);
    }


}