ios - 使用 UIImage 和 UILabels 创建 UICollectionViewCell 会导致滚动缓慢

Question

我创建了一个带有 UIview(充当标题)、一个 UIImage 和 10 个 UILabel 的 subview 。我将这些作为单元格放入 UICollectionView 中。

完全设计时，它不会平滑滚动。如果我删除所有 UILabel，它会平滑滚动。

我假设它缓慢导致 UICollectionView 按需加载，因此当它需要每个新单元格时，它必须绘制它，从而锁定主线程。

仅仅是iOS无法处理创建它们的问题吗？如果是这样，还有其他方法可以将文本放入其中吗？

我的手机是什么样子的:



这是 DatasetFilterListPanelView，它创建了我放入 UICollectionViewCell 的 UIView。我这样做是因为我在决定使用 UICollectionView 之前创建了它。

@implementation DatasetFilterListPanelView

-(id)initWithFrame:(CGRect)frame {
    if (self = [super initWithFrame:frame]) {

        self.translatesAutoresizingMaskIntoConstraints = FALSE;

        UIView *contentView = [self createContentView];

        [self addSubview:contentView];

        [self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[contentView]|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(contentView)]];
        [self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[contentView]|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(contentView)]];
    }

    return self;
}

-(UIView *) createContentView {
    UIView *contentView = [[UIView alloc] initWithFrame:self.frame];
//    contentView.translatesAutoresizingMaskIntoConstraints = FALSE;
    contentView.backgroundColor = [UIColor myDarkGrayColor];

    UIView *headerView = [self createHeaderView];

    [contentView addSubview:headerView];

    [contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[headerView]|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(headerView)]];
    [contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[headerView]" options:0 metrics:nil views:NSDictionaryOfVariableBindings(headerView)]];

    UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"gear12.png"]];
    imageView.translatesAutoresizingMaskIntoConstraints = FALSE;
    imageView.backgroundColor = [UIColor blueColor];
    self.imageView = imageView;

    [imageView addConstraint:[NSLayoutConstraint constraintWithItem:imageView attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:imageView attribute:NSLayoutAttributeWidth multiplier:1 constant:0]];

    [contentView addSubview:imageView];

    [contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[imageView]" options:0 metrics:nil views:NSDictionaryOfVariableBindings(imageView)]];
    [contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[headerView]-[imageView]-|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(headerView, imageView)]];

    UILabel *acresLabel = [self createLabelWithTitle:@"Label01:" andFont:[UIFont fontWithName:HELVETICA_FONT_STYLE_BOLD size:12]];
    [contentView addSubview:acresLabel];

    UILabel *addedLabel = [self createLabelWithTitle:@"Label02:" andFont:[UIFont fontWithName:HELVETICA_FONT_STYLE_BOLD size:12]];
    [contentView addSubview:addedLabel];

    UILabel *typeLabel = [self createLabelWithTitle:@"Label03:" andFont:[UIFont fontWithName:HELVETICA_FONT_STYLE_BOLD size:12]];
    [contentView addSubview:typeLabel];

    UILabel *zonesLabel = [self createLabelWithTitle:@"Label04:" andFont:[UIFont fontWithName:HELVETICA_FONT_STYLE_BOLD size:12]];
    [contentView addSubview:zonesLabel];

    UILabel *sceneLabel = [self createLabelWithTitle:@"Label05:" andFont:[UIFont fontWithName:HELVETICA_FONT_STYLE_BOLD size:12]];
    [contentView addSubview:sceneLabel];

    UILabel *acresValueLabel = [self createLabelWithTitle:@"Data" andFont:[UIFont fontWithName:HELVETICA_FONT_STYLE size:12]];
    acresValueLabel.textAlignment = NSTextAlignmentLeft;
    [contentView addSubview:acresValueLabel];

    UILabel *addedValueLabel = [self createLabelWithTitle:@"Data" andFont:[UIFont fontWithName:HELVETICA_FONT_STYLE size:12]];
    addedValueLabel.textAlignment = NSTextAlignmentLeft;
    [contentView addSubview:addedValueLabel];

    UILabel *typeValueLabel = [self createLabelWithTitle:@"Name" andFont:[UIFont fontWithName:HELVETICA_FONT_STYLE size:12]];
    typeValueLabel.textAlignment = NSTextAlignmentLeft;
    [contentView addSubview:typeValueLabel];

    UILabel *zonesValueLabel = [self createLabelWithTitle:@"Data" andFont:[UIFont fontWithName:HELVETICA_FONT_STYLE size:12]];
    zonesValueLabel.textAlignment = NSTextAlignmentLeft;
    [contentView addSubview:zonesValueLabel];

    UILabel *sceneValueLabel = [self createLabelWithTitle:@"Name" andFont:[UIFont fontWithName:HELVETICA_FONT_STYLE size:12]];
    sceneValueLabel.textAlignment = NSTextAlignmentLeft;
    [contentView addSubview:sceneValueLabel];


    NSDictionary *views = NSDictionaryOfVariableBindings(headerView, imageView, acresLabel, acresValueLabel, addedLabel, addedValueLabel, typeLabel, typeValueLabel, zonesLabel, zonesValueLabel, sceneLabel, sceneValueLabel);

    [contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[headerView]-[acresLabel]"
                                                                        options:0
                                                                        metrics:nil
                                                                          views:views]] ;

    [contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[acresLabel]-[addedLabel(==acresLabel)]-[typeLabel(==acresLabel)]-[zonesLabel(==acresLabel)]-[sceneLabel(==acresLabel)]-|"
                                                                        options:NSLayoutFormatAlignAllRight
                                                                        metrics:0
                                                                          views:views]];

    [contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[acresValueLabel]-[addedValueLabel(==acresLabel)]-[typeValueLabel(==acresLabel)]-[zonesValueLabel(==acresLabel)]-[sceneValueLabel(==acresLabel)]-|"
                                                                        options:NSLayoutFormatAlignAllLeft
                                                                        metrics:nil
                                                                          views:views]];

    [contentView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:[imageView]-20-[acresLabel]-[acresValueLabel]"  options:0  metrics:nil  views:views]];

    return contentView;
}

-(UIView *)createHeaderView {
    UIView *view = [UIView new];
    view.translatesAutoresizingMaskIntoConstraints = FALSE;
    view.backgroundColor = [UIColor blueColor];
    view.clipsToBounds = YES;

    [view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[view(30)]" options:0 metrics:nil views:NSDictionaryOfVariableBindings(view)]];

    UILabel *title = [UILabel new];
    title.translatesAutoresizingMaskIntoConstraints = FALSE;
    title.text = @"Default text";
    title.font = [UIFont fontWithName:HELVETICA_FONT_STYLE_BOLD size:14];
    title.textColor = [UIColor whiteColor];
    title.backgroundColor = [UIColor clearColor];
    self.headerLabel = title;

    [view addSubview:title];

    [view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[title]" options:0 metrics:nil views:NSDictionaryOfVariableBindings(title)]];
    [view addConstraint:[NSLayoutConstraint constraintWithItem:title attribute:NSLayoutAttributeCenterY relatedBy:NSLayoutRelationEqual toItem:view attribute:NSLayoutAttributeCenterY multiplier:1 constant:0]];

    self.headerGradient = [UIColor grayGradient];
    self.headerGradient.frame = CGRectMake(0, 0, 360, 30);

    [view.layer insertSublayer:self.headerGradient atIndex:0];

    return view;
}

-(UILabel *)createLabelWithTitle:(NSString *)title andFont:(UIFont *)font; {
    UILabel *label = [UILabel new];
    label.translatesAutoresizingMaskIntoConstraints = FALSE;
    label.text = title;
    label.font = font;
    label.textAlignment = NSTextAlignmentRight;
    label.textColor = [UIColor whiteColor];
    label.backgroundColor = [UIColor clearColor];

    return label;
}

这是我的 UICollectionViewCell 文件，我只是 addSubview一个 DatasetFilterListPanelView 到它。

@implementation DatasetViewCell

- (id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {

        [self addSubview:[[DatasetFilterListPanelView alloc] initWithFrame:CGRectMake(0, 0, 360, 160)]];
    }
    return self;
}

当我在 UIScrollview 中使用相同的面板时，一旦它们全部加载并定位，它将平滑滚动。所以它必须是 UICollectionView 的按需加载单元格。

我关注了 this UICollectionView Tutorial

编辑:创建单元格:

-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
    DatasetViewCell *datasetCell = [collectionView dequeueReusableCellWithReuseIdentifier:DatasetCellIdentifier forIndexPath:indexPath];

    return datasetCell;
}

编辑 2:仪器跟踪:

Answer 1

好吧，在玩了很多之后，我发现了罪魁祸首:约束! CodaFI 是对的。我在小组中没有那么多限制，所以我认为这不是问题所在。

我创建了一个 nib 文件并删除了自动布局，它现在可以平滑滚动。

每日一课:约束的计算速度很慢!