如何在 UICollectionView 的部分标题中动态添加标签和按钮？

Posted 2023-03-14

【中文标题】如何在 UICollectionView 的部分标题中动态添加标签和按钮？

【英文标题】：How to dynamically add labels and buttons in section header of UICollectionView?

【发布时间】：2016-06-17 05:07:43

【问题描述】：

请帮助我如何水平添加标签和水平添加类似的按钮，但每个按钮应该像另一个部分一样在每个标签的下方对齐。 这应该在 UICollectionView 的标题中动态发生，因为标签和按钮的数量取决于我的数据。

我想做一个 excel 类型的布局，我想在标题中显示上述控件。

提前致谢！

我已经做到了-

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

    UICollectionReusableView *reusableview = nil;

    if (kind == UICollectionElementKindSectionHeader) 

        DepartmentCollectionReusableView *headerView = [collectionView dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"HeaderView" forIndexPath:indexPath];

        for (int i=0; i<_officelist.count; i++) 

            UILabel *label = [[UILabel alloc] init];
            label.tag = i+1;
            label.text=[NSString stringWithFormat:@"%@",_officelist[i]];
            [self.roadmapCollectionView addSubview:label];
        

        reusableview = headerView;
    

    return reusableview;

OfficeList 是我的数组，其中包含我想在每个标签的索引值处显示的列表。

【问题讨论】：

能否请您提供您为达到上述效果而编写的代码，以便我们为您提供帮助？

查看我编辑的。

请修正语法，不清楚你在问什么。

【参考方案1】：

一切正常：-

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

    UICollectionReusableView *reusableView = [collectionView dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"HeaderView" forIndexPath:indexPath];

    CGFloat x=0,y=0;

    for (int i = 0;i<[_officelist count];i++)
    
        id val=[officeSize objectAtIndex:i];
        CGFloat val1=[val floatValue];
            UILabel *newLabel = [[UILabel alloc] initWithFrame:CGRectMake(x, 10,val1-1,35)];

            newLabel.text=[NSString stringWithFormat:@"%@",_officelist[i]];

            newLabel.textAlignment = NSTextAlignmentCenter;

            newLabel.backgroundColor = [UIColor greenColor];
            [self.roadmapCollectionView addSubview:newLabel];

        x=x+val1+1;
    
    for (int i=0; i<_departmentlist.count; i++) 

        dept=[_departmentlist objectAtIndex:i];
        id val=[officeSize objectAtIndex:i];
        CGFloat val1=[val floatValue];

        float val2=val1/[dept count];
            //NSLog(@"DEPT SIZE - %f",val2);

            for (int j = 0; j < [dept count]; j++)
            
                UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
                button.frame = CGRectMake(y, 50,val2-1, 25);
                [button setBackgroundColor:[UIColor yellowColor]];
                [button setTitleColor:[UIColor blueColor] forState:UIControlStateNormal];
                [button setTitle:[NSString stringWithFormat:@"%@",dept[j]] forState:UIControlStateNormal];

                [self.roadmapCollectionView addSubview:button];

                [deptSize addObject:[NSNumber numberWithFloat:y]];

                y=y+val2+1;

            


    return reusableView;

【参考方案2】：

UICollectionView 提供回调-

每当它要显示supplementaryView

 - (void)collectionView:(UICollectionView *)collectionView willDisplaySupplementaryView:(UICollectionReusableView *)view forElementKind:(NSString *)elementKind atIndexPath:(NSIndexPath *)indexPath

每当supplementaryView 滚动出屏幕时-

 - (void)collectionView:(UICollectionView *)collectionView didEndDisplayingSupplementaryView:(UICollectionReusableView *)view forElementOfKind:(NSString *)elementKind atIndexPath:(NSIndexPath *)indexPath

您需要在此处查看elementKind 参数。它有两个值UICollectionElementKindSectionHeader 和UICollectionElementKindSectionFooter。

我相信您需要使用 UICollectionElementKindSectionHeader 进行自定义。

希望对你有帮助。

更新：

如果UICollectionView 没有提供如上所述的动态自定义方法，推荐的方法是在情节提要本身中设计UICollectionElementKindSectionHeader。

您需要做的就是在视图层次结构中的collectionView 中拖动一个UICollectionReusableView。您可能还需要考虑为此设置一个自定义子类，并将IBOutlet 连接添加到不同的 UI 组件。

【讨论】：

我们试图在此补充视图中显示的任何标签和按钮都没有显示

您需要通过子类正确完成。请参阅我的更新答案。

【参考方案3】：

试试这个代码。

更新：尝试以编程方式为 uilabel 设置约束。

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


    UICollectionReusableView *reusableview = nil;

    if (kind == UICollectionElementKindSectionHeader) 

        DepartmentCollectionReusableView *headerView = [collectionView dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"HeaderView" forIndexPath:indexPath];

        UIFont * customFont = [UIFont fontWithName:ProximaNovaSemibold size:12];
        CGSize labelSize = [text sizeWithFont:customFont constrainedToSize:CGSizeMake(380, 20) lineBreakMode:NSLineBreakByTruncatingTail];

        UILabel *label = [[UILabel alloc]initWithFrame:CGRectMake(91, 15, labelSize.width, labelSize.height)];
        label.tag = indexPath.row;
        label.text=[NSString stringWithFormat:@"%@",_officelist[indexPath.row]];
        label.font = customFont;
        label.numberOfLines = 1;
        label.baselineAdjustment = UIBaselineAdjustmentAlignBaselines; 
        label.adjustsFontSizeToFitWidth = YES;
        label.adjustsLetterSpacingToFitWidth = YES;
        label.minimumScaleFactor = 10.0f/12.0f;
        fromLabel.clipsToBounds = YES;
        label.backgroundColor = [UIColor clearColor];
        label.textColor = [UIColor blackColor];
        label.textAlignment = NSTextAlignmentLeft;
        [self.roadmapCollectionView addSubview:label];
        reusableview = headerView;
    
    return reusableview;

我建议您在情节提要中创建一个 uiview，并在每次测量显示它必须充气时对其充气。

【讨论】：

我已经以编程方式为每个可能被夸大的 uilabel 设置了约束。我建议您不必以编程方式创建它，而是必须在情节提要中创建一个视图并每次都对其进行膨胀

不工作，还有一件事如果我们必须动态创建它

我们试图在此补充视图中显示的任何标签和按钮都没有显示