想学用C#开发iphone 的就加入 QQ群:178290571 ,让我们共同进步吧!
C# MonoTouch for iphone 开发blog http://blog.csdn.net/ssihc0/
MonoDevelop 版本:2.8.1
MonoTouch 版本:4.2.2
UIPicker 分两大类
一种基于视图的选取器,另一种为日期选取器。
选取器实现在起来比之前介绍的控件都要复杂。
选取器的的数据回是通过回调来返回的。
回调的方法
public override int GetRowsInComponent (UIPickerView pickerView, int component)
public override UIView GetView (UIPickerView pickerView, int row, int component, UIView view)
下面看具体实现在吧!
新建一个工程 pickerViewViewController
在pickerViewViewController里添加下面代码
UIPickerView myPickerView, customPickerView;
UIDatePicker datePickerView;
UILabel label;
UIView currentPicker;
public pickerViewViewController () : base ("pickerViewViewController", null)
{
}
public override void DidReceiveMemoryWarning ()
{
// Releases the view if it doesn't have a superview.
base.DidReceiveMemoryWarning ();
// Release any cached data, images, etc that aren't in use.
}
public override void ViewDidLoad ()
{
base.ViewDidLoad ();
Title = "Picker";
CreatePicker ();
CreateDatePicker ();
CreateCustomPicker ();
buttonBarSegmentedControl.TintColor = UIColor.DarkGray;
pickerStyleSegmentedControl.TintColor = UIColor.DarkGray;
buttonBarSegmentedControl.ValueChanged += (sender, e) => {
TogglePickers((UISegmentedControl)sender);
};
pickerStyleSegmentedControl.ValueChanged += (sender, e) => {
TogglePickerStyle((UISegmentedControl)sender);
};
label = new UILabel (new RectangleF (20f, myPickerView.Frame.Y - 30f, View.Bounds.Width - 40f, 30f)){
Font = UIFont.SystemFontOfSize (14),
TextAlignment = UITextAlignment.Center,
TextColor = UIColor.White,
BackgroundColor = UIColor.Clear
};
label.Text="sdfsdfsf";
View.AddSubview (label);
buttonBarSegmentedControl.SelectedSegment = 0;
datePickerView.Mode = UIDatePickerMode.Date;
datePickerView.ValueChanged+= delegate(object sender, EventArgs e) {
var ctrl=(UIDatePicker)sender;
var dateString=DateTime.Parse(ctrl.Date.ToString()).ToString ("ddd dd MMM yyy h:mm:tt");
label.Text =dateString;
};
}
public override void ViewWillAppear (bool animated)
{
// NavigationController.NavigationBar.BarStyle = UIBarStyle.Black;
UIApplication.SharedApplication.StatusBarStyle = UIStatusBarStyle.BlackOpaque;
TogglePickers (buttonBarSegmentedControl);
}
public override void ViewWillDisappear (bool animated)
{
if (currentPicker != null)
currentPicker.Hidden = true;
NavigationController.NavigationBar.BarStyle = UIBarStyle.Default;
UIApplication.SharedApplication.StatusBarStyle = UIStatusBarStyle.Default;
}
RectangleF PickerFrameWithSize (SizeF size)
{
var screenRect = UIScreen.MainScreen.ApplicationFrame;
return new RectangleF (0f, screenRect.Height - 84f - size.Height, size.Width, size.Height);
}
void ShowPicker (UIView picker)
{
if (currentPicker != null){
currentPicker.Hidden = true;
label.Text = "";
}
picker.Hidden = false;
currentPicker = picker;
}
#region Hooks from Interface Builder
// [Export ("togglePickers:")]
public void TogglePickers (UISegmentedControl sender)
{
switch (sender.SelectedSegment){
case 0:
pickerStyleSegmentedControl.Hidden = true;
segmentLabel.Hidden = true;
ShowPicker (myPickerView);
break;
case 1:
pickerStyleSegmentedControl.SelectedSegment = 1;
datePickerView.Mode = UIDatePickerMode.Date;
pickerStyleSegmentedControl.Hidden = false;
segmentLabel.Hidden = false;
ShowPicker (datePickerView);
break;
case 2:
pickerStyleSegmentedControl.Hidden = true;
segmentLabel.Hidden = true;
ShowPicker (customPickerView);
break;
}
}
//[Export ("togglePickerStyle:")]
public void TogglePickerStyle (UISegmentedControl sender)
{
switch (sender.SelectedSegment){
case 0: // time
datePickerView.Mode = UIDatePickerMode.Time;
break;
case 1: // date
datePickerView.Mode = UIDatePickerMode.Date;
break;
case 2: // date & time
datePickerView.Mode = UIDatePickerMode.DateAndTime;
break;
case 3: // counter
datePickerView.Mode = UIDatePickerMode.CountDownTimer;
break;
}
datePickerView.Date = NSDate.Now; //DateTime.Now;
Console.WriteLine ("Date is: {0} {1} {2}", NSDate.Now.ToString (), ((NSDate) DateTime.Now).ToString (), DateTime.Now);
}
#endregion
#region Custom picker
public void CreateCustomPicker ()
{
customPickerView = new UIPickerView (RectangleF.Empty) {
AutoresizingMask = UIViewAutoresizing.FlexibleWidth,
Model = new PeopleModel(this),
ShowSelectionIndicator = true,
Hidden = true
};
customPickerView.Frame = PickerFrameWithSize (customPickerView.SizeThatFits (SizeF.Empty));
View.AddSubview (customPickerView);
}
#endregion
#region Date picker
public void CreateDatePicker ()
{
datePickerView = new UIDatePicker (RectangleF.Empty) {
AutoresizingMask = UIViewAutoresizing.FlexibleWidth,
Mode = UIDatePickerMode.Date,
Hidden = false
};
datePickerView.Frame = PickerFrameWithSize (datePickerView.SizeThatFits (SizeF.Empty));
View.AddSubview (datePickerView);
}
#endregion
public void setLabelSet(string doc){
label.Text=doc;
}
#region People picker
void CreatePicker ()
{
//
// Empty is used, since UIPickerViews have auto-sizing,
// all that is required is the origin
//
myPickerView = new UIPickerView (RectangleF.Empty){
AutoresizingMask = UIViewAutoresizing.FlexibleWidth,
ShowSelectionIndicator = true,
Model = new CustomPickerModel(),
Hidden = true
};
// Now update it:
myPickerView.Frame = PickerFrameWithSize (myPickerView.SizeThatFits (SizeF.Empty));
View.AddSubview (myPickerView);
}
添加了三个UIPicker ,一 个基于时间,两个基于View,
一个UILable,一个UIView
UIPickerView myPickerView, customPickerView;
UIDatePicker datePickerView;
UILabel label;
UIView currentPicker;
建picker
CreatePicker ();
CreateDatePicker ();
CreateCustomPicker ();
建一个日期的选择期,这是选择器中最简单的,只要实现在一个接收事件就可以了 ,ValueCanged 事件
datePickerView.Mode = UIDatePickerMode.Date;
datePickerView.ValueChanged+= delegate(object sender, EventArgs e) {
var ctrl=(UIDatePicker)sender;
var dateString=DateTime.Parse(ctrl.Date.ToString()).ToString ("ddd dd MMM yyy h:mm:tt");
label.Text =dateString;
我们看一下CreatePicker()方法
myPickerView = new UIPickerView (RectangleF.Empty){
AutoresizingMask = UIViewAutoresizing.FlexibleWidth,
ShowSelectionIndicator = true,
Model = new CustomPickerModel(), 这里要指定自己实现在的数据源,里面可以文本消息,也可以是图片,也可以是图文结合,这里实现的是图文结合
Hidden = true
};
// Now update it:
myPickerView.Frame = PickerFrameWithSize (myPickerView.SizeThatFits (SizeF.Empty));
View.AddSubview (myPickerView);
再看一下CustomPickerModel 类是怎么实现在给选 择器添加数据
CustomPickerModel类代码 如下
//
// The PickerViewController
//
using MonoTouch.Foundation;
using MonoTouch.UIKit;
using System.Collections.Generic;
using System.Drawing;
public class CustomView : UIView {
const float MAIN_FONT_SIZE = 18.0f;
const float MIN_MAIN_FONT_SIZE = 16.0f;
public CustomView (RectangleF frame) : base (new RectangleF (PointF.Empty, new SizeF (Width, Height))) {
AutoresizingMask = UIViewAutoresizing.FlexibleWidth | UIViewAutoresizing.FlexibleHeight;
BackgroundColor = UIColor.Clear;
}
public override void Draw (RectangleF rect) {
float yCoord = (Bounds.Size.Height - Image.Size.Height) / 2;
PointF point = new PointF (10.0f, yCoord);
Image.Draw (point);
yCoord = (Bounds.Size.Height - MAIN_FONT_SIZE) / 2;
point = new PointF (10.0f + Image.Size.Width + 10.0f, yCoord);
DrawString (Title, point, UIFont.SystemFontOfSize (MAIN_FONT_SIZE) );
}
public string Title { get; set; }
public UIImage Image { get; set; }
public const float Width = 200f;
public const float Height = 44f;
}
public class CustomPickerModel : UIPickerViewModel {
List <CustomView> views;
public CustomPickerModel () : base () {
views = new List <CustomView> ();
var empty = RectangleF.Empty;
views.Add (new CustomView (empty) { Title = "Early Morning", Image = UIImage.FromFile ("12-6AM.png") });
views.Add (new CustomView (empty) { Title = "Late Morning", Image = UIImage.FromFile ("6-12AM.png") });
views.Add (new CustomView (empty) { Title = "Afternoon", Image = UIImage.FromFile ("12-6PM.png") });
views.Add (new CustomView (empty) { Title = "Evening", Image = UIImage.FromFile ("6-12PM.png") });
}
public override float GetComponentWidth (UIPickerView pickerView, int component) {
return CustomView.Width;
}
public override float GetRowHeight (UIPickerView pickerView, int component) {
return CustomView.Height;
}
public override int GetRowsInComponent (UIPickerView pickerView, int component) {
return views.Count;
}
public override int GetComponentCount (UIPickerView pickerView) {
return 1;
}
public override UIView GetView (UIPickerView pickerView, int row, int component, UIView view) {
return views[row];
}
}
这个类要好好解释一下 我们以前写C#代码的思想方法有点不回
CustomPickerModel 一定要是 UIPickerViewModel的子类
实现在下面这几个回调
public CustomPickerModel () : base () 实现在把数据源加添到缓冲里去。
public override float GetComponentWidth 返回选择器行宽的
public override float GetRowHeight 返回回行高
public override int GetRowsInComponent 返回一供有多少条数据
public override int GetComponentCount 返回选择器要显示多少列
public override UIView GetView 返回要在选择器里显示的东西(当然是一行数据)
这里里的数据是自定义 view对像,在CustomView 里我们实现了图文结合显示
view以后详细说,现在不多说了
再看一下CreateCustomPicker 方法
public void CreateCustomPicker ()
{
customPickerView = new UIPickerView (RectangleF.Empty) {
AutoresizingMask = UIViewAutoresizing.FlexibleWidth,
Model = new PeopleModel(this), 这里我们用了另一个自定义类,这里和上面的有点不一样,把this传进去了,是为了,可以调用setLabelSet方法
ShowSelectionIndicator = true,
Hidden = true
};
customPickerView.Frame = PickerFrameWithSize (customPickerView.SizeThatFits (SizeF.Empty));
View.AddSubview (customPickerView);
}
PeopleModel 也一样要为 UIPickerViewModel的子类 先给出代码
using MonoTouch.Foundation;
using MonoTouch.UIKit;
using System.Drawing;
using System;
namespace pickerView
{
public class PeopleModel : UIPickerViewModel {
static string [] names = new string [] {
"Brian Kernighan",
"Dennis Ritchie",
"Ken Thompson",
"Kirk McKusick",
"Rob Pike",
"Dave Presotto",
"Steve Johnson"
};
pickerViewViewController pvc;
public PeopleModel (pickerViewViewController pvc) {
this.pvc = pvc;
}
public override int GetComponentCount (UIPickerView v)
{
return 1;
}
public override int GetRowsInComponent (UIPickerView pickerView, int component)
{
return names.Length;
}
public override string GetTitle (UIPickerView picker, int row, int component)
{
if (component == 0)
return names [row];
else
return row.ToString ();
}
public override void Selected (UIPickerView picker, int row, int component)
{
//pvc.setLabelSet( String.Format ("{0} - {1}",
// names [picker.SelectedRowInComponent (0)],
// picker.SelectedRowInComponent (1)));
pvc.setLabelSet( names [picker.SelectedRowInComponent (0)]);
}
public override float GetComponentWidth (UIPickerView picker, int component)
{
if (component == 0)
return 240f;
else
return 40f;
}
public override float GetRowHeight (UIPickerView picker, int component)
{
return 40f;
}
}
}
这里数据源为string数组
pickerViewViewController pvc; 定义了一个 pickerViewViewController ,这是为了把数据显示到我们的ui上。
public override int GetComponentCount 返回列数
public override int GetRowsInComponent 返回数据条数
public override string GetTitle 返回显示的 数据
public override void Selected 返回行选 中的行
在这个里面 实现在的更新UI
实现在方法为
pvc.setLabelSet( names [picker.SelectedRowInComponent (0)]);
public override float GetComponentWidth (UIPickerView picker, int component) 返回行宽 ,component 为行索引
源代码