iOS开发之使用UIView-Positioning简化页面布局

  使用过代码布局的人可能会有这样的感觉,给控件设置frame的时候比较繁琐。最 近在Github上看到有一个UIView的一个分类UIView-Positioning,这个分类提供了一些属性,比如left、right、 top、bottom、centerX、centerY等,在布局的时候使用这些属性,会更简单和方便,下面介绍下具体使用。

  UIView-Positioning的Github的地 址:https://github.com/freak4pc/UIView-Positioning,将UIView+Positioning.h和 UIView+Positioning.m文件拷贝到工程里面。

  在使用代码布局的时候,我一般习惯按照下面三个步骤去做。

1、声明控件变量。

@implementation LoginView
{
    UILabel *_userNameLabel;
    UITextField *_userNameField;
}

   2、在initWithFrame方法中,创建控件并设置它的一些基本属性,然后添加到View的子视图中。

- (instancetype)initWithFrame:(CGRect)frame
{
    if (self = [super initWithFrame:frame]) {
        _userNameLabel = [UILabel new];
        _userNameLabel.font = [UIFont systemFontOfSize:14.0];
        _userNameLabel.textColor = [UIColor blackColor];
        _userNameLabel.backgroundColor = [UIColor clearColor];
        _userNameLabel.text = @"用户名:";
        [self addSubview:_userNameLabel];

        _userNameField = [UITextField new];
        _userNameField.font = [UIFont systemFontOfSize:14.0];
        _userNameField.textColor = [UIColor blackColor];
        _userNameField.borderStyle = UITextBorderStyleRoundedRect;
        [self addSubview:_userNameField];
    }
    return self;
}

  3、在layoutSubViews方法里面对控件进行布局,下面使用 UIView-Positioning分类的size、left、top、bottom、centerY等属性,通过使用right属性,可以取到左边 Label控件的origin.x+size.width,然后加上一个padding值,就可以得到右边TextField控件的origin.x。平 时我们可能经常会碰到,要将两个不同高度的控件,设置为垂直方向对齐,我这里特意将这两个控件的高度设置得不一样,通过将它们的centerY属性设置为 相等,就可以保持这两个控件在垂直方向对齐了。

- (void)layoutSubviews
{
    [super layoutSubviews];

    CGFloat margin = 50, padding = 5;

    _userNameLabel.size = CGSizeMake(60, 15);
    _userNameLabel.left = margin;
    _userNameLabel.top = margin;

    _userNameField.size = CGSizeMake(200, 30);
    _userNameField.left = _userNameLabel.right + padding;
    _userNameField.centerY = _userNameLabel.centerY;
}

  UIView-Positioning通过扩展了UIView的一些属性,为代码布局还是带来了挺大的方便,推荐大家可以使用一下。

时间: 2024-08-04 06:26:33

iOS开发之使用UIView-Positioning简化页面布局的相关文章

iOS开发之剖析"秘密"App内容页面效果(二)

@前些天写了一篇"秘密"的Cell效果文章,但是与在工作中想要的效果还是有差距,而且扩展性很不好,于是重写封装,把整体视图都放到scrollView中,基本是和secret app 一模一样的效果了. @代码如下:(模糊效果的类就不写了,大家可以搜"UIImage+ImageEffects",还要导入Accelerate.framework) 1.MTSecretAppEffect.h #import <Foundation/Foundation.h>

iOS开发之指定UIView的某几个角为圆角

本文转载至 http://sjh787291806.blog.163.com/blog/static/21396319620131015105856616/ 如果需要将UIView的4个角全部都为圆角,做法相当简单,只需设置其Layer的cornerRadius属性即可(项目需要使用QuartzCore框架).而若要指定某几个角(小于4)为圆角而别的不变时,这种方法就不好用了. 对于这种情况,Stackoverflow上提供了几种解决方案.其中最简单优雅的方案,就是使用UIBezierPath.

iOS开发之剖析&quot;秘密&quot;App内容页面效果

最近在玩"秘密",发现点击主界面的Cell进去后的页面效果不错,就写了个Demo来演示下. 它主要效果:下拉头部视图放大,上拉视图模糊而且到一定位置固定不动,其他Cell可以继续上移. @封装的主要效果类:MTHeadEffect.m(.h文件省略,很简单的) #import "MTHeadEffect.h" #import <QuartzCore/QuartzCore.h> #import <Accelerate/Accelerate.h>

iOS开发实用技巧—项目新特性页面的处理

iOS开发实用技巧篇—项目新特性页面的处理 说明:本文主要说明在项目开发中会涉及到的最最简单的新特性界面(实用UIScrollView展示多张图片的轮播)的处理. 代码示例: 新建一个专门的处理新特性界面的控制器,可以实用代码也可以用xib,在这里实用纯代码方式,创建一个控制器NewfeatureViewController. 头文件代码: 1 // 2 // JMNewfeatureViewController.h 3 // 4 5 #import <UIKit/UIKit.h> 6 7 t

iOS开发之指定UIView的某几个角(小于4)为圆角

在iOS开发中,我们经常会遇到View设置圆角的问题,如果需要将UIView的4个角全部都为圆角,做法相当简单,只需设置其Layer的cornerRadius属性即可(项目需要使用QuartzCore框架).而若要指定某几个角(小于4)为圆角而别的不变时,这种方法就不好用了.如图: 对于后者这种情况,下面给出一种比较简单优雅的方案,就是使用UIBezierPath. 示例代码如下: UIView *testView = [[UIView alloc] initWithFrame:CGRectMa

【iOS开发-14】UIView的属性,父视图和子视图的层级操作,子视图的自适应模式,外加一个定时器

(1)UIView视图frame的设置,四个参数,前2个确定位置,后2个确定大小. (2)UIView的内容模式contentMode,和在UIImage中说的是一样的,而且在UIImage中展示更容易理解. (3)UIView最重要的就是父视图和子视图之间的关系,以及父视图操作子视图(增加一个子视图,把一个子视图放到最下面最上面.交换两个子视图的加载顺序等等) (4)还有一个重要的是,父视图如果发生变化,子视图怎么自动调整布局:先让父视图允许子视图干这个事,即把父视图的属性autoresize

iOS 开发 ZFUI framework控件,使布局更简单

来自:http://www.jianshu.com/p/bcf86b170d9c 前言 为什么会写这个?因为在iOS开发中,界面的布局一直没有Android布局有那么多的方法和优势,我个人开发都是纯代码,Masonry这个框架我在开发中也是不用的,一个是代码布局的时候,代码量比较多,另外好像在iOS10 布局有问题,网上也有些解决的方法了. 所以就想能自定义一些UI控件,使布局更加简单 实现思路 可以像Android的wrap_content一样,是UILabel 可以根据内容来展示控件的宽高

学习android开发之路(一)页面布局

Android页面布局 1.Android页面布局一共分为6种: LinearLayout(线性布局).RelativeLayout(相对布局).TableLayout(表格布局).FrameLayout(帧布局).GridLayout(网格布局).AbsoluteLayout(绝对布局) 常用的为:线性布局和相对布局 2.布局的特点 FrameLayout帧布局 布局特点:放入其中的所有元素都被放置在最左上的区域,而且无法为这些元素指定一个确切的位置,下一个子元素会重叠覆盖上一个子元素 应用场

IOS开发-CALayer和UIView详细汇总

1.    CALayer和UIView之间的关系: 在iOS系统中,你能看得见摸得着的东西基本上都是UIView,比如UI控件.图标等等,都是UIView. 其实UIView之所以能显示在屏幕上,完全是因为它内部的一个层(CALayer). 在创建UIView对象时,UIView内部会自动创建一个层(即CALayer对象),通过UIView的layer属性可以访问这个层.当UIView需要显示到屏幕上时,会调用drawRect:方法进行绘图,并且会将所有内容绘制在自己的层上,绘图完毕后,系统会