UIView变换,自动布局和锚点

时间:2016-05-02 07:58:03

标签: ios

我正在使用ios 9 sdk。我使用autoloayout创建了此视图层次结构设置:

----- Top
  | 30
----- CustomView (A)
  |
  |
-----
  | 0
----- Bot

我正在尝试在第一个后面创建第二个CustomView(称之为B)(称之为A),在两个方向上缩放80%,在A上缩放5个点。因此只有B的顶部可见。

这应该很容易,但事实并非如此。在B上应用-5点平移和.8缩放将B向下移动而不是向上移动,因为自动布局似乎使用锚点(默认设置为中间)到位置B:它似乎检测到已应用缩放并且垂直重新定位B - 将其向下移动。

将锚点更改为(x = 0.5,y = 1)会使A和B向上移动一半大小,我不明白为什么。所以它无法解决问题。

有什么想法吗?

编辑:一些代码

var card = new CardView();
InsertSubview(card, 0);

card.TranslatesAutoresizingMaskIntoConstraints = false;
this.AddConstraints(
            card.AtTopOf(this, 30),
            card.WithSameWidth(this).WithMultiplier(.95f),
            card.WithSameCenterX(this),
            card.AtBottomOf(this)
            );

 var transform = CGAffineTransform.MakeTranslation(0, -10);
 transform.Scale(.8f,.8f);
 Transform = transform;

结果:卡片距离顶部不到20分,距离原始位置30pt不到50分左右。

2 个答案:

答案 0 :(得分:1)

您添加了错误的约束。经过一些实验,我得到了你想要的结果。关键似乎是将背景视图的中心Y固定到前景视图的顶部,然后抵消更改锚点时给出的垂直移位。

游乐场中的以下代码会提供您想要的结果:

import UIKit
import XCPlayground

let view = UIView(frame: CGRect(origin: .zero, size: CGSize(width: 400, height:400)))
view.backgroundColor = UIColor.whiteColor()
XCPlaygroundPage.currentPage.liveView = view

let a = UIView()
a.translatesAutoresizingMaskIntoConstraints = false
a.backgroundColor = UIColor(red: 1.0, green: 0.0, blue: 0.0, alpha: 0.5)
view.addSubview(a)
a.topAnchor.constraintEqualToAnchor(view.topAnchor, constant: 30).active = true
a.widthAnchor.constraintEqualToAnchor(view.widthAnchor).active = true
a.bottomAnchor.constraintEqualToAnchor(view.bottomAnchor).active = true

let b = UIView()
b.translatesAutoresizingMaskIntoConstraints = false
b.backgroundColor = UIColor(red: 0, green: 1, blue: 0, alpha: 1)
b.layer.anchorPoint = CGPoint(x: 0.5, y: 0)
view.addSubview(b)
view.sendSubviewToBack(b)
NSLayoutConstraint.activateConstraints([
    b.centerYAnchor.constraintEqualToAnchor(a.topAnchor),
    b.widthAnchor.constraintEqualToAnchor(a.widthAnchor),
    b.heightAnchor.constraintEqualToAnchor(a.heightAnchor),
    b.centerXAnchor.constraintEqualToAnchor(a.centerXAnchor)
])
let translate = CGAffineTransformMakeTranslation(0.0, -10)
let scale = CGAffineTransformMakeScale(0.8, 0.8)
b.transform = CGAffineTransformConcat(translate, scale)

结果:

enter image description here

答案 1 :(得分:0)

我看到的两种可能方法是:
- 先缩放,然后将其添加到视图层次结构中 或
- 在将视图B添加到视图层次结构之前更改视图B的锚点。然后你可以按照你想要的方式改变它。