当前位置: 移动技术网 > 移动技术>移动开发>IOS > iOS开发之手动布局子视图

iOS开发之手动布局子视图

2019年07月24日  | 移动技术网移动技术  | 我要评论

手动布局子视图;
下面先看下效果图,我们今天要实现的效果:


这里我们默认用storyboard启动:
首先我们要在白色的屏幕上面创建一个父视图superview(蓝色的背景),在父视图里面创建四个小视图(橘黄色的背景)
下面看代码,
在superview.h文件里面:

#import <uikit/uikit.h>

@interface superview : uiview{

 uiview * _view01;
 uiview * _view02;
 uiview * _view03;
 uiview * _view04;

}

//声明创建视图函数
-(void) createsubviews;

@end

在superview.m文件里面:


#import "superview.h"

@interface superview ()

@end

@implementation superview

-(void) createsubviews{

 //左上角视图
 _view01 = [[uiview alloc] init];
 _view01.frame=cgrectmake(0, 0, 40, 40);

 //右上角视图
 _view02 = [[uiview alloc] init];
 _view02.frame=cgrectmake(self.bounds.size.width-40, 0, 40, 40);

 //右下角视图
 _view03 = [[uiview alloc] init];
 _view03.frame=cgrectmake(self.bounds.size.width-40, self.bounds.size.height-40, 40, 40);

 //左下角视图
 _view04 = [[uiview alloc] init];
 _view04.frame=cgrectmake(0, self.bounds.size.height-40, 40, 40);

 _view01.backgroundcolor=[uicolor orangecolor];
 _view02.backgroundcolor=[uicolor orangecolor];
 _view03.backgroundcolor=[uicolor orangecolor];
 _view04.backgroundcolor=[uicolor orangecolor];

 [self addsubview:_view01];
 [self addsubview:_view02];
 [self addsubview:_view03];
 [self addsubview:_view04];

}

//当需要重新布局时调用此函数
//通过此函数重新设定子视图的位置
//手动调整子视图的位置
-(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(self.bounds.size.width-40, self.bounds.size.height-40, 40, 40);
 _view04.frame=cgrectmake(0, self.bounds.size.height-40, 40, 40);

 [uiview commitanimations];

}


@end

在viewcontroller.m文件里面:

#import "viewcontroller.h"
#import "superview.h"

@interface viewcontroller ()

@end

@implementation viewcontroller

- (void)viewdidload {
 [super viewdidload];
 // do any additional setup after loading the view, typically from a nib.

 //创建一个父视图
 superview * sview = [[superview alloc]init];
 sview.frame = cgrectmake(20, 20, 180, 280);

 //父视图调用函数创建四个小视图
 [sview createsubviews];

 sview.backgroundcolor = [uicolor bluecolor];
 [self.view addsubview:sview];

 uibutton * btn01 = [uibutton buttonwithtype:uibuttontyperoundedrect];
 btn01.frame = cgrectmake(240, 480, 80, 40);
 [btn01 settitle:@"放大" forstate:uicontrolstatenormal];
 [btn01 addtarget:self action:@selector(presslarge) forcontrolevents:uicontroleventtouchupinside];
 [self.view addsubview:btn01];

 uibutton * btn02 = [uibutton buttonwithtype:uibuttontyperoundedrect];
 btn02.frame = cgrectmake(240, 520, 80, 40);
 [btn02 settitle:@"缩小" forstate:uicontrolstatenormal];
 [btn02 addtarget:self action:@selector(presssmall) forcontrolevents:uicontroleventtouchupinside];
 [self.view addsubview:btn02];

 sview.tag = 101;


}

//放大父视图
-(void) presslarge{
 superview * sview = (superview*)[self.view viewwithtag:101];
 [uiview beginanimations:nil context:nil];
 [uiview setanimationduration:1];
 sview.frame=cgrectmake(20, 20, 280, 400);
 [uiview commitanimations];

}

//缩小父视图

-(void) presssmall{
 superview * sview = (superview*)[self.view viewwithtag:101];
 [uiview beginanimations:nil context:nil];
 [uiview setanimationduration:1];
 sview.frame=cgrectmake(20, 20, 180, 280);
 [uiview commitanimations];
}


- (void)didreceivememorywarning {
 [super didreceivememorywarning];
 // dispose of any resources that can be recreated.
}

@end

 以上代码书写完毕,就达到了上面视图的效果,希望对大家的学习有所帮助,也希望大家多多支持移动技术网。

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
移动技术网