Określanie jednego wymiaru komórek w UICollectionView za pomocą układu Auto

Wygląda na to, że to, o co prosisz, jest sposobem użycia UICollectionView do stworzenia układu takiego jak UITableView. Jeśli naprawdę tego chcesz, dobrym sposobem jest użycie niestandardowej podklasy UICollectionViewLayout (może coś w stylu sbtablelayout ).

Z drugiej strony, jeśli naprawdę pytasz, czy istnieje czysty sposób, aby to zrobić z domyślnym UICollectionViewFlowLayout, to wierzę, że nie ma sposobu. Nawet z samowyzwalającymi się komórkami iOS8, nie jest proste. Podstawowym problemem, jak mówisz, jest to, że mechanizm układu przepływu nie zapewnia sposobu, aby naprawić jeden wymiar, a drugi odpowiedzieć. (Ponadto, nawet jeśli można, istnieje dodatkowa złożoność wokół konieczności dwóch przejść układu do rozmiaru etykiet wielowierszowych. Może to nie pasować do tego, jak samorozmiar komórki chcą obliczyć wszystkie rozmiary za pomocą jednego wywołania do systemLayoutSizeFittingSize.)

Jeśli jednak nadal chcesz utworzyć układ podobny do tableview z układem przepływu, z komórkami, które określają swój własny rozmiar i reagują naturalnie na szerokość widoku kolekcji, oczywiście jest to możliwe. Nadal jest bałagan. Zrobiłem to za pomocą "sizing cell", tj. nie wyświetlanej UICollectionViewCell, którą kontroler przechowuje tylko do obliczania rozmiarów komórek.

Istnieją dwie części tego podejścia. Pierwsza część polega na tym, aby delegat widoku kolekcji obliczył prawidłowy rozmiar komórki, biorąc pod uwagę szerokość widoku kolekcji i używając komórki rozmiaru aby obliczyć wysokość komórki.

W uicollectionviewdelegateflowlayout zaimplementujesz metodę taką jak:

func collectionView(collectionView: UICollectionView,
  layout collectionViewLayout: UICollectionViewLayout,
  sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize
{
  // NOTE: here is where we say we want cells to use the width of the collection view
   let requiredWidth = collectionView.bounds.size.width

   // NOTE: here is where we ask our sizing cell to compute what height it needs
  let targetSize = CGSize(width: requiredWidth, height: 0)
  /// NOTE: populate the sizing cell's contents so it can compute accurately
  self.sizingCell.label.text = items[indexPath.row]
  let adequateSize = self.sizingCell.preferredLayoutSizeFittingSize(targetSize)
  return adequateSize
}

Spowoduje to, że widok kolekcji ustawi szerokość komórki na podstawie widoku zamykającej kolekcji, ale następnie poprosi komórkę o obliczenie wysokości.

Druga część polega na tym, aby komórka rozmiaru używała własnych ograniczeń AL do obliczania wysokości. Może to być trudniejsze niż powinno być, ze względu na sposób, w jaki multi-line UILabel ' s skutecznie wymagają dwuetapowego procesu układania. Praca jest wykonywana w metodzie preferredLayoutSizeFittingSize, która wygląda tak:

 /*
 Computes the size the cell will need to be to fit within targetSize.

 targetSize should be used to pass in a width.

 the returned size will have the same width, and the height which is
 calculated by Auto Layout so that the contents of the cell (i.e., text in the label)
 can fit within that width.

 */
 func preferredLayoutSizeFittingSize(targetSize:CGSize) -> CGSize {

   // save original frame and preferredMaxLayoutWidth
   let originalFrame = self.frame
   let originalPreferredMaxLayoutWidth = self.label.preferredMaxLayoutWidth

   // assert: targetSize.width has the required width of the cell

   // step1: set the cell.frame to use that width
   var frame = self.frame
   frame.size = targetSize
   self.frame = frame

   // step2: layout the cell
   self.setNeedsLayout()
   self.layoutIfNeeded()
   self.label.preferredMaxLayoutWidth = self.label.bounds.size.width

   // assert: the label's bounds and preferredMaxLayoutWidth are set to the width required by the cell's width

   // step3: compute how tall the cell needs to be

   // this causes the cell to compute the height it needs, which it does by asking the 
   // label what height it needs to wrap within its current bounds (which we just set).
   let computedSize = self.systemLayoutSizeFittingSize(UILayoutFittingCompressedSize)

   // assert: computedSize has the needed height for the cell

   // Apple: "Only consider the height for cells, because the contentView isn't anchored correctly sometimes."
   let newSize = CGSize(width:targetSize.width,height:computedSize.height)

   // restore old frame and preferredMaxLayoutWidth
   self.frame = originalFrame
   self.label.preferredMaxLayoutWidth = originalPreferredMaxLayoutWidth

   return newSize
 }

(ten kod jest zaadaptowany z przykładowego kodu Apple z przykładowego kodu sesji WWDC2014 w "Advanced Collection View".)

Kilka punktów do zauważenia. Używa metody layoutIfNeeded (), aby wymusić układ całej komórki, aby obliczyć i ustawić szerokość etykiety. Ale to nie wystarczy. Uważam, że należy również ustawić preferredMaxLayoutWidth, aby etykieta użyła tego szerokość z automatycznym układem. I tylko wtedy możesz użyć systemLayoutSizeFittingSize, aby komórka obliczyła jej wysokość, biorąc pod uwagę Etykietę.

Czy podoba mi się takie podejście? Nie!! Wydaje się zbyt skomplikowana i robi dwa razy więcej. Ale dopóki wydajność nie staje się problemem, wolę wykonać układ dwa razy w czasie wykonywania, niż zdefiniować go dwa razy w kodzie, co wydaje się być jedyną alternatywą.

Mam nadzieję, że w końcu komórki samoklejące będą działać inaczej i wszystko będzie prostsze.

Przykładowy projekt pokazujący go w pracy.

Ale dlaczego po prostu nie użyć komórek samoklejących?

Teoretycznie, nowe udogodnienia iOS8 dla "komórek samoklejących" powinny uczynić to zbędnym. Jeśli zdefiniowano komórkę z automatycznym układem (AL), widok kolekcji powinien być na tyle inteligentny, aby pozwalał na jego rozmiar i prawidłowe ułożenie. W praktyce nie widziałem żadnych przykładów, które pomogły w pracy z etykietami wielowierszowymi. Myślę, że to częściowo dlatego, że mechanizm samoklejący komórki jest nadal wadliwy.

Ale założę się, że to głównie z powodu zwykłej sztuczki układu Auto i etykiet, czyli tego, że UILabels wymagają zasadniczo dwuetapowego procesu układania. Nie jest dla mnie jasne, w jaki sposób można wykonać oba kroki z samoklejącymi się komórkami.

I jak mówiłem, to jest naprawdę praca dla innego layoutu. Jest częścią istoty flow layout, że pozycjonuje rzeczy, które mają rozmiar, a nie naprawia szerokość i pozwala im wybrać ich wysokość.

A co z preferredLayoutAttributesFittingattributes: ?

Metoda preferredLayoutAttributesFittingAttributes: to chyba czerwony śledź. To jest tylko tam, aby być używane z nowym mechanizmem SELF-sizing cell. Więc to nie jest odpowiedź, dopóki ten mechanizm jest zawodny.

A o co chodzi z systemlayoutSizeFittingSize:?

Dokumenty na systemLayoutSizeFittingSize: i systemLayoutSizeFittingSize:withHorizontalFittingPriority:verticalFittingPriority: sugerują, że należy tylko podaj UILayoutFittingCompressedSize i UILayoutFittingExpandedSize jako targetSize. Jednak sama sygnatura metody, komentarze nagłówka i zachowanie funkcji wskazują, że odpowiadają one dokładnej wartości parametru targetSize.

W rzeczywistości, jeśli ustawisz UICollectionViewFlowLayoutDelegate.estimatedItemSize, aby włączyć nowy mechanizm SELF-sizing cell, ta wartość wydaje się być przekazywana jako targetSize. I UILabel.systemLayoutSizeFittingSize wydaje się zwracać dokładnie te same wartości co UILabel.sizeThatFits. Jest to podejrzane, biorąc pod uwagę, że argument systemLayoutSizeFittingSize ma być rough target i argument to sizeThatFits: ma być maksymalnym ograniczeniem.

Więcej Zasobów

• http://www.objc.io/issue-3/advanced-auto-layout-toolbox.html
• http://devetc.org/code/2014/07/07/auto-layout-and-views-that-wrap.html
• kod dla WWDC2014 sesja 232, "Advanced User Interfaces with Collection Views"