- UIScrollView
- UILabel
- UIImage
- SDWebImage
- UITextField
- UITextView
UIScrollView
UITableView和UICollectionView都是继承自UIScrollView,能实现滑动。当然上下滑通常用UITableView和UICollectionView,左右滑就会直接使用UIScrollView。
frame是屏幕属性,view的真实大小用CGSize contentSize表示,用CGPoint contentOffset表示真实大小的view的左上角距离屏幕左上角的偏移量位置。还提供了:
BOOL scrollEnabled:是否允许滚动
BOOL pagingEnabled:是否以屏幕大小进行滚动
BOOL showsHorizontalScrollIndicator,BOOL showsVerticalScrollIndicator:是否展示水平,垂直的滚动条
UIScrollViewDelegate:提供了一系列滚动结束,拖拽结束等生命周期方法
@protocol UIScrollViewDelegate @optional - (void)scrollViewDidScroll:(UIScrollView *)scrollView; - (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView; - (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate; - (void)scrollViewWillBeginDecelerating:(UIScrollView *)scrollView; - (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView; ... @end
例子:
@interface TestViewController ()<UIScrollViewDelegate> @end @implementation TestViewController -(instancetype) init { self = [super init]; if(self) { } return self; } - (void)viewDidLoad { [super viewDidLoad]; self.view.backgroundColor = [UIColor whiteColor]; UIScrollView *scrollView = [[UIScrollView alloc] initWithFrame:self.view.bounds]; // 设置5屏的宽度,高度是屏幕高度 scrollView.contentSize = CGSizeMake(self.view.bounds.size.width * 5, self.view.bounds.size.height); scrollView.delegate = self; NSArray *colorArray = @[[UIColor redColor], [UIColor yellowColor], [UIColor blueColor], [UIColor greenColor], [UIColor purpleColor]]; for(int i = 0; i < 5; i++) { [scrollView addSubview:({ UIView *view = [[UIView alloc] initWithFrame:CGRectMake(scrollView.bounds.size.width * i, 0, scrollView.bounds.size.width, scrollView.bounds.size.height)]; view.backgroundColor = [colorArray objectAtIndex:i]; view; })]; } scrollView.showsHorizontalScrollIndicator = NO; // 不显示水平的滚动条 scrollView.pagingEnabled = YES; // 允许实现翻页,你滚动view到一半时,会自动翻页 [self.view addSubview:scrollView]; } // 滚动,根据 contentOffset 做业务逻辑 - (void)scrollViewDidScroll:(UIScrollView *)scrollView { ... } // 拖拽开始中断一些业务逻辑,如视频/gif播放 - (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView { ... } // 结束拖拽 - (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate { ... } // 开始减速 - (void)scrollViewWillBeginDecelerating:(UIScrollView *)scrollView { ... } // 减速停止时开始的业务逻辑,如视频自动播放 - (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView { ... }
UILabel
UILabel用于文本显示,除了通用的text,font属性外,有几个IOS端特有的属性,例如:
NSInteger numberOfLines:最大展示行数
NSLineBreakMode lineBreakMode:显示不下时的处理,如显示…
sizeToFit:UILabel有两种布局方式,一是指定宽高,二是用sizeToFit根据文字自动调整大小
@property(nonatomic, strong, readwrite) UILabel *titleLabel; self.titleLabel = [[UILabel alloc] initWithFrame:CGRectMake(20, 15, 300, 50)]; self.titleLabel.text = @"我的标题"; self.titleLabel.font = [UIFont systemFontOfSize:16]; self.titleLabel.textColor = [UIColor blackColor]; self.titleLabel.numberOfLines = 2; self.titleLabel.lineBreakMode = NSLineBreakByTruncatingTail; [self.titleLabel sizeToFit]; // 初始化时设的宽度将无效
UIImage
IOS中要显示图片,需要将各种图片先转成UIImage对象,然后通过UIImageView来展示这个UIImage对象。常用的方法:
(nullable UIImage *)imageNamed:(NSString *)name;:会将本地文件夹里的图片转为UIImage对象
UIViewContentMode提供了图片和UIImageView的尺寸不符时,图片的填充方式。
@property(nonatomic, strong, readwrite) UIImageView *rightImageView; self.rightImageView = [[UIImageView alloc] initWithFrame:CGRectMake(330, 15, 70, 70)]; self.rightImageView.image = [UIImage imageNamed:@"icon.bundle/timg.jpeg"]; self.rightImageView.contentMode = UIViewContentModeScaleAspectFit;
UIImageView除了展示图片外,也提供了将静图转成动图的属性和方法:
NSArray *animationImages:可以将一组静图合成动图
NSTimeInterval animationDuration:动图播放的时间
(void)startAnimating:开始播放动图
SDWebImage
实际开发中,更多的是网络图片,而不是上面这样的本地图片。除了网络请求耗时外,下载下来的图片还需要解码和裁剪,还需要要保存到磁盘里,之后系统会先从内存中读取是否存在图片,没有就从磁盘中读取,避免访问相同图片时再次请求网络。下载时可以有占位图优化体验,下载完后替换掉占位图。
总之处理图片细节很多,可以使用开源库SDWebImage,用CocoaPod集成下就能使用。
#import "SDWebImage.h" [self.rightImageView sd_setImageWithURL:[NSURL URLWithString:item.picUrl] completed:^(UIImage * _Nullable image, NSError * _Nullable error, SDImageCacheType cacheType, NSURL * _Nullable imageURL) { NSLog(@""); }];
UITextField
UITextField用于一行文本输入,由leftView,text,rightView三部分组成,所以可以实现搜索框(左边放大镜,中间文字,右边X按钮)。
一些开始编辑,结束编辑的回调用UITextFieldDelegate来获取,键盘的弹出和收起用UIResponder来实现,
#import "MySearchBar.h" @interface MySearchBar ()<UITextFieldDelegate> @property(nonatomic, strong, readwrite) UITextField *textField; @end @implementation MySearchBar - (instancetype)initWithFrame:(CGRect)frame{ self = [super initWithFrame:frame]; if (self) { [self addSubview:({ _textField = [[UITextField alloc] initWithFrame:CGRectMake(10, 5, frame.size.width - 10 * 2, frame.size.height - 5 * 2)]; _textField.backgroundColor = [UIColor whiteColor]; _textField.delegate = self; _textField.leftView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"icon.bundle/search@2x.png"]]; _textField.leftViewMode = UITextFieldViewModeAlways; // 一直展示 _textField.clearButtonMode = UITextFieldViewModeAlways; _textField.placeholder = @"请输入搜索内容"; _textField; })]; } return self; } // 开始编辑 - (void)textFieldDidBeginEditing:(UITextField *)textField { NSLog(@""); } // 结束编辑 - (void)textFieldDidEndEditing:(UITextField *)textField { NSLog(@""); } // 编辑时 - (BOOL)textField:(UITextField *)textField shouldChangeCharactersInRange:(NSRange)range replacementString:(NSString *)string { // 字数判断 return YES; } // 回车键 - (BOOL)textFieldShouldReturn:(UITextField *)textField { [_textField resignFirstResponder]; // 收起键盘 return YES; } @end
在UITextField中编辑文本时系统会自动弹出键盘,如果你在其他场景下想手动唤起键盘可以:
[_xxxView becomeFirstResponder]; // 唤起键盘 [_xxxView resignFirstResponder]; // 收起键盘
UITextView
UITextView用于多行文本输入,相比UITextField,少了leftView和rightView,但多了支持竖向滚动。用法基本同UITextField,不赘述。