如何配置使用自动布局画像不同的布局和横向? [英] How to configure different layouts for Portrait and Landscape Orientations using Auto Layout?

查看:124
本文介绍了如何配置使用自动布局画像不同的布局和横向?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在附加的图像就像一个视图

I have a view like in attached image

现在我加入的限制,例如,在视图中的UITextView具有当方向改变为横向为在屏幕的右侧。在UITextView中,我加入了以下的限制,

Now I am adding constraints such that the UITextview in the view has to be on the right hand side of the screen when orientation is changed to landscape. On UItextview, I have added below constraints,


  1. 尾随空格键:上海华

  2. 底部空间为:上海华

这些限制虽然显示在ambugity一些警告,做的工作对我来说。下面是横向模式的截图。

These constraints though displayed some warnings on ambugity, did the job for me. Below is the screenshot of landscape mode.

我的问题是虽然UITextView的移动到右边,我想从上海华顶一些额外的宽度,当它在横向模式。换句话说,我想在那里它现在是在横向模式下的UITextView的要被移动从一点向下。我琢磨如何在IB使用自动布局做的,我不能够明白这是如何。

My problem is though the UItextview is moved to right side, I want some additional width from top of superview when it is in landscape mode. In other words, I want the UITextview to be moved a little downward from where it is now in landscape mode. I am pondering how to do that using auto layout in IB and I am not able to figure that how.

任何建议,请。

推荐答案

您可以以多种方式限制做到这一点,但没有办法只有你做IB自动制约做到这一点。通过该方法同时使用乘数和常量值,constraintWithItem:属性:relatedBy:toItem:属性:事半功倍:恒:,你可以有一个约束,其值在纵向和横向的距离不同。这是一个痛苦做计算,以确定用什么这些值,所以我写了NSLayoutConstraint类别做到这一点。这些方法的一个例子,是这样的:

You can do this with constraints in several ways, but there's no way to do this automatically with just constraints you make in IB. By using both the multiplier and constant values in the method, constraintWithItem:attribute:relatedBy:toItem:attribute:multiplier:constant:, you can have one constraint that evaluates to different distances in portrait and landscape. It's a pain to do the calculations to figure out what to use for those values, so I've written a category on NSLayoutConstraint to do that. An example of one of those methods, is this:

+(NSLayoutConstraint *)topConstraintForView:(UIView *)subview viewAttribute:(NSLayoutAttribute) att superview:(UIView *)superview portraitValue:(CGFloat)pValue landscapeValue:(CGFloat)lValue {
    CGFloat multiplier = (pValue - lValue)/(superview.bounds.size.height - superview.bounds.size.width);
    CGFloat constant = pValue - (superview.bounds.size.height * multiplier);
    NSLayoutConstraint *con = [NSLayoutConstraint constraintWithItem:subview attribute:att relatedBy:0 toItem:superview attribute:NSLayoutAttributeBottom multiplier:multiplier constant:constant];
     NSLog(@"top coeffs: %f   %f",multiplier,constant);
    return con;
}

您使用这些方式,是添加起始画像约束在故事板,但检查中,占位符 - 在构建时删除,在属性检查器约束,然后替换它在viewDidLoad中,像这样的

The way you use these, is to add the starting portrait constraint in the storyboard, but check the box, "Placeholder - Remove at build time" in the attributes inspector for the constraint, and then replace it in viewDidLoad, like this:

- (void)viewDidLoad {
    [super viewDidLoad];
    [self.view addConstraint:[NSLayoutConstraint topConstraintForView:self.textView viewAttribute:NSLayoutAttributeTop superview:self.view portraitValue:225 landscapeValue:50]];
}

这会自动调整基于所述装置的旋转而没有任何进一步的code中的文本视图的位置。您可能需要更改文本字段的宽度得到的一切,以适应正确 - 我包围他们,并在视图中的获取的标签更容易定位他们作为一个群体。这种观点和文本视图有高度和宽度的限制,以及顶部和左侧的视图,顶部和右侧的文本视图。该类别有方法调整其他约束为好,并可以在 http://jmp.sh/b/S4exMJBWftlCeO5GybNO 找到

This will automatically adjust the position of the text view based on the rotation of the device without any further code. You might have to change the width of the text fields to get everything to fit properly -- I enclosed them and the "Get" labels in a view to more easily position them as a group. That view and the text view had height and width constraints, as well as top and left for the view, and top and right for the text view. The category has methods to adjust the other constraints as well, and can be found at http://jmp.sh/b/S4exMJBWftlCeO5GybNO.

另一种方式来做到这一点,是让IBOutlets您在IB做出限制,并调整它们(恒定值),或删除一些和改造其他的,在旋转回调方法之一。

The other way to do this, is to make IBOutlets to the constraints you make in IB, and adjust them (the constant value), or delete some and remake other ones, in one of the rotation callback methods.

这篇关于如何配置使用自动布局画像不同的布局和横向?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆