4

テキストビューとイメージビューを含むセルを含むテーブルビューがあります。私のプロジェクトは現在 AutoLayout を使用しています。私の目標は、イメージビューをタップしたときにフルスクリーンで表示することです。1 つのオプションはモーダル ビュー コントローラーを使用することですが、Facebook アプリで画像をタップするのと同じように機能させたいと考えています。アプリは画像を中央に配置し、背景をフェードします。

私は自動レイアウトを使用しているため、画像ビューのフレームを画面いっぱいに設定することはできません。代わりに、自動レイアウト制約を使用する必要があります。私の画像ビューには、セルの下部からの距離を設定する制約、左右の側面、および画像の高さを制御する制約の 5 つの制約があります。最後は、画像ビューの上のテキストビューと画像の上部の間の垂直方向のスペースの制約です。これは高さと底の制約と競合するように見えますが、何らかの理由でインターフェイス ビルダーがこれを強制します。問題を回避するために、この制約の優先度を 1000 未満に設定しました (すべてが完全に収まるようにテーブルビューのセルの高さが設定されているため、画像がテキストビューと重なってはいけません)。

画像を中央に配置するには、左右からの距離をゼロに設定し、垂直方向のスペースの制約を取り除きます。画像を中央に配置するために、テーブルビューセルではなくUIWindowに対して、下部スペースの制約を中央の y 配置制約に置き換えます。セルではなく、画面の中央に配置したい。

メインウィンドウを取得するには、これを使用します:

AppDelegate* myDelegate = (((AppDelegate*) [UIApplication sharedApplication].delegate));
//access main window using myDelegate.window

次に、制約を設定するには:

//currently sets the distance from the bottom of the cell to 14
//changing it...
[cellselected removeConstraint:cellselected.imagebottomspace];
cellselected.imagebottomspace = [NSLayoutConstraint constraintWithItem:cellselected.viewimage attribute:NSLayoutAttributeCenterY relatedBy:NSLayoutRelationEqual toItem:myDelegate.window attribute:NSLayoutAttributeCenterY multiplier:0 constant:0];
[cellselected addConstraint:cellselected.imagebottomspace];

ただし、これは機能しません。画像ビューの幅と高さの変更は問題なく適用されます。しかし、imagebottomspace 制約を読み直すと、満足できないレイアウトが得られます。どうやら、この制約は、下と画像ビューの間の距離を 14 に設定する別の制約と競合しているようです。したがって、実際には制約を削除していないようです。

続行してアプリに制約を破らせると、イメージビューは移動しますが、間違った場所に移動します。画面の中央に配置されていません。画面の上下に移動します。

明らかに、私がしていることは正しくありません。私は何を間違っていますか?

4

2 に答える 2

7

だから私はあなたがこのようなものが欲しいと思います:

ズーム画像ビューのデモ

まず、Xcode 4.6.3 の時点で、テーブル ビュー セルで制約を設定するときに nib エディター (「インターフェイス ビルダー」) にバグがあることを知っておく必要があります。サブビューとセルのコンテンツ ビューの間に制約を作成する必要がありますが、代わりに、サブビューとセル自体の間に制約を作成します。これにより、実行時にレイアウトが台無しになる傾向があります。(このバグは Xcode 5 以降で修正されています。)

この結果、nib にあったすべての制約を削除してコードで再作成するか、単に nib を削除してセルのビュー階層全体をコードで作成する必要があります。

次に、画像のズームを簡単に行う方法があります。セルが選択されたときの基本的な手順は次のとおりです。

  1. 選択したセルの画像ビューの境界をCGRectトップレベル ビューの座標系に変換します。
  2. ズーム専用の新しい画像ビューを作成し、そのフレームをそれに設定しCGRectます。に設定userInteractionEnabledYESます。autoresizingMask柔軟な幅と高さに設定します。タップ ジェスチャ認識エンジンを追加します。
  3. 新しい画像ビューを最上位ビューのサブビューとして追加します。
  4. セルの画像ビューのhiddenプロパティを に設定しYESます。
  5. アニメーション ブロックで、新しいイメージ ビューのフレームを最上位ビューの境界に設定します。
  6. テーブル ビューの を無効にしますpanGestureRecognizer

新しい画像ビューがタップされたら、手順を逆にします。

  1. 選択したセルの画像ビューの境界をCGRectトップレベル ビューの座標系に変換します。
  2. アニメーション ブロックで、ズームされたイメージ ビューのフレームをその に設定しCGRectます。
  3. アニメーション完了ブロック:
    1. ズームされた画像ビューをそのスーパービューから削除します。
    2. セルの画像ビューのhiddenプロパティを に設定しNOます。
    3. テーブル ビューの を有効にしますpanGestureRecognizer

元の画像ビューを動かしていないので、その制約をいじる必要はありません。非表示のビューは引き続きレイアウトに参加します。

コードで新しい画像ビューを作成しているため、デフォルトでにtranslatesAutoresizingMaskIntoConstraints設定さYESれています。これは、フレームを設定するだけでよいことを意味します。自動レイアウトは、フレームを自動的に制約に変えます。

完全なソース コードは、この github リポジトリにあります。

于 2013-07-03T06:52:21.880 に答える
0

同様の問題に遭遇しました。これらの問題の理由は、UIScrollViews に埋め込まれたビューが、その外側のビューとは異なる境界システムに存在するためだと思います。これは、スクロールが最初に効果的に機能する方法です。これは、含まれるビューに可変オフセットを適用するだけだと考えてください。Autolayout は、これらの異なる座標系間の変換方法を認識していないため、橋渡しする制約は期待どおりに適用されません。

Erica Sadun の優れた本 iOS Auto Layout Demystified から引用するには (「制約、階層、および境界システム」セクションから):

「境界システムに注意してください。たとえば、ビューのボタンを別のコレクションビュー内のテキストフィールドに関連付けないでください。独自の境界システムを持つある種のコンテンツビューがある場合(コレクションビュー、スクロールビューなど) 、およびテーブル ビュー)、別のビューのまったく異なる境界システムに飛び出さないでください。」

于 2014-04-25T11:31:23.133 に答える