iOS: 学习笔记, 用代码驱动自动布局实例

iOS自动布局是设置iOS界面的利器.

本实例展示了如何使用自动布局语言设置水平布局, 垂直布局

1. 创建空白iOS项目

2. 添加一个控制器类, 修改YYAppDelegate.m文件

#import "YYAppDelegate.h"

#import "YYViewController.h"



@implementation YYAppDelegate



- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions

{

    self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];

    // Override point for customization after application launch.

    self.window.backgroundColor = [UIColor whiteColor];

    

    self.window.rootViewController = [[YYViewController alloc] initWithNibName:nil bundle:nil];

    

    [self.window makeKeyAndVisible];

    return YES;

}

3. 修改控制器类

  1 //

  2 //  YYViewController.m

  3 //  UIBasic060701_Button

  4 //

  5 //  Created by yao_yu on 14-6-7.

  6 //  Copyright (c) 2014年 yao_yu. All rights reserved.

  7 //

  8 

  9 #import "YYViewController.h"

 10 

 11 @interface YYViewController ()

 12 

 13 @property(nonatomic, strong) UIView *viewMoveBlock;

 14 

 15 @end

 16 

 17 @implementation YYViewController

 18 

 19 - (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil

 20 {

 21     self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];

 22     if (self) {

 23         // Custom initialization

 24     }

 25     return self;

 26 }

 27 

 28 - (void)viewDidLoad

 29 {

 30     [super viewDidLoad];

 31     

 32     self.viewMoveBlock = [[UIView alloc] init];

 33     [self.viewMoveBlock setBackgroundColor:[UIColor blueColor]];

 34     self.viewMoveBlock.frame = CGRectMake(100, 100, 20, 20);

 35     [self.view addSubview: self.viewMoveBlock];

 36     

 37     UIView *commandPane = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 160, 40)];

 38     [self.view addSubview:commandPane];

 39 

 40     const CGFloat BUTTONSIZE = 40;

 41     UIButton *buttonLeft = [UIButton buttonWithType:UIButtonTypeRoundedRect];

 42     [buttonLeft setTitle:@"左移" forState:UIControlStateNormal];

 43     buttonLeft.frame = CGRectMake(0, 0, BUTTONSIZE, BUTTONSIZE);

 44     [commandPane addSubview: buttonLeft];

 45     [buttonLeft addTarget:self action:@selector(moveLeft) forControlEvents:UIControlEventTouchUpInside];

 46     

 47     UIButton *buttonRight = [UIButton buttonWithType:UIButtonTypeRoundedRect];

 48     [buttonRight setTitle:@"右移" forState:UIControlStateNormal];

 49     buttonRight.frame = CGRectMake(BUTTONSIZE, 0, BUTTONSIZE, BUTTONSIZE);

 50     [commandPane addSubview: buttonRight];

 51     [buttonRight addTarget:self action:@selector(moveRight) forControlEvents:UIControlEventTouchUpInside];

 52     

 53     UIButton *buttonUp = [UIButton buttonWithType:UIButtonTypeRoundedRect];

 54     [buttonUp setTitle:@"上移" forState:UIControlStateNormal];

 55     buttonUp.frame = CGRectMake(BUTTONSIZE*2, 0, BUTTONSIZE, BUTTONSIZE);

 56     [commandPane addSubview: buttonUp];

 57     [buttonUp addTarget:self action:@selector(moveUp) forControlEvents:UIControlEventTouchUpInside];

 58     

 59     UIButton *buttonDown = [UIButton buttonWithType:UIButtonTypeRoundedRect];

 60     [buttonDown setTitle:@"下移" forState:UIControlStateNormal];

 61     buttonDown.frame = CGRectMake(BUTTONSIZE*3, 0, BUTTONSIZE, BUTTONSIZE);

 62     [commandPane addSubview: buttonDown];

 63     [buttonDown addTarget:self action:@selector(moveDown) forControlEvents:UIControlEventTouchUpInside];

 64     

 65     UIButton *buttonZoomOut = [UIButton buttonWithType:UIButtonTypeRoundedRect];

 66     [buttonZoomOut setTitle:@"放大" forState:UIControlStateNormal];

 67     buttonZoomOut.frame = CGRectMake(BUTTONSIZE*4, 0, BUTTONSIZE, BUTTONSIZE);

 68     [commandPane addSubview: buttonZoomOut];

 69     [buttonZoomOut addTarget:self action:@selector(zoomOut) forControlEvents:UIControlEventTouchUpInside];

 70     

 71     UIButton *buttonZoomIn = [UIButton buttonWithType:UIButtonTypeRoundedRect];

 72     [buttonZoomIn setTitle:@"缩小" forState:UIControlStateNormal];

 73     buttonZoomIn.frame = CGRectMake(BUTTONSIZE*5, 0, BUTTONSIZE, BUTTONSIZE);

 74     [commandPane addSubview: buttonZoomIn];

 75     [buttonZoomIn addTarget:self action:@selector(zoomIn) forControlEvents:UIControlEventTouchUpInside];

 76     

 77     [commandPane setTranslatesAutoresizingMaskIntoConstraints:NO];

 78     [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"[commandPane(260)]" options:0 metrics:0 views:NSDictionaryOfVariableBindings(commandPane)]];

 79     [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-[commandPane(50)]" options:0 metrics:0 views:NSDictionaryOfVariableBindings(commandPane)]];

 80     [self.view addConstraint:[NSLayoutConstraint constraintWithItem:commandPane attribute:NSLayoutAttributeCenterX relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeCenterX multiplier:1.0f constant:0.0f]];

 81     

 82     NSDictionary *metrics = [NSDictionary dictionaryWithObjectsAndKeys:@40, @"SIZE", nil];

 83     NSDictionary *contraitsView = NSDictionaryOfVariableBindings(buttonLeft, buttonRight, buttonUp, buttonDown, buttonZoomOut, buttonZoomIn);

 84     for (NSString *buttonKey in contraitsView ) {

 85         [contraitsView[buttonKey] setTranslatesAutoresizingMaskIntoConstraints:NO];

 86         [commandPane addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:[NSString stringWithFormat:@"V:|[%@(SIZE)]", buttonKey] options:0 metrics:metrics views:contraitsView]];

 87     }

 88     [commandPane addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[buttonLeft(SIZE)][buttonRight(SIZE)][buttonUp(SIZE)][buttonDown(SIZE)]-(>=0)-[buttonZoomOut(SIZE)][buttonZoomIn(SIZE)]|" options:0 metrics:metrics views: contraitsView]];

 89 }

 90 

 91 -(void)moveLeft

 92 {

 93     [self moveX: -20 Y:0];

 94 }

 95 

 96 -(void)moveRight

 97 {

 98     [self moveX: 20 Y:0];

 99 }

100 

101 -(void)moveUp

102 {

103     [self moveX: 0 Y:-20];

104 }

105 

106 -(void)moveDown

107 {

108     [self moveX: 0 Y:20];

109 }

110 

111 -(void)zoomOut

112 {

113     CGRect rect = self.viewMoveBlock.frame;

114     

115     rect.origin.x -= 20;

116     rect.origin.y -= 20;

117     rect.size.width += 40;

118     rect.size.height += 40;

119     

120     

121     [UIView beginAnimations:nil context:nil];

122     [UIView setAnimationDuration:1.0];

123     

124     self.viewMoveBlock.frame = rect;

125     

126     [UIView commitAnimations];

127 }

128 

129 -(void)zoomIn

130 {

131     CGRect rect = self.viewMoveBlock.frame;

132     

133     rect.origin.x += 20;

134     rect.origin.y += 20;

135     rect.size.width -= 40;

136     rect.size.height -= 40;

137     

138     

139     [UIView beginAnimations:nil context:nil];

140     [UIView setAnimationDuration:1.0];

141     

142     self.viewMoveBlock.frame = rect;

143     

144     [UIView commitAnimations];

145 }

146 

147 -(void)moveX: (int)x Y:(int)y

148 {

149     CGPoint p = self.viewMoveBlock.center;

150     

151     p.x += x;

152     p.y += y;

153     

154     [UIView beginAnimations:nil context:nil];

155     [UIView setAnimationDuration:1.0];

156     

157     self.viewMoveBlock.center = p;

158     

159     [UIView commitAnimations];

160 }

161 

162 - (void)didReceiveMemoryWarning

163 {

164     [super didReceiveMemoryWarning];

165     // Dispose of any resources that can be recreated.

166 }

167 

168 /*

169 #pragma mark - Navigation

170 

171 // In a storyboard-based application, you will often want to do a little preparation before navigation

172 - (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender

173 {

174     // Get the new view controller using [segue destinationViewController].

175     // Pass the selected object to the new view controller.

176 }

177 */

178 

179 @end

4. 运行