web-dev-qa-db-ja.com

自動レイアウトを使用した場合のビューのアニメーション化/移動

ビューをある位置から別の位置に移動したいのですが、

self.view.center = CGPointMake(100, 200);

ただし、プロジェクトで自動レイアウトを使用している場合は、実行後にビューが元の位置に戻ります。

[self.view.superview setNeedsLayout];

では、実際にビューを新しい位置に移動するにはどうすればよいですか?

22
user1687717

AutoLayoutを使用している場合は、制約を変更する必要があります。提案されている方法は、View Controllerに制約のアウトレットを作成してから、制約の定数を変更することです。時間があれば、絶対にお勧めします ここに行く そして「例による自動レイアウト」または「自動レイアウトをマスターするためのベストプラクティス」を見てください。彼らは私を大いに助けてくれました。 autoLayoutを使用すると、フレームの観点から考える必要がなくなるというのがポイントだと思います。したがって、中心の設定は自動レイアウトでは機能しません。ビューが互いにどのように関連しているかがすべてです。

14
Clint Warner

AutoLayoutを有効にすると、FORGET FRAMESCONSIDER CONSTRAINTSのみが必要になります。はい、アニメーションの場合、フレームや中央を変更できなくなります。レイアウトが次の場合、ビューは元の位置に戻ります。と呼ばれる。

代わりに、同じ効果を得るにはconsider changing the constant value of the constraintする必要があります。

以下の画像のようなユーザーインターフェイスについて考えてみます。20 points leading space from it's superviewの画像ビューがあります。これは、スーパービューに水平方向のスペース制約があることを意味します。また、その画像ビューには、上、幅、および高さ。

画像に示されているように、画像を左から右にアニメーション化する方法を紹介します。

アニメートする必要のあるコンストレイント用のIBOutletを作成します。ここでは、このビューを左から右に移動するのに十分な水平方向のスペースコンストレイントのみを使用しています。

@property (weak, nonatomic) IBOutlet UIImageView *imageView;
@property (weak, nonatomic) IBOutlet NSLayoutConstraint *horizontalSpaceConstraint;

enter image description here

Go Awayアクション内で、この制約の定数値を更新する必要があります。

- (IBAction)moveFrontAction:(id)sender {
    self.horizontalSpaceConstraint.constant = 220;

    [UIView animateWithDuration:0.5 animations:^{
         [self.imageView layoutIfNeeded];
    }];
}

これで、ビューを右端に移動する必要があります。アニメーションブロック内でこれを行っているので、ニースアニメーションを左から右に、またはその逆に表示できます。プロダクションでは、次のような値をハードコーディングしないでください。コンセプトを明確にするためにここでそれを行うだけです。

enter image description here

Come Backアクション内で、定数を元の値にリセットしているので、オレンジ色の画像が元の場所にアニメーションで戻っているのがわかります。

- (IBAction)moveBackAction:(id)sender {
    self.horizontalSpaceConstraint.constant = 20;

    [UIView animateWithDuration:0.5 animations:^{
        [self.imageView layoutIfNeeded];
    }];
}
32
RJR