我想实现一个可靠的系统来创建自定义的分组表格 View ,例如使用表格自定义样式的应用程序 ConvertBot。
http://i.stack.imgur.com/geAuw.png
使用将背景图像插入到单元格的 backgroundView 中,我会得到相同的效果,这是我正在使用的代码。
使用的代码
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *CellIdentifier = @"Cell";
UITableViewCell *cell = (UITableViewCell*)[tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if (cell == nil) {
cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] autorelease];
cell.textLabel.text = [NSString stringWithFormat:@"Cell Name %d %d",indexPath.row,indexPath.section];
cell.textLabel.backgroundColor = [UIColor clearColor];
//
// Create a custom background image view.
//
cell.backgroundView =
[[[UIImageView alloc] init] autorelease];
cell.selectedBackgroundView =
[[[UIImageView alloc] init] autorelease];
UIImage *rowBackground;
UIImage *selectionBackground;
NSInteger sectionRows = [self.tableView numberOfRowsInSection:[indexPath section]];
NSInteger row = [indexPath row];
if (row == 0 && row == sectionRows - 1)
{
rowBackground = [[UIImage imageNamed:@"TableSingleBackground.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(10, 10, 10, 10)];
selectionBackground = [[UIImage imageNamed:@"TableSingleBackgroundSelected.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(10, 10, 10, 10)];
}
else if (row == 0)
{
rowBackground = [[UIImage imageNamed:@"TableTopBackground.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(10, 10, 1, 10)];
selectionBackground = [[UIImage imageNamed:@"TableTopBackgroundSelected.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(10, 10, 1, 10)];
}
else if (row == sectionRows - 1)
{
rowBackground = [[UIImage imageNamed:@"TableBottomBackground.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(1, 10, 10, 10)];
selectionBackground = [[UIImage imageNamed:@"TableBottomBackgroundSelected.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(1, 10, 10, 10)];
}
else
{
rowBackground = [[UIImage imageNamed:@"TableMiddleBackground.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(1, 10, 1, 10)];
selectionBackground = [[UIImage imageNamed:@"TableMiddleBackgroundSelected.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(1, 10, 1, 10)];
}
((UIImageView *)cell.backgroundView).image = rowBackground;
((UIImageView *)cell.selectedBackgroundView).image = selectionBackground;
UIImage *indicatorImage = [UIImage imageNamed:@"DetailDisclosure.png"];
cell.accessoryView =
[[[UIImageView alloc]
initWithImage:indicatorImage]
autorelease];
}
return cell;
}
这是结果:
http://i.stack.imgur.com/EmwX7.png
您可以看到第一个单元格没有正确绘制。快速滚动导致此绘图问题,如何避免此问题?我想知道是否有更有效的解决方案,不影响性能且易于实现,例如自定义的 UITableViewCell 或类似的东西。
有什么建议吗?
最佳答案
当 tableView 没有重用已经创建的单元格时,您只是在创建新的单元格。您看到的是一个重复使用的单元格,它在创建时处于“中间”位置,但现在它在“顶部”位置重复使用而没有设置新图像。
我建议使用多个标识符,每种情况一个(单个、顶部、中间、底部):
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *singleIdentifier = @"SingleCell";
static NSString *topIdentifier = @"TopCell";
static NSString *middleIdentifier = @"MiddleCell";
static NSString *bottomIdentifier = @"BottomCell";
NSString *CellIdentifier = nil;
NSInteger sectionRows = [tableView numberOfRowsInSection:[indexPath section]];
NSInteger row = [indexPath row];
// Select the identifier
if (row == 0 && row == sectionRows - 1)
{
CellIdentifier = singleIdentifier;
}
else if (row == 0)
{
CellIdentifier = topIdentifier;
}
else if (row == sectionRows - 1)
{
CellIdentifier = bottomIdentifier;
}
else
{
CellIdentifier = middleIdentifier;
}
UITableViewCell *cell = (UITableViewCell*)[tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if (cell == nil) {
cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] autorelease];
cell.textLabel.text = [NSString stringWithFormat:@"Cell Name %d %d",indexPath.row,indexPath.section];
cell.textLabel.backgroundColor = [UIColor clearColor];
//
// Create a custom background image view.
//
cell.backgroundView =
[[[UIImageView alloc] init] autorelease];
cell.selectedBackgroundView =
[[[UIImageView alloc] init] autorelease];
UIImage *rowBackground;
UIImage *selectionBackground;
NSInteger sectionRows = [self.tableView numberOfRowsInSection:[indexPath section]];
NSInteger row = [indexPath row];
if (row == 0 && row == sectionRows - 1)
{
rowBackground = [[UIImage imageNamed:@"TableSingleBackground.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(10, 10, 10, 10)];
selectionBackground = [[UIImage imageNamed:@"TableSingleBackgroundSelected.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(10, 10, 10, 10)];
}
else if (row == 0)
{
rowBackground = [[UIImage imageNamed:@"TableTopBackground.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(10, 10, 1, 10)];
selectionBackground = [[UIImage imageNamed:@"TableTopBackgroundSelected.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(10, 10, 1, 10)];
}
else if (row == sectionRows - 1)
{
rowBackground = [[UIImage imageNamed:@"TableBottomBackground.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(1, 10, 10, 10)];
selectionBackground = [[UIImage imageNamed:@"TableBottomBackgroundSelected.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(1, 10, 10, 10)];
}
else
{
rowBackground = [[UIImage imageNamed:@"TableMiddleBackground.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(1, 10, 1, 10)];
selectionBackground = [[UIImage imageNamed:@"TableMiddleBackgroundSelected.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(1, 10, 1, 10)];
}
((UIImageView *)cell.backgroundView).image = rowBackground;
((UIImageView *)cell.selectedBackgroundView).image = selectionBackground;
UIImage *indicatorImage = [UIImage imageNamed:@"DetailDisclosure.png"];
cell.accessoryView =
[[[UIImageView alloc]
initWithImage:indicatorImage]
autorelease];
}
return cell;
}
关于objective-c - 如何使用图像创建自定义的分组 UITableView,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8657851/