Auto-Sizing UICollectionView-Header

Question

Ich versuche, einen Detailbildschirm für eine To-Do-Liste Art von App zu machen. Hier ist, was das Detailbild sieht derzeit wie:

Dies ist ein UICollectionViewController ist, mit einem Kopfball. Die Kopfzeile enthält 2 UILabel Objekte und ein UITextView Objekt. Das Layout dieser Objekte wird von einer vertikalen UIStackView verwaltet. Ein UIView wird verwendet, um einen weißen Hintergrund festzulegen.

Ich habe einige Schwierigkeiten bei der Festlegung der Höhe dieser UICollectionReusableView zur Laufzeit. Jeder Rat wird geschätzt.

Answer 1

So können Sie benutzerdefinierte UICollectionViewReusableView mit automatischem Layout ohne die XIB-Datei behandeln.

1. Implementieren Sie die Delegatenmethode referenceSizeForHeaderInSection.
2. Instanziieren Sie die Ansicht, die Sie als Header-Ansicht verwenden.
3. Stellen Sie die Sichtbarkeit auf "Versteckt" ein, um ein Blitzen zu vermeiden.
4. Fügen Sie die Ansicht der Superansicht der Sammelansicht hinzu.
5. Legen Sie das Layout mithilfe des automatischen Layouts fest, um dem erwarteten visuellen Ergebnis der Kopfzeile zu entsprechen.
6. Invoke setNeedsLayout und layoutIfNeeded
7. Entfernen Sie den Blick von der Super

ACHTUNG: Ich bin kein großer Fan von dieser Lösung, da sie die benutzerdefinierte Ansicht auf die Superview jedes Mal der Kollektion fügt hinzu, um Berechnungen . Ich habe jedoch keine Leistungsprobleme bemerkt.

ACHTUNG # 2: Ich würde dies als eine vorübergehende Lösung behandeln und nach der Veröffentlichung zu ergänzenden Ansichten zur Selbstbemaßung migrieren.

Ich verwende PureLayout für Auto-Layout-Zwecke.

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, referenceSizeForHeaderInSection section: Int) -> CGSize { 

    let header = CustomHeaderView() 

     header.isHidden = true; 
     self.view.addSubview(header) 
     header.autoPinEdge(toSuperviewEdge: .leading) 
     header.autoPinEdge(toSuperviewEdge: .trailing) 
     header.autoPin(toTopLayoutGuideOf: self, withInset: 0) 
     header.setupHeader(withData: self.data) 
     header.setNeedsLayout() 
     header.layoutIfNeeded() 
     header.removeFromSuperview() 

     return header.frame.size 
} 

Answer 2

Dies ist ein bisschen ein Hack, aber scheint zu arbeiten.

// showhere to keep a reference 
UICollectionReusableView * _cachedHeaderView; 


- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath{ 

    if(!_cachedHeaderView){ 
     // dequeue the cell from storyboard 
     _cachedHeaderView = [collectionView dequeueReusableCellWithReuseIdentifier:[NSString stringWithFormat:@"header_cell"] forIndexPath:indexPath]; 

     // set captions/images on the header etc... 

     // tell the collectionview to redraw this section 
     [self.collectionView reloadSections:[NSIndexSet indexSetWithIndex:indexPath.section]]; 
    } 

    return _cachedHeaderView; 
} 


- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout referenceSizeForHeaderInSection:(NSInteger)section{ 

    // once there is a reference ot the view, use it to figure out the height 
    if(_cachedHeaderView){ 
     return [_cachedHeaderView systemLayoutSizeFittingSize:collectionView.bounds.size withHorizontalFittingPriority:UILayoutPriorityRequired verticalFittingPriority:UILayoutPriorityDefaultLow]; 

    } 

    // a placeholder value just to get the dequeueReusableCellWithReuseIdentifier to work 
    return CGSizeMake(collectionView.bounds.size.width, 100); 
}