【iOS控件】—— UIPickerView的使用

news/2024/12/29 19:11:32/

【iOS控件】—— UIPickerView的使用

  • 一. 简述UIPickerView
    • 1. 什么是UIPickerView
    • 2. UIPickerView遵守的协议
  • 二. 测试Demo
  • 三. 总结

一. 简述UIPickerView

先看一下UIPickerView的效果图:
在这里插入图片描述
在这里插入图片描述

1. 什么是UIPickerView

UIPickerView是iOS平台上的一个用户界面元素,用于在应用程序中显示和选择多个选项中的一个。它通常以类似于滚轮的形式呈现,允许用户通过滑动手势来选择列表中的项目,UIPickerView由一个或多个组件(Component)组成,每个组件都表示一个独立的选项列表。每个组件可以包含多个行(Row),每一行代表一个具体的选项。用户可以通过滑动每个组件的滚轮来选择特定的行。

2. UIPickerView遵守的协议

UIPickerView需要遵守两个基础的协议。

#import <UIKit/UIKit.h>@interface ViewController : UIViewController
<UIPickerViewDelegate, UIPickerViewDataSource>@end

UIPickerViewDataSource:
此协议中有两个必须实现的方法
分别是设置选择器的行和列数。

//表示有几列
- (NSInteger) numberOfComponentsInPickerView:(UIPickerView *)pickerView {return 3;}//每一列中有几个格子
- (NSInteger) pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component {if (component == 0) {return self.directionArray.count;} else if (component == 1) {return self.curentNameArray.count;} else {return 1;}
}

UIPickerViewDeleagate:
有以下方法:

//返回UIPickerView中Component列的宽度- (CGFloat)pickerView:(UIPickerView *)pickerView widthForComponent:(NSInteger)component;//返回UIPickerView中Component列中每行的高度- (CGFloat)pickerView:(UIPickerView *)pickerView rowHeightForComponent:(NSInteger)component;//当选择某一项Component列中的row行时的回调函数- (void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component//标准的UIPickerView内容,只有字符串- (NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component;//自定义的UIPickerView内容,给每个列,行设置一个UIView对象- (UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)component reusingView:(UIView *)view;//这里列为component,行row返回一个UIView用来显示在UIPickerView中。reusingView:(UIView *)

刷新数据的方法:

- (void)reloadAllComponents;
- (void)reloadComponent:(NSInteger)component;

二. 测试Demo

以上都是一些基础的概念性的东西,接下来通过一个Demo来实现一下上面的功能。
首先要先定义一个UIPickerView的视图然后进行初始化。

@interface ViewController ()@property (nonatomic, copy) NSArray* directionArray;
@property (nonatomic, copy) NSArray* curentNameArray;
@property (nonatomic, copy) NSArray* nameArray1;
@property (nonatomic, copy) NSArray* nameArray2;
@property (nonatomic, copy) NSArray* nameArray3;
@property (nonatomic, copy) NSArray* nameArray4;
@property (nonatomic, copy) NSArray* nameArray5;
@property (nonatomic, copy) NSArray* nameArray6;@property (nonatomic, copy) NSArray* Dict;
@property (nonatomic, copy) NSArray* endArray;
@property (nonatomic, copy) NSString* currentEndString;@property (nonatomic, strong) UIPickerView* pickerView;@end

然后对这些数组进行初始化,并且初始化UIPickerView。

[self loadDate];self.pickerView = [[UIPickerView alloc] initWithFrame:CGRectMake(0, 200, [UIScreen mainScreen].bounds.size.width, 200)];self.pickerView.delegate = self;self.pickerView.dataSource = self;[self.view addSubview:self.pickerView];- (void) loadDate {self.directionArray = @[@"陕西", @"山西", @"重庆", @"河南", @"湖北", @"四川"];self.nameArray1 = @[@"西安", @"榆林", @"咸阳", @"宝鸡", @"延安", @"渭南"];self.nameArray2 = @[@"太原", @"长治", @"吕梁", @"晋城", @"运城", @"临汾"];self.nameArray3 = @[@"重庆", @"涪陵", @"万州", @"永州", @"江津", @"长寿"];self.nameArray4 = @[@"郑州", @"洛阳", @"南阳", @"许昌", @"周口", @"新乡"];self.nameArray5 = @[@"武汉", @"襄阳", @"宜昌", @"荆州", @"荆门", @"黄石"];self.nameArray6 = @[@"成都", @"绵阳", @"南充", @"宜宾", @"泸州", @"达州"];self.endArray = @[@"秦", @"晋", @"巴", @"韩", @"楚", @"蜀"];self.Dict = @[self.nameArray1, self.nameArray2, self.nameArray3, self.nameArray4, self.nameArray5, self.nameArray6];self.curentNameArray = self.Dict[0];self.currentEndString = self.endArray[0];}

然后实现必须的方法以及你需要的方法:

//表示有几列
- (NSInteger) numberOfComponentsInPickerView:(UIPickerView *)pickerView {return 3;}//每一列中有几个格子
- (NSInteger) pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component {if (component == 0) {return self.directionArray.count;} else if (component == 1) {return self.curentNameArray.count;} else {return 1;}
}// 滑动触发事件
- (void) pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component {// 使用一个UIAlertView来显示用户选中的列表项if (component == 0) {self.curentNameArray = self.Dict[row];self.currentEndString = self.endArray[row];[self.pickerView reloadComponent:1];[self.pickerView reloadComponent:2];//这个方法的selectRow即可以表示你更新第一个列表之后是否更新到第二个列表的对应的row// BOOL类型的YES表示动画效果[self.pickerView selectRow:0 inComponent:1 animated:YES];[self.pickerView selectRow:0 inComponent:2 animated:YES];NSLog(@"选择了%@方向",self.directionArray[row]);} else {NSLog(@"%@", self.curentNameArray[row]);}}// 返回列表的内容
- (NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component {if (component == 0) {return self.directionArray[row];} else if (component == 1){return  self.curentNameArray[row];} else {return  self.currentEndString;}
}
// 返回列表的宽度
- (CGFloat)pickerView:(UIPickerView *)pickerView widthForComponent:(NSInteger)component {return 130;}

三. 总结

UIPickerView使用滚轮形式展示选项,用户可以通过滑动手势来选择,这种交互方式直观且易于使用,可以显示多个选项,但只占用有限的屏幕空间,适用于在有限的界面空间中提供大量选项选择的情况。但是仍然有缺点,由于UIPickerView一次只显示有限数量的选项,对于包含大量选项的情况,可能会导致用户需要频繁滚动和选择,不太方便。


http://www.ppmy.cn/news/1255445.html

相关文章

电脑连不上wifi,适配器Intel(R)WiFi6 AX201 160MHz遇到与驱动程序或硬件相关问题,连不上wifi,电脑WiFi图标没了

电脑WiFi图标没了&#xff0c;电脑连不上wifi 适配器IntelWiFi6 AX201 160MHz遇到与驱动程序或硬件相关问题应该怎么解决&#xff1f; 方法一&#xff1a;电脑冷重启即可 就是长按那个开机键&#xff0c;然后滑动关机&#xff0c;&#xff0c;&#xff0c;重启&#xff08;我…

自恋的领导

自恋的领导》&#xff1f;&#xff1f;&#xff1f; 在职场中&#xff0c;我曾经遇到过一位自恋狂的领导。他总是自吹自擂&#xff0c;自我标榜&#xff0c;而且对团队合作态度消极&#xff0c;经常拖后腿。他的言行举止充满了负能量&#xff0c;让人感到非常不舒服。例如&…

‘str‘ object has no attribute ‘decode‘:问题解决办法

‘str’ object has no attribute ‘decode’ 一般是因为decode方法不匹配导致的 由于此方法是开源文件编写的&#xff0c;我们无法直接将其修改 所以可以使用一些暴力的方法&#xff0c;比如卸载重装 首先使用命令 pip uninstall h5py然后安装版本比较低的h5py pip instal…

二叉树k层的叶子结点个数

文章目录 1 题目2 思路2.1 思路12.2 思路2 3 代码实现3.1 思路13.2 思路23.3 完整的代码案例 1 题目 假设二叉树采用二叉链表存储结构&#xff0c;设计一个算法求其指定的第k层&#xff08;k>1&#xff0c;跟是第1层&#xff09;的叶子结点个数。 2 思路 2.1 思路1 设置…

分享一个国内可用的免费AI-GPT网站

背景 ChatGPT作为一种基于人工智能技术的自然语言处理工具&#xff0c;近期的热度直接沸腾&#x1f30b;。 我们也忍不住做了一个基于ChatGPT的网站&#xff0c;可以免登陆&#xff01;&#xff01;国内可直接对话AI&#xff0c;也有各种提供工作效率的工具供大家使用。 可以这…

【计算机视觉】基于OpenCV计算机视觉的摄像头测距技术设计与实现

基于计算机视觉的摄像头测距技术 文章目录 基于计算机视觉的摄像头测距技术导读引入技术实现原理技术实现细节Python-opencv实现方案获取目标轮廓步骤 1&#xff1a;图像处理步骤 2&#xff1a;找到轮廓步骤完整代码 计算图像距离前置技术背景与原理步骤 1&#xff1a;定义距离…

如何查看JDK动态代理自动生成的类

JDK提供了一种强大且灵活的机制,可以在运行时生成代理类。这种动态生成的代理类可以在不修改原始类的情况下,对其方法进行拦截和增强。然而,对于初学者来说,了解生成的代理类的内部结构和工作原理可能会很有帮助。 本文将介绍如何查看JDK动态代理生成的代理类。我们将探索一…

行为型剩余的模式

1.中介者模式 package com.jmj.pattern.mediator;public abstract class Mediator {public abstract void constact(String message,Person person); }package com.jmj.pattern.mediator;public class MediatorStructure extends Mediator{private HouseOwner houseOwner;priva…