2016-12-04 5 views
0

私はかなり新しいiOS開発者で、スクロールビューの最初の必要性を迎えています。デザインが必要なページは少し複雑です。私はそれを正しくレイアウトするために苦労していたので、スーパーシンプルなシーンを作成することにしました。そこでUIScrollViewを動作させる方法を理解できるようにしました。どうやら、うまくいきませんでしたし、いくつかのチュートリアルの後に私は立ち往生しています。iOS UIScrollView、私は何を誤解していますか?私はスクロールするためのスクロールビューを得ることができません

私はこの記事の最後でのXcode 8.1とスウィフト3

スクリーンショットで働いています。

私は、スクロールビューと2つのラベル付きの子ビューからなるシーンを持っています。私は、スクロールを起こさせようとするために〜700pt離れたラベルを設定しました。スクロールせずに、最初のラベルしか見ることができません。さらに、子ビューは完全な高さに拡張されません。

私のスクロールビューにスーパービューの側面にピンを固定する制約があることをスクリーンショットで見ることができます。

子ビューは同じです。

ラベル制約は、それらを子ビュー内に配置し、互いから700ptを配置します。私はこれによって、スクロールを起こすのに必要な高さがビューに与えられると考えました。制約エラーはありません。

赤いチャイルドビューが縦のスペースを埋めるようにしてからスクロールしたいと考えています。この時点では、何かがスクロールしていれば、レイアウトを取ることになりました。何もありませんが、私は何を得ませんか?

スクリーンショット:
(私はまだ新しいSOユーザーだから起因するリンク限度まで除去)


EDIT(6/12/16):

私はいくつかの変更を加えましたもう少し近づいた。主に、ラベルの1つをスクロールビューと同じ高さに設定することを他の場所で私に提案しました。これは今、私に "バウンス"効果を与えます。これは、物がスクロールのようなものであることを意味します。ただし、下に隠れる2番目のラベルが切り取られるため、1つのコンテンツ画面しか扱っていません。物事が立つのはここ

です:
edited hierarchy
edited screenshot

+0

はありません。明示的に設定しないと、コンテンツのサイズ(子ビューのサイズ)が計算されます。子ビューをスクロールビューに制限したため、子ビューはスクロールビューと同じサイズになります。子ビューとスクロールビューの間の制約を設定して、子ビューがスクロールビューよりも大きくなるようにしてください(例えば、 "child view leading == scroll view leading"を編集し、定数を-300に設定する)。 – Paulw11

+0

@ Paulw11ラベルがコンテンツサイズを暗示していることまた、コンテンツビューにheight/90という制約をtop/bottom/leading/trailingと一緒に入れました。それ以外の場合は、エラーを投げていた。だから明白な高さを持っています。 – Philip

+0

これは、コンテンツサイズを試して推測しますが、ビューをスクロールビューに制限しているため、表示されるコンテンツのサイズは、水平方向の間隔に基づいて表示されている画面の外側にあることを前提にしています。ボタンの前縁をビューの前縁と他のボタンの後端に拘束し、間隔を維持するとどうなるかを確認してください。あなたは紛争に終わるはずです – Paulw11

答えて

0

以下の例の階層あなたはストーリーボードにUIScrollViewを使用している、あなたは、スクロールビューは、そのコンテンツのサイズを計算することが可能であることを確認する必要があります。あなたは十分な制約を持っていないなら、あなたはInterface Builderでエラーが発生します。

スクロール可能なコンテンツのサイズあいまい

制約があることが必要であることをアドバイスします。このエラーの情報アイコンをクリックしますスクロールビューのすべての側面に触れ、左から右、上から下へ連続した拘束線を追跡できるようにします。

これは、追加したコンテンツビューの有無にかかわらず可能です。スクロールビューでコンテンツビューを表示せずに行う方法を説明します。これは、単純な制約が少なく入力が少ないためです。

  1. は、ルートビュー
  2. 拘束そのスーパービュー(ルートビュー)へスクロールビューの一番上/左/上/下にスクロールビューを追加します。あなたは、画面の幅いっぱいにしたい場合は余白に拘束オフにすることを忘れないでください
  3. スクロールビュー
  4. 拘束トップ/スクロールビューにラベル1の/下をリードする
  5. 拘束トップへ追加ラベル1とラベル2スクロールビュー
  6. にラベル2の/後続/下スクロールビュー
  7. の幅に等しくなるように0スペース
  8. 拘束ラベル1の幅を有するラベル2の先端にラベル1の後端を拘束し
  9. ラベル1の高さをスクロールビューの高さに合わせるように制限する
  10. 拘束ラベルの幅と高さのラベル2の幅に等しくなるように、高さ1
  11. あなたは、スクロールビューのコンテンツサイズを設定する必要が一切ステップ10 :)
+0

私はそれを働かせることができました!私のものは垂直にスクロールしていて、あなたの例が水平になっているようです。しかし、私が欠けていた部分は、ラベル1とラベル2がどのようにやりとりされ、等しい高さになっているのかここにあります。これを正しいとマークします。あなたの助けと忍耐をありがとう! – Philip

+0

申し訳ありませんが、私は誤ってスクロール方向を理解していたはずですが、基本的なアプローチがどちらの軸でも機能することがわかりました – Paulw11

0

ScrollViewsは、彼らがスクロールするようになっている明示的にどのくらい知っているように、その中の特定のです。コンテンツビューの下に住んでいる1つのビューを有し、かつ、その後、ScrollViewそのビュー内のあなたの他のビューのすべてを含有することにより

-Scroll View 
    -Content View 
     -View (constrained to top, bottom, leading, trailing anchors) 
      -Your other views (e.g. Label) 

:これを処理する私が見つけた最良の方法は、いくつかの制約を次の階層を持つことですあなたが子ビューの中にどれくらいのものを持っていても、スクロールする必要があることをどれだけ知っているのですか(それはちょうど1つの子Viewのサイズを使用します)。

私のプロジェクトの1つから写真を撮ることができますか?その間、この階層を試してみて、それがあなたのために働くかどうか私に知らせてください。おそらく、子ビューの上部アンカーと先頭アンカーにラベルを拘束し、次にスクリーンより高い何か(1000単位など)に高さを制限します。

質問がある場合はお知らせください。

編集:

Content View has a child View which holds all of your other Views

+0

これは別のことをしていないようです。 – Philip

関連する問題