使用 UIImage 和 UILabels 创建 UICollectionViewCell 会导致滚动缓慢 [英] Creating a UICollectionViewCell with UIImage and UILabels creates slow scrolling

查看:44
本文介绍了使用 UIImage 和 UILabels 创建 UICollectionViewCell 会导致滚动缓慢的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

I create a subview with a UIview (acts as header), a UIImage, and 10 UILabels. I'm putting these into a UICollectionView as cells.

完全设计后,滚动不顺畅.如果我删除所有 UILabels,它会平滑滚动.

When designed completely, it does not scroll smoothly. If i remove all the UILabels, it scrolls smoothly.

我假设它是缓慢的,因为 UICollectionView 按需加载,所以当它需要每个新单元格时,它必须绘制它以锁定主线程.

I'm assuming it's sluggish cause the UICollectionView loads on demand, so when it needs each new cell, it has to draw it which locks up the main thread.

是否只是 iOS 无法处理来创建它们的问题?如果是这样,还有其他方法可以将文本放入其中吗?

Is it just a matter that its too much for iOS to handle to create them? If so, is there another way I can put text into it?

我的手机是什么样子:

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

Here is DatasetFilterListPanelView, this creates the UIView that I put into the UICollectionViewCell. I did it this way cause I created this before I decided to use 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 给它.

Here is my UICollectionViewCell file, i just addSubview a DatasetFilterListPanelView to it.

@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 的按需加载单元格.

When I use the same panels in a UIScrollview, once they are all loaded and positioned, it will scroll smoothly. So it has to be the loading a cell on demand aspect of the UICollectionView.

我关注了这个 UICollectionView 教程

创建单元格:

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

    return datasetCell;
}

编辑 2:仪器跟踪:

推荐答案

好的,经过一番折腾,我找到了罪魁祸首:约束!CodaFI 是对的.我在面板中没有那么多限制,所以我认为这不是问题.

Ok, after much playing around I figured out the culprit: constraints! CodaFI was right. I didn't have that many constraints in the panel so i didn't think it could be the issue.

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

I created a nib file and removed autolayout and it now scrolls smoothly.

今天的经验教训:约束的计算速度很慢!

Lesson of the day: Constraints are slow to compute!

这篇关于使用 UIImage 和 UILabels 创建 UICollectionViewCell 会导致滚动缓慢的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆