iOS两个视图恰好覆盖了父视图的一半

时间:2013-05-27 09:11:34

标签: ios layout view constraints

在我的应用中,我希望实现此布局:

enter image description here

因此父视图包含两个子视图。第一个恰好在中间(高度/ 2)结束,第二个在父视图的中间开始。我发现在受限制的IB中不可能做到这一点。所以我在viewDidLoad方法中使用了这段代码:

NSLayoutConstraint *constraint = [NSLayoutConstraint constraintWithItem:firstView
                                                              attribute:NSLayoutAttributeHeight
                                                              relatedBy:0
                                                                 toItem:self.view
                                                              attribute:NSLayoutAttributeHeight
                                                             multiplier:0.5
                                                               constant:0];

[self.view addConstraint:constraint];

现在它可以工作,但前提是应用程序在iPhone上运行。因为视图的大小就像iPhone屏幕。如果此应用程序在iPad上运行,则会出现问题,因为屏幕大小不同,因此此父视图更长。并且约束(上面的代码)仍然需要从IB的视图大小的0.5 *大小,而不是从视图的iPad大小的大小。项目toItem:self.view仍然需要IB的大小。

结果是该视图在iPad中的大小与iPhone中的大小相同。在iPad上有一个很大的空白区域,然后有一个iPhone大小的视图。

你能告诉我要做些什么来使它适用于各种屏幕尺寸吗?非常感谢你

6 个答案:

答案 0 :(得分:5)

这可能是使用约束,但是由于IB相当恼人且不灵活的约束管理器,它有点繁琐。以下是我管理它的方式:

  • 在IB中,使用正确的帧设置两个视图
  • 在两个视图之间添加相等的高度约束
  • 降低任一视图上任何默认高度限制的优先级。不幸的是,IB不允许你完全删除它们,但是将它们设置为小于1000的任何值将确保它们被忽略。
  • 在视图控制器viewDidLoad方法中,添加您已尝试过的约束。

例如

- (void)viewDidLoad
{
    [super viewDidLoad];

    NSLayoutConstraint *constraint = [NSLayoutConstraint constraintWithItem:self.topView
                                                                  attribute:NSLayoutAttributeHeight
                                                                  relatedBy:NSLayoutRelationEqual
                                                                     toItem:self.view
                                                                  attribute:NSLayoutAttributeHeight
                                                                 multiplier:0.5
                                                                   constant:0];
    [self.view addConstraint:constraint];
}

多数民众赞成。 IB约束的屏幕截图如下所示:

Top View Constraints Bottom View Constraints

答案 1 :(得分:2)

试试这段代码。它将动态设置约束值

在你的.h文件中,实现这一行。

  #define IS_IPAD (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad)
  #define IS_IPHONE_5 ( fabs( ( double )[ [ UIScreen mainScreen ] bounds ].size.height - ( double )568 ) < DBL_EPSILON )

@property (weak, nonatomic) IBOutlet NSLayoutConstraint *TopsubviewheightConstraint;

现在根据给定的屏幕截图创建此约束

for iphone

for ipad

从屏幕

连接TopsubviewheightConstraint高度约束

for iphone

for ipad

在.m文件中实现此代码

if (IS_IPHONE_5) 
    _TopSuperViewConstraint.constant = 275;
else if(IS_IPAD)
    _TopSuperViewConstraint.constant = 502;
else
    _TopSuperViewConstraint.constant = 230;

我希望它会对你有所帮助。

答案 2 :(得分:1)

你有两个选择。

  1. 为iPad创建第二个IB文件
  2. 通过programm执行所有操作并使用[[UIScreen mainScreen] bound];而不是获取父级的大小;)
  3. 我会在没有约束的情况下完成它并设置如下:

    // self.view is my container view
    
    CGRect frame = [[UIScreen mainScreen] bound];
    frame.size.height /= 2;    
    
    // upper View
    upperView.frame = frame;
    
    // lower View
    frame.origin.y = frame.size.height;
    // or alternatively
    //frame.origin.y = CGRectGetMaxY(frame);
    lowerView.frame = frame;
    

    这里您不需要任何特定于设备的选项,一切都是动态的,绑定到设备屏幕的大小;)

答案 3 :(得分:1)

好的,所以我只知道如何做到这一点。只需将代码放入viewDidLayoutSubviews方法,而不是viewDidLoad。我在主题Unable to set frame correctly before viewDidAppear中找到的解决方案。

这是我的代码:

[subView1 setFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height / 2)];
[subView2 setFrame:CGRectMake(0, self.view.frame.size.height / 2, self.view.frame.size.width, self.view.frame.size.height / 2)];

感谢所有的努力!

答案 4 :(得分:1)

感谢Tark的回答,我也设法使用约束:

  1. 将TobView的垂直空间约束添加到Top Layout Guide(使用StoryBoard)
  2. 将BottomView的垂直空间约束添加到Bottom Layout Guide(使用StoryBoard)
  3. 为ViewDidLoad
  4. 中的每个视图添加两个高度限制

    代码:

    NSLayoutConstraint *constraint;
    constraint = [NSLayoutConstraint constraintWithItem:_viewTop
                                              attribute:NSLayoutAttributeHeight
                                              relatedBy:NSLayoutRelationEqual
                                                 toItem:self.view
                                              attribute:NSLayoutAttributeHeight
                                             multiplier:0.5
                                               constant:0];
    
    
    [self.view addConstraint:constraint];
    constraint = [NSLayoutConstraint constraintWithItem:_viewBottom
                                              attribute:NSLayoutAttributeHeight
                                              relatedBy:NSLayoutRelationEqual
                                                 toItem:self.view
                                              attribute:NSLayoutAttributeHeight
                                             multiplier:0.5
                                               constant:0];
    [self.view addConstraint:constraint];
    

答案 5 :(得分:0)

您可以使用约束(不需要代码!)

1.--首先创建两个UIview,然后将其高度手动设置为当前设备大小的一半,然后将其放置在另一个设备上,如下所示: img 1

2.-接下来,您必须像这样设置每个约束(这将使容器填充整个屏幕,一个覆盖另一个):

顶部容器 img 2

底部容器 img 3

3.--最后,您必须选择两个容器并添加新的约束,以指定它们的高度相同 img 4

(请记住,每个步骤都必须加上“添加X约束”)

现在应该准备将标签放入每个容器中了,您将准备好