web-dev-qa-db-ja.com

UIScrollView AutoLayout Verticalのみ

AutoLayoutをUIScrollViewで動作させたいのですが、少し問題があります。これが私がしたことです：

  1. メインビュー内にUIScrollViewを追加します。フレーム：[上：0、左：0、幅：320、高さ：568]

  2. UIView "ContentView"をUIScrollView内に追加し、フレームとbgcolorを黒：[上：0、左：0、幅：320、高さ：568]

  3. UIScrollView制約の設定：[上：0、下：0、左：0、右：0]

  4. 「ContentView」制約の設定：[上：0、下：0、左：0、右：0]

  5. 「ContentView」内のアイテムを整列します

  6. メインビューのbgcolorをグレーに設定します（何が起こっているのかを見るため）

ここに問題のスクリーンショットがあります：

Screen Shot1

何らかの理由で、制約によりコンテンツビューが画面の中央に表示されます。また、あらゆる方向にスクロールします。 UITableViewのように、コンテンツを垂直方向にのみスクロール可能にする必要があります。以下のように移動できないように：

Screen Shot

私は何を間違えていますか？ StackOverflowとGoogleで見つけられるすべてのチュートリアルと回答を確認しましたが、実際に奇妙な問題を抱えている人はいないので、助けを求めています。

EDIT：また、ContentViewの幅と高さを制約として追加しましたが、どちらも役に立ちませんでした。

iosobjective-cswiftuiscrollviewautolayout
24
Gasim

水平スクロールを無効にするには、（void）scrollViewDidScrollメソッドでコンテンツサイズを設定できます。

[self.scrollView setContentOffset: CGPointMake(0, self.scrollView.contentOffset.y)];

また、一度に1つのスクロール方向のみが使用されるように方向ロックを設定することもできます。 https://developer.Apple.com/library/ios/documentation/UIKit/Reference/UIScrollView_Class/index.html#//Apple_ref/occ/instp/UIScrollView/directionalLockEnabled

self.scrollView.directionalLockEnabled = YES;
19
Derek

制約を使用してこれを完全に行うことができ、それは本当に簡単です。

UIScrollViewは、内部にどれだけの幅とスペースがあるかを理解する必要があります。そのため、Leading、Trailing、TopおよびBottom制約に何かを固定する必要があります。また、コンテンツの幅と高さを固定する必要があります（これは特定する必要があるという意味ではありません。これを達成するために制約を使用することもできます）

  1. 必要に応じてUIScrollViewと位置を追加します。
  2. コンテンツのUIView内にUIScrollViewを追加します。
  3. コンテンツLeadingのTrailing、Top、Bottom＆UIView制約を0に設定します。
  4. Equal Width制約をUIScrollViewおよびUIViewに追加します。これにより、垂直方向にのみスクロールします。
  5. ここで、コンテンツの高さUIViewを設定する必要があります。その後、コンテンツビューの高さ（斑点）を指定するか、下部のコントロールがコンテンツビューの下部に制限されていることを確認して、その中に含まれるコントロールの高さを使用できます。

私はこれをしました、そして、それは御treat走になりました。

36
Chris Kemp

Leszek Sの答えを要約すると：

垂直スクロールビューを使用するには、スクロールビュー内のすべてのビューにそれらが必要です幅の制約を設定します。スクロールビューのスーパービューに簡単に設定できます。

その理由は、サブビューが水平にスクロールする必要がない限り、スクロールビューは水平にスクロールしないからです。たとえば、ラベルが0行に設定されている場合、自動レイアウトは、行と改行の追加を開始する前に、できる限り幅を広げようとします。ラベルに明示的な幅の制約がない場合は、スクロールビューのコンテンツ領域を広くします。スクロールビューへのトレーリングの制約は無視されます。

多数のビューがある場合は、そのビデオのように、それらを含む単一のビュー内にビューを配置できます。私の場合、高さを動的に変更できるラベルは5つまたは6つしかありませんが、幅を変更しないでください。スクロールビューと同じ幅にしました。そして、ビンゴ、テキストに応じて拡大または縮小するラベルを持つ垂直スクロールビュー。

7
n13

コンテンツを水平方向ではなく垂直方向にスクロールできる関数を作成しました。 scrollview内に制限された幅のUIViewを作成し、すべてのscrollviewサブビューを埋め込みます。

TegScrolledContent.createContentView(scrollView)

https://github.com/exchangegroup/scrollable-content-ios

enter image description here

3
Evgenii

@derekの答えとともに、contentOffsetを常にscrollViewDidScrollに設定するとパフォーマンスの問題が発生することを追加したいと思います。したがって、xが0でない場合にのみ確認し、contentOffsetを設定してください。

    if(contentOffset.x != 0){
        setContentOffset(CGPointMake(0, contentOffset.y), animated: false)
    }

はい、スクロールビューに

directionalLockEnabled = true
1
sheetal

コンテンツビューに明示的な高さと幅の制​​約を与える

1
mustafa

以下は、垂直方向のみのスクロールビューを実現するために使用したスニペットです。コンテンツビューをスクロールビューの子ビューとして追加し、そのコンテンツビューの幅を親スクロールビューの幅に制限することで機能します。その後、すべてのサブビューをスクロールビューではなくコンテンツビューに追加する必要があります。

// View that will contain content of scroll view. Width is constrained to the width of the scroll view.
UIView *contentView = [[UIView alloc] init];
contentView.translatesAutoresizingMaskIntoConstraints = NO;
[scrollView addSubview:contentView];

views[@"contentView"] = contentView;
[scrollView addConstraint:[NSLayoutConstraint constraintWithItem:contentView attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:scrollView attribute:NSLayoutAttributeWidth multiplier:1.0 constant:0.0]];
[scrollView addConstraint:[NSLayoutConstraint constraintWithItem:contentView attribute:NSLayoutAttributeCenterX relatedBy:NSLayoutRelationEqual toItem:scrollView attribute:NSLayoutAttributeCenterX multiplier:1.0 constant:0.0]];
[scrollView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[contentView]|" options:0 metrics:nil views:views]];

// Now, add all your subviews to contentView
1
josh-fuggle