UIStackView - Distribuisci le viste in modo uniforme dal centro

Question

Ho un, all'interno di un UIScrollView per visualizzare le sottoview aggiunte dinamicamente disposte orizzontalmente. La soluzione attuale inizierà a visualizzare gli oggetti da sinistra, vorrei iniziare a distribuire gli oggetti dal centro senza modificare la larghezza e l'altezza delle sotto-visualizzazioni. Come lo faccio? Sono anche aperto a soluzioni che non usano anche UIStackView. In questo modo potrei supportare i dispositivi < iOS9.

(corrente)

(Expected)

Answer 1

Risposta breve:

Sc rollView vincoli

Leading >= 0, Trailing >= 0, Top >= 0, Bottom >= 0 
Center X and Center Y 

vincoli StackView

Leading = 0, Trailing = 0, Top = 0, Bottom = 0 
StackView width = ScrollView width (priority low :250) 
StackView height = ScrollView height 

risposta lunga

In primo luogo, la struttura è buona, abbiamo:

UIScrollView 
    UIStackView (horizontal) 
     Subviews 

Così, per raggiungere l'obiettivo che dovrebbe:

• Centro della UIScrollView
• Impostare la contentSize del UIScrollView uguale al contenuto dimensione intrinseca del UIStackView

Ecco come fare:

Fase 1: Centro della frame of the UIScrollView

CenterY e CenterX vincoli usati per centrare il telaio della UIScrollView

Leading Space> = 0, Trailling Space> = 0, Top Space> = 0, Bottom Spac e> = 0 sono usati per impedire il telaio della UIScrollView per superare la cornice della vista genitore

Ho usato la dimensione intrinseca del segnaposto per non mostrare gli errori relativi al contenuto Dimensione dello UIScrollView (perché non abbiamo ancora le sottoview così il contentSize).

Ora, la cornice del nostro UIScrollView è OK, passare alla fase successiva :)

Fase 2: aggiungere l'UIStackView orizzontale

• Superiore, Inferiore, Leading , I vincoli finali vengono utilizzati per correggere UIStackView frame
• Altezza uguale e larghezza uguale utilizzata per calcolare e contentSize di UIScrollView

PS. Qualsiasi cambiamento nella cornice del UIStackView, cambiate la contentSize del UIScrollView

Fase 3: aggiungere subviews

perché usiamo Fill Distribution nel UIStackView tutti subviews deve avere una dimensione intrinseca contenuto (o altezza e larghezza vincoli (non preferito)). Ad esempio, se si utilizza Fill Equally, solo uno subview con dimensioni di contenuto intrinseco (o vincoli di altezza e larghezza (non preferiti)) sufficienti, le altre dimensioni di sottoview saranno uguali a questa.

Per esempio: vorrei aggiungere 3 etichette (si prega di rimuovere il segnaposto dimensione intrinseca del UIScrollView)

Funziona !! no, no, non provare ancora ad aggiungere quarte e cinque etichette :)

Perché?

Per comprendere calcoleremo il fotogramma di ciascun elemento della visualizzazione con due esempi:

Le dimensioni vista primaria: 200, 200 La prima etichetta dimensione contenuto intrinseco: 120, 50 la seconda etichetta intrinseca dimensioni del contenuto: 150, 50

primo esempio (solo la prima etichetta nel UIStackView)

• UIStackView dimensione intrinseca contenuto = 120, 50
• UIScrollView contentSize = 120, 50
• UIScrollView frame = 40, 75, 120, 50

Tutti i telai sono OK

Secondo esempio (con le due etichette)

• UIScrollView frame = 0, 0, 200, 50
• UIScrollView contentSize = 200, 50
• UIStackView dimensioni contenuto intrinseco = 200, 50

Quindi, il UIStackView non può mostrare correttamente le due etichette (perché la larghezza di UIStackView inferiore alla larghezza delle due etichette), e non abbiamo lo scroll perché, la larghezza del vincolo UIStackView è uguale alla larghezza di UIScrollView. Funziona quando la dimensione del contenuto intrinseco UIStackView è inferiore al frame massimo UIScrollView.

Per rimediare, si cambia la priorità del vincolo di larghezza per un valore inferiore rispetto al valore di priorità dimensione contenuto intrinseco UIStackView, e tutto funziona benissimo :)

Speranza che aiuta.

Code source