Как имитировать стиль заголовка UITableView UITableViewStylePlain
Мое приложение использует сокращения в заголовках заголовков раздела UITableView
, которые трудно произнести для VoiceOver. Поскольку мне нужно сделать эти заголовки произносимыми VoiceOver, мне нужно указать заголовок заголовка раздела accessibilityLabel
.
Кажется, что единственный способ сделать это - создать пользовательскую секцию заголовка раздела. Я хотел бы подражать стандарту Apple UIKit, предоставленному стилем для этих настраиваемых заголовков разделов, но я не уверен, как эмулировать подробный вид этого элемента Apple.
Каков наилучший подход для имитации стиля заголовка раздела UITableViewStylePlain
?
Обновление: Мне хорошо известно, как создать пользовательскую ячейку заголовка. То, что я ищу, - это метод, который точно имитирует внешний вид стиля ячейки заголовка, предоставленный Apple для явных заголовков секции UITableView.
Ответы
Ответ 1
Если кому-то все еще интересно, у меня это выглядит довольно чертовски близко со следующим кодом (с использованием изображений Mark Adams из вышеприведенного комментария, но я немного изменил их размер, так как мое приложение также имеет ландшафтный режим):
- (UIView *)tableView:(UITableView *)tbl viewForHeaderInSection:(NSInteger)section
{
UIView* sectionHead = [[UIView alloc] initWithFrame:CGRectMake(0, 0, tbl.bounds.size.width, 18)];
sectionHead.backgroundColor = [UIColor colorWithWhite:0 alpha:0];
sectionHead.userInteractionEnabled = YES;
sectionHead.tag = section;
UIImageView *headerImage = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"PlainTableViewSectionHeader.png"]];
headerImage.contentMode = UIViewContentModeScaleAspectFit;
[sectionHead addSubview:headerImage];
[headerImage release];
UILabel *sectionText = [[UILabel alloc] initWithFrame:CGRectMake(10, 2, tbl.bounds.size.width - 10, 18)];
sectionText.text = text;
sectionText.backgroundColor = [UIColor clearColor];
sectionText.textColor = [UIColor whiteColor];
sectionText.shadowColor = [UIColor darkGrayColor];
sectionText.shadowOffset = CGSizeMake(0,1);
sectionText.font = [UIFont boldSystemFontOfSize:18];
[sectionHead addSubview:sectionText];
[sectionText release];
return [sectionHead autorelease];
}
Ответ 2
Здесь выполняется реализация подкласса UILabel, который программно имитирует фон:
UITableViewStandardHeaderLabel.h
#import <UIKit/UIKit.h>
@interface UITableViewStandardHeaderLabel : UILabel
@property (nonatomic) CGFloat topInset;
@property (nonatomic) CGFloat leftInset;
@property (nonatomic) CGFloat bottomInset;
@property (nonatomic) CGFloat rightInset;
@end
UITableViewStandardHeaderLabel.m:
/*!
* @class UITableViewStandardHeaderLabel
* @brief Reimplementation of the UILabel used for a standard UITableView group headers for customization purposes
*/
@implementation UITableViewStandardHeaderLabel
@synthesize topInset, leftInset, bottomInset, rightInset;
- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
self.backgroundColor = [UIColor clearColor];
}
return self;
}
- (void)drawTextInRect:(CGRect)rect
{
UIEdgeInsets insets = {self.topInset, self.leftInset, self.bottomInset, self.rightInset};
return [super drawTextInRect:UIEdgeInsetsInsetRect(rect, insets)];
}
- (void)drawRect:(CGRect)rect
{
CGContextRef context = UIGraphicsGetCurrentContext();
CGGradientRef backgroundGradient;
CGColorSpaceRef rgbColorspace;
size_t num_locations = 2;
CGFloat locations[2] = { 0.0f, 1.0f };
CGFloat components[8] = { 144.0f/255.0f, 159.0f/255.0f, 171.0f/255.0f, 1.0f,
/* start */ 183.0f/255.0f, 192.0f/255.0f, 200.0f/255.0f, 1.0f /* end */ };
rgbColorspace = CGColorSpaceCreateDeviceRGB();
backgroundGradient = CGGradientCreateWithColorComponents(rgbColorspace, components, locations, num_locations);
CGRect currentBounds = self.bounds;
CGPoint topCenter = CGPointMake(CGRectGetMidX(currentBounds), CGRectGetMinY(currentBounds));
CGPoint bottomCenter = CGPointMake(CGRectGetMidX(currentBounds), CGRectGetMaxY(currentBounds));
CGContextDrawLinearGradient(context, backgroundGradient, topCenter, bottomCenter, 0);
UIColor *topBorderLineColor = [UIColor colorWithRed:113.0f/255.0f green:125.0f/255.0f blue:133.0f/255.0f alpha:1.0];
UIColor *secondLineColor = [UIColor colorWithRed:165.0f/255.0f green:177.0f/255.0f blue:187.0f/255.0f alpha:1.0];
UIColor *bottomBorderLineColor = [UIColor colorWithRed:151.0f/255.0f green:157.0f/255.0f blue:164.0f/255.0f alpha:1.0];
[topBorderLineColor setFill];
CGContextFillRect(context, CGRectMake(0, 0, CGRectGetMaxX(currentBounds), 1));
[bottomBorderLineColor setFill];
CGContextFillRect(context, CGRectMake(0, CGRectGetMaxY(currentBounds)-1, CGRectGetMaxX(currentBounds), 1));
[secondLineColor setFill];
CGContextFillRect(context, CGRectMake(0, 1, CGRectGetMaxX(currentBounds), 1));
[super drawRect:rect];
}
@end
Ответ 3
Я обнаружил, что другие ответы либо не работают, либо не имитируют стандартный внешний вид. Здесь моя, которая работает для iOS 5 и 6.
Обратите внимание, что если вы используете iOS 6, вы должны использовать dequeueReusableHeaderFooterViewWithIdentifier
, что делает вещи намного проще и чище.
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
{
if ([tableView respondsToSelector:@selector(dequeueReusableHeaderFooterViewWithIdentifier:)])
{
static NSString *headerReuseIdentifier = @"TableViewSectionHeaderViewIdentifier";
UITableViewHeaderFooterView *sectionHeaderView = [tableView dequeueReusableHeaderFooterViewWithIdentifier:headerReuseIdentifier];
if(sectionHeaderView == nil){
sectionHeaderView = [[UITableViewHeaderFooterView alloc] initWithReuseIdentifier:headerReuseIdentifier];
}
//customise the label here:
//[sectionHeaderView.textLabel setTextColor:[UIColor whiteColor]];
return sectionHeaderView;
}
else
{
UIView* headerView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 44.0)];
UILabel *headerLabel = [[UILabel alloc] initWithFrame:CGRectMake(20.0, 10, 290, 0)];
headerLabel.backgroundColor = [UIColor clearColor];
headerLabel.text = [self tableView:tableView titleForHeaderInSection:section];
headerLabel.font = [UIFont boldSystemFontOfSize:17];
headerLabel.textAlignment = NSTextAlignmentLeft;
headerLabel.shadowColor = [UIColor clearColor];
headerLabel.numberOfLines = 0;
[headerLabel sizeToFit];
[headerView setFrame:CGRectMake(headerView.frame.origin.x, headerView.frame.origin.y, headerView.frame.size.width, headerLabel.bounds.size.height)];
//some customisation:
headerLabel.textColor = [UIColor whiteColor];
[headerView addSubview: headerLabel];
return headerView;
}
}
Как говорят документы, если вы реализуете viewForHeaderInSection
, вы также должны реализовать heightForHeaderInSection
. Внесите его так, чтобы убедиться, что он получает нужный размер для любого количества строк:
-(float)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section {
return UITableViewAutomaticDimension;
}
Ответ 4
Я бы создал пользовательский класс UIView и добавил UILabel к тексту заголовка раздела. Для фона используйте UIImageView и загрузите соответствующее изображение для фона заголовка раздела. Назначьте этот UIImageView с помощью метода addSubView: для вашего UIView.
В UITableViewController вы можете настроить tableView.sectionHeaderHeight для настройки высоты всех заголовков разделов. Использование метода UITableViewDelegate:
tableView:viewForHeaderInSection:
http://developer.apple.com/library/ios/#documentation/uikit/reference/UITableViewDelegate_Protocol/Reference/Reference.html#//apple_ref/occ/intf/UITableViewDelegate
Вы должны вернуть экземпляр своего пользовательского UIView с текстовой меткой в качестве заголовка раздела.
Вы должны добавить тень в UILabel и настроить все цвета в соответствии со стилем по умолчанию. Поскольку заголовки разделов также слегка прозрачны, вы можете настроить свою UIView alpha с помощью
self.alpha = 0.9f;