Właśnie zacząłem uczyć się o UICollectionViews. Zastanawiam się, czy ktoś wie, jak określić liczbę kolumn w widoku kolekcji. Wartość domyślna to 3 (iPhone / portret). Przejrzałem dokumentację i nie mogę znaleźć zwięzłej odpowiedzi.
100
UICollectionView
zasadzie jako siatka, ponieważ wiem, że chcę tylko 4 kolumny. Robię to, nadając komórkom określony rozmiar, a odstępy między nimi mają określony rozmiar, aby widok kolekcji wyświetlał tylko 4 kolumny, bez względu na orientację. Czy to jest podobne do tego, czego potrzebujesz?Odpowiedzi:
CollectionViews są bardzo wydajne i mają swoją cenę. Wiele, wiele opcji. Jak powiedział omz:
Proponuję zaimplementować
<UICollectionViewDelegateFlowLayout>
protokół, dający dostęp do następujących metod, dzięki którym możesz mieć większą kontrolę nad układem swojegoUICollectionView
, bez potrzeby tworzenia podklasy:collectionView:layout:insetForSectionAtIndex:
collectionView:layout:minimumInteritemSpacingForSectionAtIndex:
collectionView:layout:minimumLineSpacingForSectionAtIndex:
collectionView:layout:referenceSizeForFooterInSection:
collectionView:layout:referenceSizeForHeaderInSection:
collectionView:layout:sizeForItemAtIndexPath:
Ponadto zaimplementowanie poniższej metody zmusi UICollectionView do zaktualizowania układu przy zmianie orientacji: (powiedzmy, że chcesz zmienić rozmiar komórek na poziomy i rozciągnąć)
Dodatkowo tutaj są 2 naprawdę dobre samouczki na temat
UICollectionViews
:http://www.raywenderlich.com/22324/beginning-uicollectionview-in-ios-6-part-12
http://skeuo.com/uicollectionview-custom-layout-tutorial
źródło
collectionView:layout:sizeForItemAtIndexPath:
należy obsługiwać oddzielnie wszystkie urządzenia?new GridLayoutManager(mContext, 4))
(4 kolumny), bardzo łatwo lub po prostu użyćLinearLayoutManager
(ma oczywiście tylko 1 kolumnę)W Swift 5 i iOS 12.3 możesz użyć jednej z 4 następujących implementacji , aby ustawić liczbę elementów w wierszu
UICollectionView
podczas zarządzania wstawkami i zmianami rozmiaru (w tym rotacją).# 1. Instacji
UICollectionViewFlowLayout
i przy użyciuUICollectionViewFlowLayout
„sitemSize
właściwośćColumnFlowLayout.swift:
CollectionViewController.swift:
# 2. Korzystanie
UICollectionViewFlowLayout
zitemSize
metody# 3. Korzystanie
UICollectionViewDelegateFlowLayout
zcollectionView(_:layout:sizeForItemAt:)
metody# 4. Instacji
UICollectionViewFlowLayout
i przy użyciuUICollectionViewFlowLayout
„sestimatedItemSize
właściwośćCollectionViewController.swift:
FlowLayout.swift:
Cell.swift:
źródło
Zaimplementowałem
UICollectionViewDelegateFlowLayout
na swoimUICollectionViewController
i nadpisałem metodę odpowiedzialną za określenie rozmiaru komórki. Następnie wziąłem szerokość ekranu i podzieliłem ją na wymagania dotyczące kolumny. Na przykład chciałem mieć 3 kolumny na każdym rozmiarze ekranu. Oto jak wygląda mój kod -źródło
Rozwinięcie odpowiedzi Nooba:
Pozwala to na dowolne odstępy między komórkami. Zakłada
Int
zmienną składową o nazwie,numberOfItemsPerRow
a także, że wszystkie komórki są kwadratowe i mają ten sam rozmiar. Jak zauważono w odpowiedzi jhilgert00, musimy również reagować na zmiany orientacji, ale teraz używamy wartości,viewWillTransitionToSize
którawillRotateToInterfaceOrientation
jest amortyzowana.źródło
Oto działający kod dla Swift 3, aby mieć układ dwóch kolumn:
Możesz zmienić „nbCol” na żądaną liczbę kolumn.
źródło
Jeśli jesteś leniwy używając delegate.
PS: Należy również wywołać po rotacji
źródło
Zaktualizowano do Swift 3:
Zamiast układu przepływu wolę używać układu niestandardowego dla określonego numeru kolumny i numeru wiersza. Ponieważ:
Normalna komórka i komórka nagłówka: (Dodaj UILabel jako IBOutlet do swojego xib):
Układ niestandardowy:
CollectionView:
Użyj CollectionView z ViewController:
Wreszcie możesz mieć fantazyjny CollectionView!
źródło
Ponieważ
UICollectionView
jest tak elastyczny, istnieje wiele sposobów zmiany liczby kolumn w zależności od rodzaju używanego układu.UICollectionViewFlowLayout
(Co jest chyba to, co pracujesz z) nie określa liczbę kolumn bezpośrednio (ponieważ zależy rozmiar / orientację). Najłatwiejszym sposobem zmiany byłoby ustawienieitemSize
właściwości i / lubminimumInteritemSpacing
/minimumLineSpacing
.źródło
Swift 3.0. Działa dla kierunków przewijania w poziomie i pionie oraz dla zmiennych odstępów
Określ liczbę kolumn
Skonfiguruj,
flowLayout
aby renderować określonenumberOfColumns
źródło
Zaktualizowano do Swift 5+ iOS 13
Szacunkowy rozmiar widoku kolekcji nie może wynosić zero
Zadeklaruj margines dla komórki
W viewDidLoad configure
minimumInteritemSpacing
,minimumLineSpacing
,sectionInset
Metoda UICollectionViewDataSource
sizeForItemAt
źródło
Chodzi o układ, który chcesz narysować. Możesz utworzyć niestandardową klasę dziedziczącą po UICollectionViewFlowLayout. Obecnie nie ma żadnej bezpośredniej metody ustawiania kolumn. Jeśli chcesz osiągnąć taką funkcjonalność, musisz to zrobić ręcznie. Musisz obsłużyć to w niestandardowej klasie układu przepływu.
Teraz pojawi się pytanie, jak to zrobisz? Jeśli nie chcesz zakłócać ramki komórki, możesz ją dostosować
Innym sposobem jest podanie własnych pozycji komórek. Zastępując poniżej dwie metody, które zostaną wywołane podczas tworzenia układu.
UICollectionViewLayoutAttributes to klasa, która zajmuje się pozycją komórki, ramką, Zindex itp
źródło
Ta odpowiedź dotyczy swift 3.0 ->
najpierw zgodne z protokołem:
następnie dodaj te metody:
źródło
Chciałem tylko dołączyć do odpowiedzi Imanou Petit # 2. Aby upewnić się, że marginesy są dokładne niezależnie od szerokości ekranu, używam solwera iteracyjnego z żądanym marginesem i liczbą kolumn jako danymi wejściowymi. Dodałem również flagę kierunkową wskazującą, gdzie ich końcowe marginesy będą porównywane z celem.
Iteracyjny solver jest pokazany poniżej i zwraca cellWidth i margin.
Ja to tak nazywam:
Następnie stosuję wartości cellWidth i margin do układu przepływu jako takie:
{func collectionView (_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {return CGSize (width: cellWidth, height: cellWidth)}
}
Mam nadzieję że to pomoże. Prawdopodobnie istnieje łatwiejszy sposób na upewnienie się, że marginesy są dokładne, ale jest to jedna z metod. Ponadto ten kod nie został przetestowany pod kątem urządzeń, które umożliwiają obracanie widoków kolekcji.
Dzięki,
źródło
idealnym rozwiązaniem jest użycie UICollectionViewDelegateFlowLayout, ale możesz łatwo obliczyć szerokość komórki i podzielić ją na żądaną liczbę kolumn
trudne jest zrobienie szerokości bez ułamka
źródło
Zrobiłem układ kolekcji.
Aby separator był widoczny, ustaw kolor tła widoku kolekcji na szary. Jeden rząd na sekcję.
Zastosowanie:
Układ:
źródło
Spróbuj tego, działa idealnie dla mnie,
Wykonaj poniższe kroki:
1. Zdefiniuj wartości w pliku .h.
LUB
2. Dodaj kod do kolekcji Zobacz metody źródła danych Układ, jak poniżej,
Mam nadzieję, że komuś to pomoże.
źródło
Najpierw dodaj UICollectionViewDelegateFlowLayout jako protokół.
Następnie:
źródło