简便的自动布局,对UIStackView的个人理解!
序言:
更新了很久的Linux,我怕朋友们都视觉疲劳了,今天就更新在学ios开发时候,对一些知识点的理解。希望各位会喜欢!
正文:
UIStackView 类提供了一个高效的接口用于平铺一行或一列的视图组合,stackView提供了高效的单行单列自动布局的手段,一般情况下,我们不需要对stackView.subviews做任何约束,只需要通过对stackView的axis, distribution, alignment, spacing属性进行修改;
- axis(轴向) 属性决定了 stack 的朝向,只有垂直或水平;
- distribution(分布) 属性决定了其管理的视图在沿着其轴向上的布局;
-
Fill : 铺满 Fill Equal : 等宽铺满 Fill Proportionally : 等比例铺满 Equal Spacing :等距离放置 Equal Centering :各个试图的中心距离保持一致,不够放置则压缩后面的试图距离;
- alignment(对齐) 属性决定了其管理的视图在垂直于其轴向上的布局;
-
Fill : 垂直方向上铺满 Top : 沿顶端对齐 Center : 沿中心线对其 Bottom : 沿底部对齐 First Baseline : 按照第一个子视图的文字的第一行对齐,同时保证高度最大的子视图底部对齐(只在axis为水平方向有效) Last Baseline : 按照最后一个子视图的文字的最后一行对齐,同时保证高度最大的子视图顶部对齐(只在axis为水平方向有效)
- spacing(空隙) 属性决定了其管理的视图间的最小间隙;
- baselineRelativeArrangement 属性决定了其视图间的垂直间隙是否根据基线测量得到,选中 Baseline Relative 将根据subview的基线调整垂直间距;
- layoutMarginsRelativeArrangement 属性决定了 stack 视图平铺其管理的视图时是否要参照它的布局边距,选中 Layout Margins Relative 将相对于标准边界空白来调整subview位置;
UIStackView 实现有对齐要求的视图布局非常非常得简单,而使用 UICollectionView 和 UITableView 来实现,相对而言就比较麻烦,相比于collectionView而言,stackView更加小巧灵活,然而根据过来人的说法,想要完成更精致的效果,最终还是得靠UICollectionView;
- 源代码:
-
1 #import "ViewController.h" 2 3 @interface ViewController () 4 5 @property (weak, nonatomic) IBOutlet UIStackView *VerticalStackView; 6 @property (weak, nonatomic) IBOutlet UIStackView *HorizontalStackView; 7 8 9 @end 10 11 @implementation ViewController 12 13 - (void)viewDidLoad { 14 [super viewDidLoad]; 15 // Do any additional setup after loading the view, typically from a nib. 16 } 17 18 - (void)didReceiveMemoryWarning { 19 [super didReceiveMemoryWarning]; 20 // Dispose of any resources that can be recreated. 21 } 22 23 - (IBAction)addStarBtn:(id)sender { 24 25 UIImageView *starImg = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"star"]]; 26 starImg.contentMode = UIViewContentModeScaleAspectFit; 27 28 [self.HorizontalStackView addArrangedSubview:starImg]; 29 [UIView animateWithDuration:0.25 animations:^{ 30 [self.HorizontalStackView layoutIfNeeded]; 31 }]; 32 33 } 34 35 - (IBAction)reduceStarBtn:(id)sender { 36 37 UIImageView *starImg = self.HorizontalStackView.subviews.lastObject; 38 39 [self.HorizontalStackView removeArrangedSubview:starImg]; 40 [self.HorizontalStackView reloadInputViews]; 41 [UIView animateWithDuration:0.25 animations:^{ 42 [self.view layoutIfNeeded]; 43 [starImg removeFromSuperview]; 44 }]; 45 } 46 47 48 @end
使用环境:
根据GitHub上Most Stars前几名的demo来看,stackView最多就是应用于运行时的界面变化,其自动约束的特性尽显无疑,如下图:
结束总结:
博客园:爱家人爱老婆的IT男
微信公众号:程序猿的野生香蕉【公众号:你可以下载到我的教程,工具,笔记,以及其他我分享的资源,资源今天可能晚点上传,不过我会每天更新。】----附上官方UIstackView :回复 UIstackView-----
博客园:爱家人爱老婆的IT男
QQ群:145252709,我会上传资源,同时会有很多大神跟你们讨论学习分享
微信公众号:程序猿的野生香蕉【获取文章中出现的工具】
分类:
ios
, UIStackView
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· 单线程的Redis速度为什么快?
· SQL Server 2025 AI相关能力初探
· AI编程工具终极对决:字节Trae VS Cursor,谁才是开发者新宠?
· 展开说说关于C#中ORM框架的用法!