使用带有自动布局的滚动条

Question

我正在使用autolayout。因为我只能将constraints 添加到view，但在大多数情况下我必须使用滚动条。因此，如果我使用 CGRectmake 方法在scrollView 上添加view。那么它不会在横向模式下改变尺寸。

纵向模式快照：

横向模式下的快照：

代码：

    UIScrollView *scrllView=[UIScrollView new];
    [scrllView setTranslatesAutoresizingMaskIntoConstraints:NO];

    [self.view addSubview:scrllView];
    [self.view addConstraint:[NSLayoutConstraint constraintWithItem:scrllView attribute:NSLayoutAttributeTrailing relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeTrailing multiplier:1.0 constant:0]];

    [self.view addConstraint:[NSLayoutConstraint constraintWithItem:scrllView attribute:NSLayoutAttributeLeading relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeLeading multiplier:1.0 constant:0]];


    [self.view addConstraint:[NSLayoutConstraint constraintWithItem:scrllView attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeTop multiplier:1.0 constant:0]];

    [self.view addConstraint:[NSLayoutConstraint constraintWithItem:scrllView attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeBottom multiplier:1 constant:0]];


    [scrllView setContentSize:CGSizeMake(self.view.frame.size.width, 1000)];


    UIView *SBV=[UIView new];
   [SBV setFrame:CGRectMake(0, 0, self.view.frame.size.width,1000)];
   [SBV setTranslatesAutoresizingMaskIntoConstraints:YES];
   [SBV setBackgroundColor:[UIColor redColor]];
   [scrllView addSubview:SBV];

    UIButton *BTN=[UIButton new];

    [BTN setTranslatesAutoresizingMaskIntoConstraints:NO];

    [BTN setTitle:@"UPSide" forState:UIControlStateNormal];

    [BTN setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];

    [SBV addSubview:BTN];


    [SBV addConstraint:[NSLayoutConstraint constraintWithItem:BTN attribute:NSLayoutAttributeTrailing relatedBy:NSLayoutRelationEqual toItem:SBV attribute:NSLayoutAttributeLeading multiplier:1.0 constant:100]];

    [SBV addConstraint:[NSLayoutConstraint constraintWithItem:BTN attribute:NSLayoutAttributeLeading relatedBy:NSLayoutRelationEqual toItem:SBV attribute:NSLayoutAttributeLeading multiplier:1.0 constant:0]];


    [SBV addConstraint:[NSLayoutConstraint constraintWithItem:BTN attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:SBV attribute:NSLayoutAttributeTop multiplier:1.0 constant:0]];

    [SBV addConstraint:[NSLayoutConstraint constraintWithItem:BTN attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:nil attribute:NSLayoutAttributeNotAnAttribute multiplier:0 constant:100]];


    UIButton *BTN1=[UIButton new];
    [BTN1 setTranslatesAutoresizingMaskIntoConstraints:NO];
    [BTN1 setTitle:@"DOWNSide" forState:UIControlStateNormal];
    [BTN1 setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
    [SBV addSubview:BTN1];


    [SBV addConstraint:[NSLayoutConstraint constraintWithItem:BTN1 attribute:NSLayoutAttributeTrailing relatedBy:NSLayoutRelationEqual toItem:SBV attribute:NSLayoutAttributeLeading multiplier:1.0 constant:100]];

    [SBV addConstraint:[NSLayoutConstraint constraintWithItem:BTN1 attribute:NSLayoutAttributeLeading relatedBy:NSLayoutRelationEqual toItem:SBV attribute:NSLayoutAttributeLeading multiplier:1.0 constant:0]];


    [SBV addConstraint:[NSLayoutConstraint constraintWithItem:BTN1 attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:SBV attribute:NSLayoutAttributeBottom multiplier:1.0 constant:0]];

    [SBV addConstraint:[NSLayoutConstraint constraintWithItem:BTN1 attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:nil attribute:NSLayoutAttributeNotAnAttribute multiplier:0 constant:100]];

如何创建应在横向和纵向模式下工作的视图？

Answer 1

1. 禁用大小类以使用自动布局。（来自视图控制器文件检查器的界面生成器文档）
2. 在 ViewController 的视图中获取一个滚动视图。在其中获取一个视图。
3. 现在选择 scrollView 并从底部栏 [Pin] 中选择第二个选项。然后选择所有四个约束（Leading、Top、Bottom、Trailing）并取消选中 constarint Margin Button。添加 4 个约束。
4. 现在选择 View 并从底部栏 [Pin] 中选择第二个选项，然后选择所有四个约束（Leading、Top、Bottom、Trailing）并取消选中 constarint Margin 按钮。也选择高度约束（如果高度> 568，而不是设置底部约束 0）。现在添加 5 个约束。并从底部栏[对齐]中选择第一个选项。然后选择容器中的倒数第二个选项水平中心并添加1个约束。