如何使用自动布局

时间:2015-07-24 05:07:06

标签: ios objective-c

嗨我是初学者在ios和我的项目中我在UIScrollview上添加了一些字段但字段在这里不合适我创建scrollview和字段我想在scrollview上添加两者都以编程方式使用自动布局创建但是scrollview是不是滚动和字段没有正确添加请帮助我一些

根据我的代码我得到结果第二个屏幕,但我想得到像第一个屏幕的结果请帮我一个

这是我的代码

- (void)viewDidLoad {
    [super viewDidLoad];


    scrollview = [[UIScrollView alloc]init];
    [self.view setBackgroundColor:[UIColor darkGrayColor]];
    scrollview.translatesAutoresizingMaskIntoConstraints = NO;
    [scrollview setBackgroundColor:[UIColor colorWithRed:74.0/255.0 green:166.0/255.0 blue:224.0/255.0 alpha:1]];
    [self.view addSubview:scrollview];

    textFiedl1 = [[UITextField alloc]init];
    textFiedl1.backgroundColor = [UIColor blueColor];
    textFiedl1.translatesAutoresizingMaskIntoConstraints = NO;
    [scrollview addSubview:textFiedl1];

    textField2 = [[UITextField alloc]init];
    textField2.backgroundColor = [UIColor blueColor];
    textField2.translatesAutoresizingMaskIntoConstraints = NO;
    [scrollview addSubview:textField2];


    NSDictionary * views = NSDictionaryOfVariableBindings(scrollview,textFiedl1,textField2);


    NSArray *horizontalConstraints =[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-10-[scrollview]-10-|"
                                                                            options:0
                                                                            metrics:nil
                                                                              views:views];

    NSArray *verticalConstraints = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-20-[scrollview(280)]-|"
                                                                           options:0
                                                                           metrics:nil
                                                                             views:views];



    NSArray * textFieldConstraint1H = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-10-[textFiedl1]-10-|"
                                                                              options:0
                                                                              metrics:nil
                                                                                views:views];

    NSArray * textFieldConstraint2H = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-10-[textField2]-10-|"
                                                                              options:0
                                                                              metrics:nil
                                                                                views:views];


    NSArray * textFieldConstraintV = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-20-[textFiedl1(30)]-30-[textField2(30)]"
                                                                             options:0
                                                                             metrics:nil
                                                                               views:views];

    [self.view addConstraints:horizontalConstraints];
    [self.view addConstraints:verticalConstraints];
    [scrollview addConstraints:textFieldConstraint1H];
    [scrollview addConstraints:textFieldConstraint2H];
    [scrollview addConstraints:textFieldConstraintV];

    //set content size
    [scrollview setContentSize:CGSizeMake(100, 700)];
}

但是我希望获得第一次屏幕截图的结果(还有一件事滚动视图不滚动,即使我设置了contentoffset(100X700)

enter image description here

enter image description here

2 个答案:

答案 0 :(得分:0)

您可以将滚动视图中的容器视图添加到活动的scrollview。另外,控制器约束scrollview的子视图会更容易

UIView *containerView = [[UIView alloc] init];
containerView.backgroundColor = [UIColor yellowColor]; // just so I can see it
containerView.translatesAutoresizingMaskIntoConstraints = NO;
[scrollview addSubview:containerView];
NSDictionary * views = NSDictionaryOfVariableBindings(scrollview,textFiedl1,textField2,view,containerView);


NSArray *horizontalConstraints =[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-10-[scrollview]-10-|"
                                                                        options:0
                                                                        metrics:nil
                                                                          views:views];

NSArray *verticalConstraints = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-20-[scrollview(280)]-|"
                                                                       options:0
                                                                       metrics:nil
                                                                         views:views];

// set the container to the size of the main view, and simultaneously
// set the scrollview's contentSize to match the size of the container

[view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[containerView(==scrollview)]|"
                                                             options:0
                                                             metrics:nil
                                                               views:views]];

[view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-20-[containerView(==view)]|"
                                                             options:0
                                                             metrics:nil
                                                               views:views]];



NSArray * textFieldConstraint1H = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-10-[textFiedl1]-10-|"
                                                                          options:0
                                                                          metrics:nil
                                                                            views:views];

NSArray * textFieldConstraint2H = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-10-[textField2]-10-|"
                                                                          options:0
                                                                          metrics:nil
                                                                            views:views];


NSArray * textFieldConstraintV = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-20-[textFiedl1(30)]-30-[textField2(30)]"
                                                                         options:0
                                                                         metrics:nil
                                                                           views:views];

[view addConstraints:horizontalConstraints];
[view addConstraints:verticalConstraints];
[containerView addConstraints:textFieldConstraint1H];
[containerView addConstraints:textFieldConstraint2H];
[containerView addConstraints:textFieldConstraintV];

//setting content size now no longer needed in autolayout.
//[scrollview setContentSize:CGSizeMake(100, 700)];

答案 1 :(得分:0)

您的约束存在一些问题。修改如下,滚动视图将滚动,文本字段将具有固定宽度(请在代码中检查注释):

UIScrollView *scrollview = [[UIScrollView alloc]init];
[self.view setBackgroundColor:[UIColor darkGrayColor]];
scrollview.translatesAutoresizingMaskIntoConstraints = NO;
[scrollview setBackgroundColor:[UIColor colorWithRed:74.0/255.0 green:166.0/255.0 blue:224.0/255.0 alpha:1]];
[self.view addSubview:scrollview];

UITextField *textFiedl1 = [[UITextField alloc]init];
textFiedl1.backgroundColor = [UIColor blueColor];
textFiedl1.translatesAutoresizingMaskIntoConstraints = NO;
[scrollview addSubview:textFiedl1];

UITextField *textField2 = [[UITextField alloc]init];
textField2.backgroundColor = [UIColor blueColor];
textField2.translatesAutoresizingMaskIntoConstraints = NO;
[scrollview addSubview:textField2];


NSDictionary * views = NSDictionaryOfVariableBindings(scrollview,textFiedl1,textField2);


NSArray *horizontalConstraints =[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-10-[scrollview]-10-|"
                                                                        options:0
                                                                        metrics:nil
                                                                          views:views];

NSArray *verticalConstraints = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-20-[scrollview(280)]"
                                                                       options:0
                                                                       metrics:nil
                                                                         views:views];



// you must provide the autolayout system some hint about the width
// of the content of the scrollView.
// Here we set a fixed width to textField.
NSArray * textFieldConstraint1H = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-10-[textFiedl1(100)]-10-|"
                                                                          options:0
                                                                          metrics:nil
                                                                            views:views];

NSArray * textFieldConstraint2H = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-10-[textField2]-10-|"
                                                                          options:0
                                                                          metrics:nil
                                                                            views:views];


// In order for the scrollView to scroll, you must setup
// vertical constraints such that the height of scrollView's content height can be determined
// Here we add a constraints to set textField2 bottom to scrollView bottom(200).
NSArray * textFieldConstraintV = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-20-[textFiedl1(30)]-30-[textField2(30)]-200-|"
                                                                         options:0
                                                                         metrics:nil
                                                                           views:views];

[self.view addConstraints:horizontalConstraints];
[self.view addConstraints:verticalConstraints];
[scrollview addConstraints:textFieldConstraint1H];
[scrollview addConstraints:textFieldConstraint2H];
[scrollview addConstraints:textFieldConstraintV];

//set content size
[scrollview setContentSize:CGSizeMake(100, 700)];

但是,如果你想在textfield和scrollview之间添加一些填充,如图中所述,我认为你不能用视觉格式约束来做到这一点。您可以使用简单约束描述here

此外,您可以使用Masonry库,它提供了更简单的语法来以编程方式设置约束。