UICollectionView。根據UIButton的文本寬度，為每個單元格應用動態寬度

我知道有很多關于這個問題的類似話題。雖然，我已經先試了一下，但沒有解決我的問題。

正如下面的截圖所示，我嘗試用UICollectionView來應用一個水平滾動視圖。每個單元格包含一個具有動態文本長度的UIB按鈕。

問題是一些單元格的寬度是錯誤的/短的。我嘗試了一個解決方案，首先獲得每個NSString文本的大小，然后在sizeForItemAt委托方法中設定它。然而這并不奏效，即使我手動添加了一個padding值，文本仍然在縮小 CGSize sizeWithPadding = CGSizeMake(size.width 30, 40) 。

經過數小時的搜索和測驗，我仍然不知道如何使其正確。歡迎任何建議。

資料源=NSString陣列

[NSMutableArray arrayWithObjects: @"所有", @"計算機編程", @"Taylor Swift", @"電影", @"飛機", @"籃球", @"鋼鐵俠", @"足球", @"ABC", @"功夫", @"東華", nil]

一個UIView作為collectionView的容器。

- （void）setViews {
    UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc] init]。
    layout.scrollDirection = UICollectionViewScrollDirectionHorizontal;
    layout.minimumLineSpacing = CGFLOAT_MAX;
    self.collectionView = [[UICollectionView alloc] initWithFrame:CGRectZero collectionViewLayout:layout] 。
    self.collectionView.translatesAutoresizingMaskIntoConstraints = false;
    self.collectionView.backgroundColor = UIColor.systemBackgroundColor。
    _collectionView.dataSource = self。
    _collectionView.delegate = self;
    [_collectionView registerClass:MenuBarCell.class forCellWithReuseIdentifier:menuBarCellID] 。

    [self addSubview:self.collectionView] 。
    
    [self.collectionView.topAnchor constraintEqualToAnchor:self.topAnchor].active = true;
    [self.collectionView.leadingAnchor constraintEqualToAnchor:self.leadingAnchor].active = true;
    [self.collectionView.trailingAnchor constraintEqualToAnchor:self.trailingAnchor].active = true。
    [self.collectionView.heightAnchor constraintEqualToAnchor:self.heightAnchor].active = true;
}

# pragma mark - collectionView dataSource
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger) section {
    return _menuBarArray.count。
}

- (__kindof UICollectionViewCell *)collectionView: (UICollectionView *)collectionView cellForItemAtIndexPath: (NSIndexPath *)indexPath {
    MenuBarCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:menuBarCellID forIndexPath:indexPath] 。
    NSString *model = _menuBarArray[indexPath.item];
    [cell configure:model];
    
    return cell。
}

- (CGSize)collectionView:(UICollectionView *)collectionView布局。 (UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath: (NSIndexPath *)indexPath {

    CGSize size = [self.menuBarArray[indexPath.item] sizeWithAttributes:NULL] 。
    NSLog(@"size: width = %f"/span>, size.width)。
    CGSize sizeWithPadding = CGSizeMake（size.width   30, 40）。
    
    return sizeWithPadding;
}

我的UICollectionView自定義單元格

- （void）setViews {
    [super setViews]。
    
    self.contentView.backgroundColor = UIColor.systemYellowColor。
    
    //創建按鈕。
    _button = [UIButton buttonWithType:UIButtonTypeCustom]。
    _button.translatesAutoresizingMaskIntoConstraints = false;
    _button.layer.cornerRadius = 15;
    _button.layer.masksToBounds = true;
    [_button setBackgroundColor:[UIColor colorWithWhite:0.92 alpha:1] ]。
    [_button setTitleColor:UIColor.labelColor forState:UIControlStateNormal] 。
    [_button setTitleColor:UIColor.buttonTitleHighlighted forState:UIControlStateHighlighted] 。
    
    [self.contentView addSubview:_button] 。
    
    //設定約束條件。
    [_button.centerXAnchor constraintEqualToAnchor:self.contentView.centerXAnchor].active = true;
    [_button.centerYAnchor constraintEqualToAnchor:self.contentView.centerYAnchor].active = true;
    [_button.widthAnchor constraintEqualToAnchor:self.contentView.widthAnchor].active = true;
    [_button.heightAnchor constraintLessThanOrEqualToAnchor:self.contentView.heightAnchor].active = true;
}

- (void)configure: (NSString *) model {
    [_button setTitle:model forState:UIControlStateNormal] 。
}

uj5u.com熱心網友回復：

有幾個地方不對......

接下來，你沒有顯示你約束 "容器 "視圖的代碼，但我假設它是這樣的：

- （void）viewDidLoad {
    [super viewDidLoad] 。

    menuBarView = [MenuBarView new];

    menuBarView.translatesAutoresizingMaskIntoConstraints = NO;
    
    [self.view addSubview:menuBarView] 。
    
    UILayoutGuide *g = [self.view safeAreaLayoutGuide] 。
    [NSLayoutConstraint activateConstraints:@[
        [menuBarView.leadingAnchor constraintEqualToAnchor:g.leadingAnchor constant:0.0] 。
        [menuBarView.trailingAnchor constraintEqualToAnchor:g.trailingAnchor constant:0.0] 。
        [menuBarView.topAnchor constraintEqualToAnchor:g.topAnchor constant:4.0] 。
        [menuBarView.heightAnchor constraintEqualToConstant:42.0] 。
    ]];

}

你的UICollectionViewFlowLayout應該是這樣的思路：

UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc] init] 。
layout.scrollDirection = UICollectionViewScrollDirectionHorizontal;

//單元格之間的間距。
layout.minimumLineSpacing = 8.0。

//防止最后一個單元格被切斷。
layout.minimumInteritemSpacing = layout.minimumLineSpacing。

//必須有一個預估的大小//無關緊要，但需要小于預期。
layout.improvedItemSize = CGSizeMake(10, 10) 。

然后像這樣配置你的單元格類：

結果應該是這樣的（我給 "容器 "視圖一個藍色的背景，這樣我們就可以看到它）：

標籤：

上一篇：沒有可見的UITabBar的@介面setScrollEdgeAppearance

下一篇：如何在表視圖中添加目錄樹？