Höhe der contentView von UIScrollView auf Grundlage von Insider-Inhalte mit Storyboard

Bin ich tatsächlich Schwierigkeiten, um meine UIScrollView voll responsive mit nur storyboard Einschränkungen.

Hier mal meine Hierarchie :

> - UIViewController
>  - UIView
>   - UIScrollView
>    - contentView
>     - module1View
>     - module2View
>     - module3View

Alle Module werden verwendet, um die Anzeige von Diagrammen. Ich will, dass Sie reaktionsschnell Weg. Ich möchte Ihre Breite zu 100% dem Bildschirm und Ihre Höhe ist definiert durch eine Verhältnis Hinzugefügt, mit Einschränkung. Die Module werden nebeneinander angezeigt, wie Nachrichten in einem newsfeed.

Meine Frage ist : Wie setzt man die contentView Höhe gleich der Summe aller Module (Modul 1 + 2 + 3) ?

In anderen Wort, das ich erreichen will :

  • Oben contentView = top von Modul 1
  • Top von Modul 2 = Ende von Modul 1
  • Top von Modul 2 = Ende von Modul 2
  • Unten contentView = Ende von Modul 3

Verwalteten zu tun, dass ich Folgen einige Tutorials gefunden im internet. Hier sind die Schritte, die ich gefolgt :

  1. Einstellung UIScrollView Constraints zu definieren, seine Ort und Stelle.
  2. Einstellung UIScrollView top, unten, Links und richtigen Abstand zum nächsten Nachbarn zu 0.
  3. Einstellung der Einschränkung zwischen den Modulen zu "stapeln", Sie auf eine
    andere.
  4. (Ich BIN BLOCKIERT HIER) Einstellung der unteren contentView zu den
    Unterseite von Modul 3 zu erlauben, die UIScrollview scrollen bis zum Ende
    content.

Habe ich versucht zu zwingen, die Höhe der UIScrollView : es funktioniert, aber Es ist nicht responsive. Da die Höhe des Moduls errechnet sich durch einen Quotienten, je nach Gerät die Höhe "- Modul 1 + 2 + 3" während ändern.

Ich versucht, um eine Einschränkung von Modul 3 zu contentView um die Unterseite des Moduls 3 = unten contentView. All die Zwänge, rot mit Warnung überall.

Haben Sie eine Idee, wie man die Höhe der contentView basiert auf einem responsive content ? (Wie "wrap-content in einer Art und Weise).

Vielen Dank im Voraus für Euch Hilfe!!!

  • sobald Sie legen Sie die Höhe der Module basiert auf Ihr Verhältnis, Sie sollten in der Lage sein, um die Berechnung der Höhe für die contentView
  • Ich habe versucht, hinzuzufügen : mainContentView.frame = CGRectMake(0, 0, self.view.width, module1View.height+module2View.height+module3View.height); in ViewDidLoad-und viewWillAppear, keiner von Ihnen arbeitete
  • wenn legen Sie die Rahmen der Module? Sie müssen die mainContentView Bild nach dem Modul-frames eingestellt werden... welche Art von Objekt sind die Module?
InformationsquelleAutor Tom Giraudet | 2016-07-20
  1. 48

    Habe ich in der Lage zu bekommen, dynamic scroll-views arbeiten ganz von storyboards, kein code, mit den folgenden Schritten:

    1) In das storyboard, fügen Sie ein scroll-view und hemmen Ihre Kanten den Kanten der Haupt-Ansicht oder in welcher Weise auch immer angemessen ist

    2) in der scroll-Ansicht, fügen Sie ein plain old UIView wie ein container. Beschränken Sie es an allen 4 Kanten des scroll-view, ABER AUCH hinzufügen, ein die gleiche Breite Einschränkung relativ zu scroll-view, und eine gleicher Höhe Einschränkung auf die scroll-view

    3) Sehr wichtig: legen Sie eine niedrige Priorität für die Höhe Einschränkung, z.B. 250.

    4) innerhalb der container-Ansicht, die Sie in Schritt 2 Hinzugefügt haben, fügen Sie Ihre 3 Module. Fixieren Sie die Obere Kante des ersten Moduls auf der Oberseite des Behälters anzuzeigen, Schränken Sie den unteren Rand des letzten Moduls auf den Boden des Behälters anzeigen, und beschränken alle, die in-zwischen den Modulen zu dem vorhergehenden Modul in der Kette. Dies sollte Ihnen Ihre Kette von ununterbrochenen vertikale Beschränkungen innerhalb der container-Ansicht. Sie müssen auch hinzufügen, was entsprechende x-Positionierung /- Breite-Einstellung Einschränkungen für jedes Modul.

    5) Erstellen und ausführen! Die scroll-Inhalte betrachten, die Größe sollte sich automatisch gleich der Summe der Höhe aller Module plus dem Abstand zwischen Ihnen, und ändern Sie die Modul-Inhalte dynamisch zu aktualisieren, die scroll-view Größe des Inhalts per "auto-layout" ist nicht erforderlich, explizite code zu berechnen und zu aktualisieren.

    • Die niedrige Priorität für die Höhe Einschränkung hat den trick! Vielen Dank!
    • Sie den Tag gerettet-vielen Dank !
    • Ich habe mit Scrollview für eine Weile, aber Wusste nicht, über Punkt 3. Vielen Dank.
    • Diese Lösung war nicht direkt für mich arbeiten, ich hatte, um den Inhalt anzuzeigen Einschränkung der ScrollView die Eltern und nicht direkt an den ScrollView. Überprüfen Sie meine Antwort für details.
    • Heilige Kuh, das ist unglaublich! Danke!!!
    • Eine der besten Lösungen die ich je gesehen habe auf stack overflow 🙂
    • Für mich, "beschränken Sie den unteren Rand des letzten Moduls auf den Boden des container-Ansicht" ist der Schlüssel. Jedoch, in meinem storyboard habe ich Elemente, die Bluten aus dem unteren Rand des Storyboards. irgendwelche Vorschläge?
    • Die gleiche Lösung funktioniert immer noch für diesen Fall, aber Sie können vorübergehend erhöhen Sie die Größe des view - / controller-Szene auf dem storyboard zu werden mindestens so groß wie alle Inhalte in der scroll-Ansicht. Wenn Sie den view-controller und wählen Sie dann die Registerkarte "layout" im Bereich "Informationen" und ändern Sie die option von "Fixed" zu "Freiform" können Sie die Höhe der Szene / Ansicht-controller zu 2000 oder was auch immer Sie brauchen. Richten Sie Ihre Einschränkungen die oben genannten Schritte, dann wechseln Sie wieder zu "Fixen". Ihr Artikel wird bleed von der Kante ab und angeklemmt werden, sondern wird ordnungsgemäß zur Laufzeit!
    • Das war genau, was ich dachte, und endete damit. Danke für die Bestätigung.
    • Es war Schritt 3 das war mein Problem gelöst, vielen Dank!
    • Schritt 3 war eine tolle Idee! Danke!

    InformationsquelleAutor Daniel Hall
  2. 0

    Versuchen zu definieren, die Höhe der Module runtime und fügen Sie auto-layout Einschränkung für Module programmgesteuert.

     #define kDeviceHeight                   [UIScreen mainScreen].bounds.size.height
 #define kDeviceWidth                    [UIScreen mainScreen].bounds.size.width

    - (void)viewDidLoad {

        [super viewDidLoad];
        [self setScrollViewHeight];

    }

    -(void)setScrollViewHeight{

        float module1_Height,module2_Height,module3_Height;//Calculate the height of modules over here and assign it to respective variables
        float viewVerticalSpacing = 5; //Provides space between two views
        float YAxis = 0;
        module1View.frame = CGRectMake(0, 0, kDeviceWidth, module1_Height);

        YAxis = YAxis + module1_Height + viewVerticalSpacing;
        module2View.frame = CGRectMake(0, YAxis, kDeviceWidth, module2_Height);

        YAxis = YAxis + module2_Height + viewVerticalSpacing;
        module3View.frame = CGRectMake(0, YAxis, kDeviceWidth, module3_Height);

        float scrollView_height = YAxis + module3_Height + viewVerticalSpacing;
        scroll_view.contentSize = CGSizeMake(kDeviceWidth, scrollView_height);
        scroll_view.frame = CGRectMake(0, 0, kDeviceWidth, kDeviceHeight);
    }
    InformationsquelleAutor Komal
  3. 0

    Für mich, Daniels Lösung war sehr hilfreich, hat aber nicht funktioniert.
    Hier sind die aktualisierten Schritte :

    1) In das storyboard, fügen Sie ein scroll-view und hemmen Ihre Kanten den Kanten der Haupt-Ansicht oder in welcher Weise auch immer angemessen ist

    2) in der scroll-Ansicht, fügen Sie ein plain old UIView wie ein container. Beschränken Sie es an allen 4 Kanten des scroll-view, ABER AUCH hinzufügen, ein equal-width-constraint relativ zu Blättern-Ansicht Eltern (höchste), und einer Höhe von constraint-scroll-Ansicht Eltern

    3) Sehr wichtig: legen Sie eine niedrige Priorität für die Höhe Einschränkung, z.B. 250.

    InformationsquelleAutor Scaraux
  4. 0

    Ich habe mir arbeiten, indem nicht die Inhalte anzeigen, die Höhe der alles.

    InformationsquelleAutor Siamaster
Schreibe einen Kommentar