2015-09-11 9 views
18

Chcę utworzyć widok z przewijaniem tylko w pionie. Okazało się, że w iOS jest trudny do zdobycia. Zrobiłem to:Wyłącz poziomy przewijanie w UIScrollView z autolayout

1) Utwórz UIViewController w storybooku;

2) Dodaj ScrollView inside Zobacz w UIViewController i dodaj 0 ograniczeń do każdej strony.

3) Dodaj elementy w Scrollview, jako rezultat: enter image description here

Po uruchomieniu mojej aplikacji wszystko działa, ale:

1) W jaki sposób należy wyłączyć poziomego przewijania? Dodaję 0 ograniczeń na prawo do mojego ograniczenia scrollView + 0 na prawo do mojego uilabel (jak widać na ekranie z pewnych powodów nie jest on dołączony z prawej strony, ma inne ograniczenie, ale w właściwości ustawiam ograniczenie = 0) i, jak myślałem, tekst etykiety powinien znajdować się na moich ekranach, ale kiedy uruchamiam aplikację, mogę przewijać w prawo, tzn. tekst uilable nie był zawijany, mój scrollview po prostu zmienia rozmiar, aby pasował do tekstu. Próbowałem ustawić mój scrollView w kodzie: scrollView.contentSize = CGSize(UIScreen.mainScreen().bounds.width, height: 800), ale nie pomogło.

2) Jeśli przewijam do dużej ilości, pojawia się puste miejsce i to nie jest fajne, jak to naprawić?

+0

Właśnie odpowiedziałem na bardzo podobne pytanie tutaj: http: // stackoverflow.com/a/32531753/958017 – lucaslt89

Odpowiedz

46

1) Przewijanie poziome włącza się automatycznie, gdy szerokość zawartości w scrollView jest większa niż szerokość scrollView. Dlatego, aby uniknąć przewijania w poziomie, konieczne jest, aby szerokość zawartości wewnątrz scrollView była mniejsza lub równa szerokości scrollView.

Leading space i trailing space nie można ustawić określonej szerokości do widoków, tylko je rozciągają. W zwykłych widokach nie rozciągają się na więcej niż szerokość widoku, ale scrollView jest specjalnym widokiem z nieskończoną szerokością treści. Z tego powodu ograniczenia trailing space i leading space w scrollView zmieniają szerokość widoków na ich maksymalne możliwe wartości (w przypadku UILabel można zmienić rozmiar pasujących do tekstu).

Aby uniknąć przewijania w poziomie, należy ustawić określoną szerokość każdego widoku, mniejszą lub równą szerokości scrollView. Określoną szerokość widoków można ustawić za pomocą width constraints.

Zamiast ustawiać szerokość każdego widoku, lepiej dodać do niego kontener widoku i ustawić szerokość, a wewnątrz niego umieścić widoki w razie potrzeby.

Odwiedzin hierarchia:

View 
    -> ScrollView 
     -> ContainerView 
      -> UILabel 
      -> UILabel 
      -> ... other views that you need 

ograniczenia autoLayout:

ScrollView 
    -> leading space to View : 0 
    -> trailing space to View : 0 
    -> top space to View : 0 
    -> bottom space to View : 0 

Container View 
    -> leading space to ScrollView : 0 
    -> trailing space to ScrollView : 0 
    -> top space to ScrollView : 0 
    -> bottom space to ScrollView : 0 
    -> width equal to ScrollView : 0 

Aby ustawić width equal constraint ctrl + przeciągnięcie od containerView do scrollView.

width equal constraint

2) Zwój pionowy zależy od całkowitej wysokości zawartości. Puste miejsce może być, jeśli ostatni element wewnątrz containerView ma dużą wartość bottom space to superview.

Czy masz na myśli efekt odbicia? Możesz wyłączyć pionowe odbicie scrollView.

+0

To było doskonałe rozwiązanie. W przeciwieństwie do większości innych rozwiązań, można to zrobić tylko w konstruktorze interfejsów, bez potrzeby ręcznego ustawiania contentSize w kodzie. – Houman

+0

Dziękuję, ale moja cała kontrola nie odpowiada. Pola tekstowe i przyciski nie są klikalne. – Parimal