iOS:选择器控件UIPickerView的详解和演示

选择器控件UIPickerView:

功能：它能够创建一个类似于密码锁式的单列或多列的选择菜单，用户可以通过它设置的代理来选择需要菜单中的任意的数据。例如创建日历、字体表(类型、大小、颜色)、图库等.

它是UIView视图的子类，而且遵从UIPickerViewDelegate协议和UIPickerViewDataSource协议。因此，选择器需要设置代理去进行操作;

设置视图控制器self为数据源代理和数据操作代理,即

@property(strong,nonatomic)UIPickerView *pickerView;

self.pickerView.dataSource = self;

self.pickerView.delegate = self;

一、具体类信息：

@protocol UIPickerViewDataSource, UIPickerViewDelegate;

@interface UIPickerView : UIView <NSCoding>

@property(nonatomic,assign) id<UIPickerViewDataSource> dataSource; // default is nil,设置代理

@property(nonatomic,assign) id<UIPickerViewDelegate> delegate; // default is nil，设置代理

@property(nonatomic) BOOL showsSelectionIndicator; // default is NO

@property(nonatomic,readonly) NSInteger numberOfComponents; //列数

二、协议UIPickerViewDataSource

@protocol UIPickerViewDataSource<NSObject>

@required //必须要实现的方法

// 返回的列显示的数量。

- (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView;

//返回行数在每个组件(每一列)

- (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component;

@end

三、协议UIPickerViewDelegate

@protocol UIPickerViewDelegate<NSObject>

@optional //可以选择执行的方法

//每一列组件的列宽度

- (CGFloat)pickerView:(UIPickerView *)pickerView widthForComponent:(NSInteger)component;

//每一列组件的行高度

- (CGFloat)pickerView:(UIPickerView *)pickerView rowHeightForComponent:(NSInteger)component;

// 返回每一列组件的每一行的标题内容

- (NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component;

// 返回每一列组件的每一行的标题内容的属性

- (NSAttributedString *)pickerView:(UIPickerView *)pickerView attributedTitleForRow:(NSInteger)row forComponent:(NSInteger)component;

// 返回每一列组件的每一行的视图显示

- (UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)component reusingView:(UIView *)view;

//执行选择某列某行的操作

- (void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component;

@end

演示一：制作简单的万年历,一开始就显示当前日期

源码如下：

 #import <UIKit/UIKit.h>

 @interface ViewController : UIViewController<UIPickerViewDataSource,UIPickerViewDelegate>

 @property(nonatomic,strong)NSArray *years;

 @property(nonatomic,strong)NSArray *months;

 @property(nonatomic,strong)NSArray *days;

 @end

#import "ViewController.h"

   @interface ViewController ()

   @property (weak, nonatomic) IBOutlet UIPickerView *pickerView;

   @end

   @implementation ViewController

  - (void)viewDidLoad

  {

      [super viewDidLoad];

      //初始化数据

      NSMutableArray *multYears = [NSMutableArray array];//年

      for(int i=; i<; i++)

      {

          NSString *year = [NSString stringWithFormat:@"20%02d年",i+];

          [multYears addObject:year];

      }

      self.years = multYears;

      NSMutableArray *multMonths = [NSMutableArray arrayWithCapacity:];//月

      for(int i=; i<=; i++)

      {

          NSString *month = [NSString stringWithFormat:@"%d月",i];

          [multMonths addObject:month];

      }

      self.months = multMonths;

      NSMutableArray *multDays = [NSMutableArray arrayWithCapacity:];//日

      for(int i=; i<=; i++)

      {

          NSString *day = [NSString stringWithFormat:@"%d日",i];

          [multDays addObject:day];

      }

      self.days = multDays;

      //设置pickerView的数据源和代理

      self.pickerView.dataSource = self;

      self.pickerView.delegate = self;

      //显示当前日期

      NSDate *now = [NSDate date];

      //分解日期

      NSCalendar  *calendar = [[NSCalendar alloc]initWithCalendarIdentifier:NSCalendarIdentifierGregorian];

      NSCalendarUnit unitFlags = NSCalendarUnitYear|NSCalendarUnitMonth|NSCalendarUnitDay;

      NSDateComponents *components = [calendar components:unitFlags fromDate:now];

      //设置pickerView显示当前日期

      NSInteger year = [components year];

      [self.pickerView selectRow:year-- inComponent: animated:year];

      NSInteger month = [components month];

      [self.pickerView selectRow:month- inComponent: animated:month];

      NSInteger day = [components day];

      [self.pickerView selectRow:day- inComponent: animated:day];

  }

  #pragma mark - pickerView的代理方法

  -(NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView

  {

      return ;

  }

  -(NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component

  {

      NSInteger row = ;

      switch (component)

      {

          case :

              row = self.years.count;

              break;

          case :

              row = self.months.count;

              break;

          case :

              row = self.days.count;

              break;

      }

      return  row;

  }

  -(NSString*)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component

  {

      NSString *title;

      switch (component)

      {

          case :

              title = self.years[row];

              break;

          case :

              title = self.months[row];

              break;

          case :

              title = self.days[row];

              break;

     }

     return  title;

 }

 -(void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component

 {

     NSString *strDate = [NSString stringWithFormat:@"%@-%@-%@",

                          self.years[[pickerView selectedRowInComponent:]],

                          self.months[[pickerView selectedRowInComponent:]],

                          self.days[[pickerView selectedRowInComponent:]]];

     NSLog(@"%@",strDate);

 }

 @end

演示二：制作简单的字体表,包括字体类型、大小、颜色

源码如下：

 #import <UIKit/UIKit.h>

 @interface ViewController : UIViewController<UIPickerViewDataSource,UIPickerViewDelegate>

 @property(nonatomic,strong) NSArray *fontNames;

 @property(nonatomic,strong) NSArray *fontSizes;

 @property(nonatomic,strong) NSArray *fontColors;

 @end

 #import "ViewController.h"

   @interface ViewController ()

   @property (weak, nonatomic) IBOutlet UILabel *label;

   @property (weak, nonatomic) IBOutlet UIPickerView *pickerView;

   @end

  @implementation ViewController

  - (void)viewDidLoad {

      [super viewDidLoad];

      //初始化数据

      self.fontNames = [UIFont familyNames];//字体名字

      NSMutableArray *mutsize = [NSMutableArray arrayWithCapacity:];//字体大小

      for(int i=; i<=; i++)

      {

          [mutsize addObject:[NSString stringWithFormat:@"%d",+i]];

      }

      self.fontSizes = mutsize;

      self.fontColors = @[

                          @{@"name":@"红色",@"color":[UIColor redColor]},

                          @{@"name":@"黑色",@"color":[UIColor blackColor]},

                          @{@"name":@"蓝色",@"color":[UIColor blueColor]},

                          @{@"name":@"黄色",@"color":[UIColor yellowColor]},

                          @{@"name":@"绿色",@"color":[UIColor greenColor]}

                         ];

      //设置pickerView的代理和数据源

      self.pickerView.dataSource = self;

      self.pickerView.delegate = self;

      //设置label的font

      self.label.font = [UIFont fontWithName:self.fontNames[] size:[self.fontSizes[] integerValue]];

      self.label.textColor = [self.fontColors[] objectForKey:@"color"];

  }

  #pragma mark - pickerView的代理方法

  -(NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView

  {

      return  ;

  }

  -(NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component

  {

      NSInteger row = ;

      switch (component)

      {

          case :

              row = self.fontNames.count;

              break;

          case :

              row = self.fontSizes.count;

              break;

          case :

              row = self.fontColors.count;

              break;

      }

      return row;

  }

  -(NSString*)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component

  {

      NSString *title;

      switch (component)

      {

          case :

              title = self.fontNames[row];

              break;

          case :

              title = self.fontSizes[row];

              break;

          case :

              title = [self.fontColors[row] objectForKey:@"name"];

              break;

      }

      return  title;

  }

  //设置每一列的宽度

  -(CGFloat)pickerView:(UIPickerView *)pickerView widthForComponent:(NSInteger)component

  {

      CGFloat width = 0.0f;

      switch (component)

      {

          case :

              width = pickerView.frame.size.width/;

              break;

          case :

              width = pickerView.frame.size.width/;

              break;

          case :

              width = pickerView.frame.size.width/;

              break;

      }

      return width;

  }

  -(void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component

 {

     //设置label的font

     self.label.font = [UIFont fontWithName:self.fontNames[[pickerView selectedRowInComponent:]] size:[self.fontSizes[[pickerView selectedRowInComponent:]] integerValue]];

     self.label.textColor = [self.fontColors[[pickerView selectedRowInComponent:]] objectForKey:@"color"];

 }

 @end

演示三：制作简单的图库浏览器

源码如下：

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController<UIPickerViewDelegate,UIPickerViewDataSource>

@end

#import "ViewController.h"

  @interface ViewController ()

  @property (weak, nonatomic) IBOutlet UIPickerView *pickerView;

  @property (strong,nonatomic)NSArray *imageNames;

  @end

  @implementation ViewController

 - (void)viewDidLoad {

     [super viewDidLoad];

     //初始化数据

     NSMutableArray *mutImageNames = [NSMutableArray arrayWithCapacity:];

     for(int i=; i<; i++)

     {

         [mutImageNames addObject:[NSString stringWithFormat:@"%d.png",i]];

     }

     self.imageNames = mutImageNames;

     //设置pickerView的数据源和代理

     self.pickerView.dataSource = self;

     self.pickerView.delegate = self;

 }

 #pragma mark - pickerview代理方法

 -(NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView

 {

     return ;

 }

 -(NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component

 {

     return self.imageNames.count;

 }

 //设置行高

 -(CGFloat)pickerView:(UIPickerView *)pickerView rowHeightForComponent:(NSInteger)component

 {

     UIImage *image = [UIImage imageNamed:self.imageNames[]];

     return image.size.height;

 }

 //设置每行显示的视图

 -(UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)component reusingView:(UIView *)view

 {

     UIImage *image = [UIImage imageNamed:self.imageNames[row]];

     //UIImageView *imageView = [[UIImageView alloc]initWithImage:image];

     //imageView.frame = CGRectMake(0, 0, image.size.width, image.size.height);

     //return imageView;

     UIButton *button = [[UIButton alloc]initWithFrame:CGRectMake(, ,image.size.width, image.size.height)];

     [button setBackgroundImage:image forState:UIControlStateNormal];

     [button addTarget:self action:@selector(buttonClicked:) forControlEvents:UIControlEventTouchUpInside];

     return button;

 }

 -(void)buttonClicked:(UIButton *)sender

 {

     NSLog(@"button clicked");

 }

 @end

巴特西

iOS:选择器控件UIPickerView的详解和演示

最新文章

热门文章