美文网首页
子视图的布局(手动、自动)

子视图的布局(手动、自动)

作者: 李琪_59dc | 来源:发表于2017-10-17 11:35 被阅读0次

解决的主要问题:使子视图的位置相对于父视图固定

手动布局子视图

  • 创建视图
  • layoutSubviews
//SuperView.h
#import <UIKit/UIKit.h>
@interface SuperView : UIView{
    UIView *_view01;
    UIView *_view02;
    UIView *_view03;
    UIView *_view04;
    UIView *_view05;
}
-(void)createSubView;
@end
//SuperView.m
#import "SuperView.h"
@implementation SuperView
-(void)createSubView{
    _view01 = [[UIView alloc]init];
    _view01.frame = CGRectMake(0, 0, 40, 40);
    _view01.backgroundColor = [UIColor yellowColor];
    
    _view02 = [[UIView alloc]init];
    _view02.frame = CGRectMake(self.bounds.size.width-40, 0, 40, 40);
    _view02.backgroundColor = [UIColor yellowColor];
    
    _view03 = [[UIView alloc]init];
    _view03.frame = CGRectMake(0,self.bounds.size.height-40, 40, 40);
    _view03.backgroundColor = [UIColor yellowColor];
    
    _view04 = [[UIView alloc]init];
    _view04.frame = CGRectMake(self.bounds.size.width-40, self.bounds.size.height-40, 40, 40);
    _view04.backgroundColor = [UIColor yellowColor];
    
    [self addSubview:_view01];
    [self addSubview:_view02];
    [self addSubview:_view03];
    [self addSubview:_view04];
    
    _view05 = [[UIView alloc]init];
    _view05.frame = CGRectMake(0, self.bounds.size.height/2, self.bounds.size.width, 40);
    _view05.backgroundColor = [UIColor yellowColor];
    
    [self addSubview:_view05];
}

关键方法:

//SuperView.m
//实现手动布局 随视图变化大小
-(void)layoutSubviews{
    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDuration:1];
    _view01.frame = CGRectMake(0, 0, 40, 40);
    _view02.frame = CGRectMake(self.bounds.size.width-40, 0, 40, 40);
    _view03.frame = CGRectMake(0,self.bounds.size.height-40, 40, 40);
    _view04.frame = CGRectMake(self.bounds.size.width-40, self.bounds.size.height-40, 40, 40);
    
    _view05.frame = CGRectMake(0, self.bounds.size.height/2-20, self.bounds.size.width, 40);
    [UIView commitAnimations];
}
@end
  • 点击放大缩小按钮,子视图的位置大小根据父视图的变化而改变
//  ViewController.m
#import "ViewController.h"
#import "SuperView.h"
@interface ViewController ()
@end

@implementation ViewController
- (void)viewDidLoad {
    [super viewDidLoad];

    SuperView *sView = [[SuperView alloc]init];
    sView.frame = CGRectMake(20, 20, 100, 200);
    sView.backgroundColor = [UIColor orangeColor];
    [sView createSubView];
    [self.view addSubview:sView];
    sView.tag = 101;
    
    UIButton *btn = [UIButton buttonWithType:UIButtonTypeRoundedRect];
    btn.frame = CGRectMake(240, 480, 80, 40);
    [btn setTitle:@"放大" forState:UIControlStateNormal];
    [btn addTarget:self action:@selector(pressLarge) forControlEvents:UIControlEventTouchUpInside];
    [self.view addSubview:btn];
    
    UIButton *btn2 = [UIButton buttonWithType:UIButtonTypeRoundedRect];
    btn2.frame = CGRectMake(240, 520, 80, 40);
    [btn2 setTitle:@"缩小" forState:UIControlStateNormal];
    [btn2 addTarget:self action:@selector(pressSmall) forControlEvents:UIControlEventTouchUpInside];
    [self.view addSubview:btn2];
    
}
//放大父亲视图
-(void)pressLarge{
    SuperView *sView = [self.view viewWithTag:101];
    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDuration:1];
    sView.frame = CGRectMake(20, 20, 300, 480);
    [UIView commitAnimations];
}
//缩小父亲视图
-(void)pressSmall{
    SuperView *sView = [self.view viewWithTag:101];
    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDuration:1];
    sView.frame = CGRectMake(20, 20, 100, 200);
    [UIView commitAnimations];
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}
@end

自动布局子视图

  • autoresizingMask关键属性设置
    UIViewAutoresizingFlexibleWidth
    UIViewAutoresizingFlexibleLeftMargin
    UIViewAutoresizingFlexibleTopMargin
//  ViewController.m
#import "ViewController.h"
@interface ViewController ()
@end

@implementation ViewController
- (void)viewDidLoad {
    [super viewDidLoad];

    _view01 = [[UIView alloc]initWithFrame:CGRectMake(0, 0, 180, 300)];
    _view01.backgroundColor = [UIColor blueColor];

    //左上角子视图
    _label1 = [[UILabel alloc]init];
    _label1.frame = CGRectMake(0, 0, 40, 40);
    _label1.text = @"1";
    _label1.backgroundColor= [UIColor orangeColor];

    //右上角子视图
    _label2 = [[UILabel alloc]init];
    _label2.frame = CGRectMake(180-40, 0, 40, 40);
    _label2.text = @"2";
    _label2.backgroundColor = [UIColor orangeColor];

    //左下角子视图
    _label3 = [[UILabel alloc]init];
    _label3.frame = CGRectMake(0, 300-40, 40, 40);
    _label3.text = @"3";
    _label3.backgroundColor = [UIColor orangeColor];

    //右下角子视图
    _label4 = [[UILabel alloc]init];
    _label4.frame = CGRectMake(180-40, 300-40, 40, 40);
    _label4.text = @"4";
    _label4.backgroundColor = [UIColor orangeColor];
    
    [_view01 addSubview:_label1];
    [_view01 addSubview:_label2];
    [_view01 addSubview:_label3];
    [_view01 addSubview:_label4];
    [self.view addSubview:_view01];
    
    _viewCenter = [[UIView alloc]init];
    _viewCenter.frame = CGRectMake(0, 0, 180, 40);
    _viewCenter.center = CGPointMake(180/2, 300/2);
    _viewCenter.backgroundColor = [UIColor yellowColor];
    
    [_view01 addSubview:_viewCenter];
    
    //关键属性设置!!!!!
    //自动布局属性设置,通过此变量来调整视图在俯视图中的位置和大小
    _viewCenter.autoresizingMask = UIViewAutoresizingFlexibleWidth;
    _label2.autoresizingMask = UIViewAutoresizingFlexibleLeftMargin;
    _label3.autoresizingMask = UIViewAutoresizingFlexibleTopMargin;
    _label4.autoresizingMask = UIViewAutoresizingFlexibleTopMargin|UIViewAutoresizingFlexibleLeftMargin;
}
-(void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{
    static BOOL isLarge = NO;
    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDuration:1];
    if(isLarge == NO){
        _view01.frame = CGRectMake(0, 0, 300, 400);
    }
    else{
        _view01.frame = CGRectMake(0, 0, 180, 300);
    }
    [UIView commitAnimations];
    isLarge = !isLarge;
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}
@end

相关文章

  • ios性能优化重编

    手动布局(写宽高)和Autolayout(自动布局)性能的差别主要在子父视图添加到40个子视图的时候,才会显得区别...

  • iOS性能优化

    手动布局(写宽高)和Autolayout(自动布局)性能的差别主要在子父视图添加到40个子视图的时候,才会显得区别...

  • 子视图的布局(手动、自动)

    解决的主要问题:使子视图的位置相对于父视图固定 手动布局子视图 创建视图 layoutSubviews 关键方法:...

  • IOS开发 自动布局子视图

    本节学习内容: 1.自动子视图布局的概念 2.自动布局视图的创建 3.自动布局子视图的实现 【ViewContro...

  • IOS UIStackView

    UIStackView堆叠视图,自动布局平铺不重叠控件。减少手动约束,可以嵌套。 属性: /* 被排列子视图数组*...

  • IOS开发 手动布局子视图

    本节学习内容: 1.子视图布局的概念 2.视图布局的创建实现 3.手动布局视图的实现 1.创建一个父视图 命名为S...

  • 手动和自动布局子视图

    1. 创建一个父视图和多个子视图 新建一个类,叫做SuperView,作为父亲视图类。 在SuperView.h中...

  • AutoLayout原理

    手动布局为什么比自动布局效率要高? 实际上这个问题主要是针对iOS12之前,使用AutoLayout,视图嵌套的数...

  • layoutMargins和preservesSuperview

    文档解释 layoutMargins 使用这个属性用于指定视图和它的子视图之间的边距(单位使用点),自动布局系统使...

  • 自动布局指南-Part 1:入门

    翻译自“Auto Layout Guide”。 1 入门 1.1 理解自动布局 自动布局根据视图层级结构中视图上的...

网友评论

      本文标题:子视图的布局(手动、自动)

      本文链接:https://www.haomeiwen.com/subject/jwaruxtx.html