iOS UI自适应布局(小记)

来源:互联网 发布:mac怎么更新阿里旺旺 编辑:程序博客网 时间:2024/06/13 03:43

简介

随着iOS设备尺寸的增多,屏幕的样式增多。在复杂界面布局时,为了达到设计师的设计效果,通常得根据屏幕尺寸调整界面的位置、长宽尺寸。这时,就需要考虑使用自适应布局了。
最近在项目实践中,遇到几种自适应布局的场景,作为小记。

下面的几种函数,仅供此情形:

有text内容的视图要根据内容来改变大小

使用,符合此博客倡导的自适应布局的体验注意事项。

一 使用sizeToFit函数

考虑这样一种情况:有一个显示文案的UILabel(labelA),在其右侧20像素再绘制一个UIImageView(imageB)。
鉴于文案长度不固定,需要根据文案长短调整其宽度,这时候可以先使用sizeToFit函数得到合适的宽度,再根据labelA的右侧位置,调整imageB的左侧坐标:

[labelA sizeToFit];CGFloat rightPos = labelA.frame.origin.x + labelA.frame.size.width;CGRect frameOfImageB = imageB.frame;frameOfImageB.origin.x = rightPos + 20;imageB.frame = frameOfImageB;

二 使用sizeThatFits先得到合适尺寸后再调整布局

有时需要限制UI元素的最大宽度或高度,这时可以使用sizeThatFits:函数先得到适应限制尺寸sizeLimit的尺寸值fitSize,如果fitSize超过了sizeLimit,再调整。
比如不超过sizeLimit的宽度:

CGSize fitSize = [labelA sizeThatFits:sizeLimit];CGRect frameOfLabelA = labelA.frame;if (fitSize.width > sizeLimit.width) {    CGSize resizedSize = CGSizeMake(sizeLimit.width, fitSize.height);    frameOfLabelA.size = resizedSize;} else {    frameOfLabelA.size = fitSize;}labelA.frame = frameOfLabelA;

三 根据尺寸先得到合适的字体大小

在限制宽度的情况下,我们还可以通过调整字体大小来做到自适应,使用的API如下:

// These methods will behave identically to the above single line methods if the string will fit in the specified width in the specified font.// If not, the font size will be reduced until either the string fits or the minimum font size is reached.  If the minimum font// size is reached and the string still won't fit, the string will be truncated and drawn at the minimum font size.// The first two methods are used together, and the actualFontSize returned in the sizeWithFont method should be passed to the drawAtPoint method.// The last method will do the sizing calculation and drawing in one operation.- (CGSize)sizeWithFont:(UIFont *)font minFontSize:(CGFloat)minFontSize actualFontSize:(CGFloat *)actualFontSize forWidth:(CGFloat)width lineBreakMode:(NSLineBreakMode)lineBreakMode 

其中的actualFontSize调整之后的字体大小。它将调整字体直到最小的minFontSize值来显示字符串值;若达到了最小的minFontSize值,仍然不能显示全,字符串将被截断。

小结

此文阐述:

如果算上横屏和竖屏的话,你会发现我们现在要处理 12种不同的屏幕尺寸

因此UI自适应布局,在如今的众多屏幕尺寸选择上,还是值得探讨的一个技术点。本文小节了几个API方法,供参考。有不对之处,欢迎拍砖。