ios - UICollectionView 上的可重用性问题
<p><p>我曾使用过 <code>UITableView</code>，但我从未在我的应用程序中使用过 <code>UICollectionView</code>。所以我想以编程方式创建 <code>UICollectionView</code>。</p>
<p>以下是我的代码:</p>
<pre><code>UICollectionViewFlowLayout *layout =[ init];
_collectionView=[ initWithFrame:CGRectMake(0, 43, self.view.frame.size.width, self.view.frame.size.height - 84) collectionViewLayout:layout];
;
;
forCellWithReuseIdentifier:@"cellIdentifier"];
layout.sectionInset = UIEdgeInsetsMake(5, 5, 5, 5);
layout.minimumInteritemSpacing = 5;
;
;
</code></pre>
<p>委托(delegate)和数据源方法。</p>
<pre><code>#pragma mark -
#pragma mark - UITableView Delegate Methods
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
{
return 15;
}
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
UICollectionViewCell *cell = ;
if (cell.selected)
cell.backgroundColor = ; // highlight selection cell
else
cell.backgroundColor = ]; // Default Cell
UIImageView *imgPhoto = [ init];
imgPhoto.userInteractionEnabled = YES;
imgPhoto.backgroundColor = ;
imgPhoto.frame =CGRectMake(3.5, 5, 90, 80);
imgPhoto.clipsToBounds = YES;
imgPhoto.image = ;
;
UILabel *lblCategoryTitle = [ init];
];
lblCategoryTitle.textAlignment = NSTextAlignmentCenter;
lblCategoryTitle.frame = CGRectMake(3.5, 90, 90, 24);
lblCategoryTitle.textColor = ;
lblCategoryTitle.text = @"Product 1";
lblCategoryTitle.backgroundColor = ;
lblCategoryTitle.numberOfLines = 2;
;
return cell;
}
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath
{
return CGSizeMake(97, 118);
}
-(void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{
UICollectionViewCell *datasetCell =;
datasetCell.backgroundColor = ; // highlight selection
}
-(void)collectionView:(UICollectionView *)collectionView didDeselectItemAtIndexPath:(NSIndexPath *)indexPath {
UICollectionViewCell *datasetCell =;
datasetCell.backgroundColor = ]; // default cell
}
</code></pre>
<p>然后我的屏幕看起来像</p>
<p> <img src="/image/jgYgB.png" alt="enter image description here"/> </p>
<p><strong>问题 1 -</strong>查看上面的屏幕，您会看到第 1 和第 3 项看起来很模糊<em>(请参阅 <strong>产品 1</strong>)</em> 然后是第 2 项/中间项目？为什么会这样？ </p>
<p>每当我向上/向下滚动 <code>UICollectionView</code> 时，项目都会被覆盖，查看下一张图片</p>
<p> <img src="/image/eQ89W.png" alt="enter image description here"/> </p>
<p>看了这张图片后，根据我对 <code>UITableView</code> 的经验，它的发生是因为 <code>UICollectionView</code> 的单元格的可重用性。 </p>
<p><strong>问题 2 -</strong> 那我该如何解决呢？</p>
<p>请给我你的建议并帮助我解决这个问题。</p>
<p><strong>已编辑:</strong> <em>(<strong>@Dima</strong> 的建议)</em></p>
<p>自定义单元格</p>
<h1>.h 文件</h1>
<pre><code>#import <UIKit/UIKit.h>
@interface customeGridCell : UICollectionViewCell
@property (nonatomic, strong) UIImageView *imgPhoto;
@property (nonatomic, strong) UILabel *lblCategoryTitle;
@end
</code></pre>
<h1>.m 文件</h1>
<pre><code>#import "customeGridCell.h"
@implementation customeGridCell
- (id)initWithFrame:(CGRect)frame
{
self = ;
if (self)
{
self.imgPhoto = [ init];
self.imgPhoto.userInteractionEnabled = YES;
self.imgPhoto.backgroundColor = ;
self.imgPhoto.frame =CGRectMake(3.5, 5, 90, 80);
;
self.lblCategoryTitle = [ init];
];
self.lblCategoryTitle.textAlignment = NSTextAlignmentCenter;
self.lblCategoryTitle.frame = CGRectMake(3.5, 90, 90, 24);
self.lblCategoryTitle.textColor = ;
self.lblCategoryTitle.backgroundColor = ;
self.lblCategoryTitle.numberOfLines = 2;
;
}
return self;
}
</code></pre>
<p>及<code>cellForItemAtIndexPath</code>的代码</p>
<pre><code>- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
customeGridCell *cell = ;
if (cell.selected)
cell.backgroundColor = ; // highlight selection cell
else
cell.backgroundColor = ]; // Default Cell
cell.imgPhoto.image =;
cell.lblCategoryTitle.text = @"Product 1";
return cell;
}
</code></pre></p>
<br><hr><h1><strong>Best Answer-推荐答案</ strong></h1><br>
<p><p>问题出在您的 <code>collectionView:cellForItemAtIndexPath:</code> 方法中。每次重用单元格时，您都在添加这些 subview ，彼此叠加。 </p>
<p>您应该创建一个 <code>UICollectionViewCell</code> 子类并将所有您想要的额外 subview 添加到它的初始化程序中。这将确保它们只被添加一次。</p>
<p><strong>示例代码:</strong></p>
<p>这是一个示例，说明如何将 <code>UICollectionViewCell</code></p> 子类化
<pre><code>@interface MyCustomCell : UICollectionViewCell
@property (nonatomic, strong) UILabel *customLabel;
@property (nonatomic, strong) UIImageView *customImageView;
@end
// in implementation file
- (id)initWithFrame:(CGRect)frame
{
self = ;
if (self)
{
// initialize label and imageview here, then add them as subviews to the content view
}
return self;
}
</code></pre>
<p>然后，当您抓取一个单元格时，您只需执行以下操作:</p>
<pre><code>- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
MyCustomCell *cell = ;
if (cell.selected)
cell.backgroundColor = ; // highlight selection cell
else
cell.backgroundColor = ]; // Default Cell
cell.customImageView.image = // whatever
cell.customLabel.text = // whatever
return cell;
}
</code></pre></p>
<p style="font-size: 20px;">关于ios - UICollectionView 上的可重用性问题，我们在Stack Overflow上找到一个类似的问题：
<a href="https://stackoverflow.com/questions/22678841/" rel="noreferrer noopener nofollow" style="color: red;">
https://stackoverflow.com/questions/22678841/
</a>
</p>
页:
[1]