当前位置：移动技术网 > IT编程>移动开发>IOS > iOS三级联动选择器的实现代码示例

iOS三级联动选择器的实现代码示例

2019年07月24日 | 移动技术网IT编程 | 我要评论

罗烈葬礼,非主流颓废签名,小鸡吃米

无聊ing...封装个省市区三级联动选择器的小demo吧。

上家公司的三级地区选择器的数据是一次性通过网络请求就能获取到的，但新东家这边并不是，而是先选择了省获取省的id再去获取市，再通过得到市的id获取区域，show code之前，先看下需要考虑的几个点：

1）怎么设置默认值，关键代码

[self.pickerview selectrow:xxx incomponent:xxx animated:yes];

2）怎么让三级之间联动 ,关键代码

复制代码代码如下:

[self pickerview:self.pickerview didselectrow:0 incomponent:0 ];//联动轮子1  必须得本轮有数据后触发否则crash

先看下效果图

关于设置默认值，三级联动，用uipickview的话就是有3个轮子（component），首先我们要想到，第一次向后台发起请求，我们只能获取到第0个component的数据，只有当你滚动轮子的时候才会获取到省的id发起请求来获得该省的市的数据，也就是第1个component的数据，依此类推，滚动第1个component发起请求来获取第2个component的数据，因此，pickview的监听轮子滚动的代理起了重要作用

复制代码代码如下:

- (void)pickerview:(uipickerview *)pickerview didselectrow:(nsinteger)row incomponent:(nsinteger)component；

我们通过接口获取第0个component的数据，这边是后台规定的使用id=0，获取到以后，默认选中第0个component的第0个row并主动调用触发pick的轮子滚动代理来联动第1个component【要在获取数据成功后再执行这部操作,因此放在数据请求成功的回调内】，代码为

 [self pickerview:self.pickerview didselectrow:0 incomponent:0 ];

在各轮子滚动过程中,用一个中间值

_selectedrow0记录下第0个component的选中行

_selectedrow1记录下第1个component的选中行

_selectedrow2记录下第2个component的选中行，

这里需要记住，滚动某个轮子只能对它后面的轮子产生影响，所以当滚动第0个component的时候使_selectedrow1，_selectedrow2均置为0，这里注意，上面提到的

默认选中第0个component的第0个row并主动调用触发pick的轮子滚动代理来联动第1个component

要先将轮子上的数据渲染好，设置好默认值才能主动调用监听轮子滚动的代理，否则会导致崩溃，另一个防崩溃的点如下图

发现第三级没数据的时候，如果你在代码里没加【安全措施】，那也会导致崩溃，要在请求到第三级的数据后做下判断，如果个数为空，将该级对应的数据源置为nil。（其它两级的轮子最好也加判断）

最后，由于这是个封装的类，最终要得到选中的详细信息，可通过代理或block传值给controller。

又是你们最喜欢show code环节：

.h文件

#import <uikit/uikit.h>

//定制代理协议
@protocol zlmaddresspickerviewdelegate <nsobject>

- (void)addresspickerviewdidselected:(nsstring *)areaname;//点击上方完成按钮的代理传回拼接好的选中地址

- (void)addresspickerviewdidclose;//点击关闭代理

@end

@interface zlmaddresspickerview : uiview

@property (weak, nonatomic) id<zlmaddresspickerviewdelegate> delegate;

@end

.m文件

#import "zlmaddresspickerview.h"
#import "afhttputils.h"
#import "areamodel.h"
@interface zlmaddresspickerview () <uipickerviewdatasource, uipickerviewdelegate>
@property (strong, nonatomic) uipickerview *pickerview;
@property (strong, nonatomic) areamodel  *provbridge;
@property (strong, nonatomic) areamodel  *citybridge;
@property (strong, nonatomic) areamodel  *areabridge;
@property (copy, nonatomic) nsarray<area *> * provdataarr;//省数组
@property (copy, nonatomic) nsarray<area *> * citydataarr;//市数组
@property (copy, nonatomic) nsarray<area *> * areadataarr;//区数组
@end

@implementation zlmaddresspickerview
{
  nsinteger _selectrow0;//记录第0个轮子的选择行
  nsinteger _selectrow1;
  nsinteger _selectrow2;
  nsstring *_areastring;//最后要传回的详细地址拼接字符串
  area *_promodel;//记录下选中省的数据
  area *_citymodel;
  area *_areamodel;

}

- (instancetype)initwithframe:(cgrect)frame
{
  self = [super initwithframe:frame];
  if (self) {
    [self setup];
  }
  return self;
}

- (void)setup {
 
  _selectrow0 = 0;
  _selectrow1 = 0;
  _selectrow2 = 0;

  self.backgroundcolor  = [uicolor whitecolor];
  uitoolbar *toolbar   = [[uitoolbar alloc] initwithframe:cgrectmake(0, 0, cgrectgetwidth(self.bounds), 44)];
  toolbar.backgroundcolor = [uicolor whitecolor];
  [self addsubview:toolbar];
  
  uibarbuttonitem *closeitem   = [[uibarbuttonitem alloc] initwithtitle:@"关闭" style:uibarbuttonitemstyleplain target:self action:@selector(selectaddressclose)];
  uibarbuttonitem *completeitem  = [[uibarbuttonitem alloc] initwithtitle:@"完成" style:uibarbuttonitemstyleplain target:self action:@selector(selectaddresscomplete)];
  uibarbuttonitem *spaceitem   = [[uibarbuttonitem alloc] initwithbarbuttonsystemitem:uibarbuttonsystemitemflexiblespace target:nil action:nil];
  toolbar.items                     = @[closeitem, spaceitem, completeitem];
  
  self.pickerview.frame = cgrectmake(0, 44, cgrectgetwidth(self.bounds), cgrectgetheight(self.bounds) - 44);

  [self addsubview:self.pickerview];
  
  [self downloadprov];
  
}

#pragma mark - http methods

/*省*/
- (void)downloadprov {
  
  nsmutabledictionary *dic = [nsmutabledictionary dictionarywithdictionary: @{@"id":@(0)} ];
  
  [afhttputils sendposttaskwithurl:[nsstring stringwithformat:@"%@/app/member/area",base_domain_url] paramenters:dic successhandle:^(nsurlsessiondatatask *task, id responseobject) {
    
     nslog(@"prov:%@",responseobject);
    
    self.provbridge = [areamodel mj_objectwithkeyvalues:responseobject];
    
    if (self.provbridge.error_code==0) {
      
      self.provdataarr=self.provbridge.data;
      
       [self pickerview:self.pickerview didselectrow:0 incomponent:0 ];//联动轮子1 必须得本轮有数据后才能触发didselect
      
      [self.pickerview reloadallcomponents];
  
    }
  } errorhandle:^(nserror *error) {
    
  }];

}
/*市*/
- (void)downloadcitywithid:(nsinteger)provid {
  
  nsmutabledictionary *dic = [nsmutabledictionary dictionarywithdictionary: @{@"id":@(provid)} ];
  
  [afhttputils sendposttaskwithurl:[nsstring stringwithformat:@"%@/app/member/area",base_domain_url] paramenters:dic successhandle:^(nsurlsessiondatatask *task, id responseobject) {
    
    nslog(@"city:%@",responseobject);
    
    self.citybridge = [areamodel mj_objectwithkeyvalues:responseobject];
  
    if (self.citybridge.error_code==0) {
      
      self.citydataarr=self.citybridge.data;
      
      [self.pickerview reloadcomponent:1];
      
      [self.pickerview selectrow:0 incomponent:1 animated:yes];//默认选择row0
      
      [self pickerview:self.pickerview didselectrow:0 incomponent:1 ];//联动轮子2 必须得本轮有数据后才能触发didselect
      
      _citymodel = self.citydataarr[_selectrow1];
      
      [self downloadareawithid:_citymodel.area_id];
      
    }
  } errorhandle:^(nserror *error) {
    
  }];
  
}
/*区*/
- (void)downloadareawithid:(nsinteger)cityid {
  
  nsmutabledictionary *dic = [nsmutabledictionary dictionarywithdictionary: @{@"id":@(cityid)} ];
  
  [afhttputils sendposttaskwithurl:[nsstring stringwithformat:@"%@/app/member/area",base_domain_url] paramenters:dic successhandle:^(nsurlsessiondatatask *task, id responseobject) {
    
    nslog(@"area:%@",responseobject);
    
    self.areabridge = [areamodel mj_objectwithkeyvalues:responseobject];
    
    if (self.areabridge.error_code==0&&self.areabridge.data.count>0) {
      
      self.areadataarr=self.areabridge.data;
      
    }else{
      
      self.areadataarr=nil;
      
    }
    [self.pickerview reloadcomponent:2];
    
    [self.pickerview selectrow:0 incomponent:2 animated:yes];
    
    [self pickerview:self.pickerview didselectrow:0 incomponent:2 ];
  
  } errorhandle:^(nserror *error) {
    
  }];
  
}
#pragma mark - events response
- (void)selectaddresscomplete {
  [self.delegate addresspickerviewdidselected:_areastring];
}

- (void)selectaddressclose {
  [self.delegate addresspickerviewdidclose];
}

#pragma mark - uipickerviewdatasource

//确定picker的轮子个数
- (nsinteger)numberofcomponentsinpickerview:(uipickerview *)pickerview {
  
  return 3;
}

//确定picker的每个轮子的item数
- (nsinteger)pickerview:(uipickerview *)pickerview numberofrowsincomponent:(nsinteger)component {
  if (component==0) {
     return self.provdataarr.count;
    
  }else if(component==1){
    return self.citydataarr.count;
    
  }else{
    return self.areadataarr.count;
    
  }
}
- (cgfloat)pickerview:(uipickerview *)pickerview rowheightforcomponent:(nsinteger)component{
  return 36;
}

//确定每个轮子的每一项显示什么内容
- (nsattributedstring *)pickerview:(uipickerview *)pickerview attributedtitleforrow:(nsinteger)row forcomponent:(nsinteger)component{
  
  nsdictionary * attrdic = @{nsforegroundcolorattributename:[uicolor blackcolor],
                nsfontattributename:[uifont systemfontofsize:12]};
  area *area;
  if (component==0) {
    area = self.provdataarr[row];
    
  }else if(component==1){
    area = self.citydataarr[row];
    
  }else{
    area = self.areadataarr[row];
   
  }
   nsattributedstring * attrstring = [[nsattributedstring alloc] initwithstring:area.name
                         attributes:attrdic];
  return attrstring;
}

//监听轮子的移动
- (void)pickerview:(uipickerview *)pickerview didselectrow:(nsinteger)row incomponent:(nsinteger)component {
  
  if (component==0) {
    
    _selectrow0 = [pickerview selectedrowincomponent:0];
    
    _selectrow1 = 0;
    
    _selectrow2 = 0;
    
    _promodel  = self.provdataarr[_selectrow0];
    
    [self downloadcitywithid:_promodel.area_id];
      
  }else if(component==1){
    
    _selectrow1 = [pickerview  selectedrowincomponent:1];
    
    _selectrow2 = 0;
    
    _citymodel = self.citydataarr[_selectrow1];
    
     [self downloadareawithid:_citymodel.area_id];
    
  }else{
    
    _selectrow2 = [pickerview selectedrowincomponent:2];

    if (self.areadataarr&&self.areadataarr.count>0) {

       _areamodel = self.areadataarr[_selectrow2];
    }else{
      _areamodel = nil;
    }
  }
   if(_areamodel==nil){
    _areastring = [nsstring stringwithformat:@"%@ %@",_promodel.name,_citymodel.name];
   }else{
   _areastring = [nsstring stringwithformat:@"%@ %@ %@",_promodel.name,_citymodel.name,_areamodel.name];
   }
}

#pragma mark - getters and setters
- (uipickerview *)pickerview {
  if (_pickerview == nil) {
    _pickerview = [[uipickerview alloc] init];
    _pickerview.delegate  = self;
    _pickerview.datasource = self;
    
  }
  return _pickerview;
}

@end

最后在controller中调用

（1）导入

#import "zlmaddresspickerview.h"

（2）定义一个对象并遵守代理协议

@property (strong, nonatomic) zlmaddresspickerview *addresspickerview;

(3)懒加载生成对象（个人习惯）

- (zlmaddresspickerview *)addresspickerview {
  if (!_addresspickerview) {
    _addresspickerview     = [[zlmaddresspickerview alloc] initwithframe:cgrectmake(0, screen_height-244-64, screen_width, 244)];
    _addresspickerview.delegate = self;
  }
  return _addresspickerview;
}

（4）在点击跳出三级联动选择器的地方

 [self.view addsubview:self.addresspickerview];

(5)别忘了实现代理

#pragma mark - zlmaddresspickerviewdelegate

- (void)addresspickerviewdidselected:(nsstring *)areaname {

  self.arealabel.text = areaname;//将传回的详细地址字符串赋值

  [self addresspickerviewdidclose];
}

- (void)addresspickerviewdidclose {

  [self.addresspickerview removefromsuperview];
}

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持移动技术网。

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！点击进行留言回复

iOS实现H5支付(微信、支付宝)原生封装

前言支付分app支付、h5支付、扫码支付等。app支付一般在app中使用，并且需要集成相应的支付sdk，h5支付多用于网页。如果你的app不想集成支付sdk,又... [阅读全文]
iOS APP实现微信H5支付示例总结

微信h5支付流程1、发起下单请求（调用统一下单接口）注：交易类型trade_type=mweb2、统一下单接口返回支付相关参数给商户后台，如支付跳转url（参数... [阅读全文]
iOS实现图片自动切换效果

本文实例为大家分享了ios实现图片自动切换的具体代码，供大家参考，具体内容如下#import "viewcontroller.h"#define imagevi... [阅读全文]
iOS新版微信底部工具栏遮挡问题完美解决

一、问题描述：苹果设备（ios）微信中打开h5页面，从首页跳转到其他页面后，页面的底部会出现一个带有前进和后退按钮工具栏，而该工具栏会遮挡住面底部的内容，影响页... [阅读全文]
iOS新版微信底部返回横条问题的解决

之前没有怎么接触过微信开发，只是对h5比较熟。最近维护一个微信公众号的项目，遇到了ios端返回键的坑。描述一下：从公众号打开页面后，底部有个返回的小横条，恰好也... [阅读全文]
ios中getTime()的兼容性实例代码

时间格式为：2017-12-12 12:00:00在苹果上获取时间戳有兼容性问题需要转换成2017/12/12 12:00:00 才可以正确获取到时间戳 l... [阅读全文]
iOS 使用UITextField自定义搜索框实现用户输入完之后“实时搜索”功能

注：csdn的代码块有点捞，如果浏览器窗口较窄，一行代码占了两行的位置，后面的代码就看不到了，大家可以把浏览器窗口拉大一点ui小姐姐设计的搜索框经常是五花八门，... [阅读全文]
IOS 屏幕适配方案实现缩放window的示例代码

背景：公司有个ipad项目（只支持横屏），是11年开发的，那时的ipad只有1024x768的分辨率，所以没有屏幕适配的问题，frame都是写死的。后来不同尺寸... [阅读全文]
iOS UICollectionView实现标签选择器

近来，在项目中需要实现一个类似兴趣标签的选择器。由于标签的文字长度不定，所以标签的显示长度就不定。为了实现效果，就使用了uicollectionview来实现了... [阅读全文]
SwiftUI如何仿写微信APP的首页列表视图

最近在学习 SwiftUI ，我一般都是先去学习界面布局，所以就想着仿写一下经常使用的软件的界面，所以先拿微信开刀。因为不想一次性发太多的内容，所以只好... [阅读全文]

网友评论


验证码：

iOS三级联动选择器的实现代码示例

2019年07月24日 | 移动技术网IT编程 | 我要评论

您可能感兴趣的文章:

相关文章:

网友评论