2010-11-22 2 views
0

UITableView 헤더 섹션에 일부 제목을 추가했습니다. 맨 아래에 흰색 선을 그리고 위에서 아래로 회색 그라디언트를 그립니다.테이블 헤더 섹션 viewForHeaderInSection에 선과 그라디언트를 그려 넣으려면 어떻게해야합니까?

현재 viewForHeaderInSection에 내 머리글에 대한 레이블이있는보기를 만들었습니다. 저는 이제 1 픽셀의 높은 레이블을 사용하여 관리했던 흰 선을 그리려고합니다.

답변

4

당신이 UIView의 서브 클래스를 생성 보여, 당신이 당신의 라인을 그릴 것입니다있는 HeaderView 말 :

@implementation HeaderView 
- (void)drawRect:(CGRect)rect 
{ 
    [super drawRect:rect]; 

    //add a gradient: 
    CAGradientLayer *layer = [[[CAGradientLayer alloc] init] autorelease] 
    [gradientLayer setBounds:[self bounds]] 
    [gradientLayer setColors:[NSArray arrayWithObjects:(id)[[UIColor blackColor] CGColor], (id)[[UIColor whiteColor] CGColor], nil]]; 
    [[self layer] insertSublayer:gradientLayer atIndex:0]; 

    //draw line 
    CGContextRef ctx = UIGraphicsGetCurrentContext(); 
    CGContextSetRGBStrokeColor(ctx, 1.0, 0, 0, 1); 
    CGContextMoveToPoint(ctx, 0, rect.size.height-1); 
    CGContextAddLineToPoint(ctx, rect.size.width, rect.size.height-1); 
    CGContextStrokePath(ctx); 


} 
@end 

및 다음 표 위임에 :

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section 
{ 
    // create the parent view that will hold header Label 
    HeaderView* customView = [[[HeaderView alloc] initWithFrame:CGRectMake(0.0, 0.0, 360.0, 20.0)] autorelease]; 

    UILabel * headerLabel = [[UILabel alloc] initWithFrame:CGRectZero]; 
    headerLabel.backgroundColor = [UIColor clearColor]; 
    headerLabel.frame = CGRectMake(10.0, 0.0, 100.0, 20.0); 
    headerLabel.text = [sectionTitles objectAtIndex:section]; 
    [customView addSubview:headerLabel]; 
    [headerLabel release]; 

    return customView; 

}

+0

로맹에서이 두 가지 방법을 구현, 참조하시기 바랍니다 편집을 작동 , 코드에 약간의 색을 변경했습니다. 그러나 그래디언트가 헤더 섹션 영역에서 벗어 났습니까? 그리고 나는 그 선을 희게 할 수 없다. 마지막 이미지 인 높이가 1 인 레이블을 추가 했으므로 회색 선의 높이가 1임을 알 수 있습니다. – Jules

+0

CoreGraphics는 항상 픽셀 경계를 가로 질러 그릴 것입니다. 즉, 한 픽셀 선이 있으면 두 픽셀 사이에 그려집니다 , 그것은 색을 씻어 냈다, chunky, 총 2 픽셀 라인으로 나타납니다. 수평선의 경우 수직선의 경우 Y 좌표를 0.5만큼 오프셋하고 그 반대로 오프셋을 적용해야합니다. –

+1

'[gradientLayer setFrame : rect];을 수정해야했고 CrystalSkulls 수정으로 최종선을 수정 한 후 내 선이 그라디언트 뒤에 숨겨졌습니다. 그래서 저는 한 픽셀 레이블을 붙였습니다. 모두 꽤 좋아 보인다 :) – Jules

0

사람, 사람 보기 (UILabel/UIButton) 등을 서브 클래스하지 않으려 고합니다.

-(void) drawUnderlinedLabel { 
    NSString *string = [forgetButton titleForState: UIControlStateNormal]; 
    CGSize stringSize = [string sizeWithFont: forgetButton.titleLabel.font]; 
    CGRect buttonFrame = forgetButton.frame; 
    CGRect labelFrame = CGRectMake(buttonFrame.origin.x + buttonFrame.size.width - stringSize.width, buttonFrame.origin.y + stringSize.height + 1 , stringSize.width, 2); 
    UILabel *lineLabel = [[UILabel alloc] initWithFrame: labelFrame]; 
    lineLabel.backgroundColor = [UIColor blackColor]; 
    //[forgetButton addSubview:lineLabel]; 
    [self.view addSubview: lineLabel]; 
} 
2

나는 이미이 답변을 알고 있지만 그라디언트를 그리는 데 문제가 있습니다. 같은 문제가있는 다른 사람들이 있을지도 모른다고 생각 했으므로 여기에서 어떻게 해결했는지 설명합니다. 이것은 아이폰 OS 4 배에 대한

CustomTableViewSectionHeaderWithLine.h

#import <UIKit/UIKit.h> 
#import <QuartzCore/QuartzCore.h> 

@interface CustomTableViewSectionHeaderWithLine : UIView { 
    UIColor *topColor; 
    UIColor *bottomColor; 
    UIColor *lineColor; 
} 
@property(nonatomic, retain) UIColor *topColor, *bottomColor, *lineColor; 
@end 

CustomTableViewSectionHeaderWithLine.m

#import "CustomTableViewSectionHeaderWithLine.h" 


@implementation CustomTableViewSectionHeaderWithLine 
@synthesize topColor; 
@synthesize bottomColor; 
@synthesize lineColor; 

- (id)initWithFrame:(CGRect)frame 
{ 
    self = [super initWithFrame:frame]; 
    if (self) { 
     // Set the colors to something heinous so if you forget you can know immediately 
     if ([self topColor] == nil) topColor = [UIColor greenColor]; 
     if ([self bottomColor] == nil) bottomColor = [UIColor yellowColor]; 
     if ([self lineColor] == nil) lineColor = [UIColor redColor];   
    } 
    return self; 
} 

- (void)drawRect:(CGRect)rect 
{ 
    //[super drawRect:rect]; 

    //add a gradient: 
    CAGradientLayer *gradientLayer = [[[CAGradientLayer alloc] init] autorelease]; 
    [gradientLayer setBounds:[self bounds]]; 
    CGRect newRect = CGRectMake(rect.origin.x, rect.origin.y, rect.size.width, rect.size.height -1); 
    [gradientLayer setFrame:newRect]; 
    [gradientLayer setColors:[NSArray arrayWithObjects:(id)[topColor CGColor], (id)[bottomColor CGColor], nil]]; 
    [[self layer] insertSublayer:gradientLayer atIndex:0]; 

    //draw line 
    CGContextRef ctx = UIGraphicsGetCurrentContext(); 
    CGContextBeginPath(ctx); 
    // This gets the RGB Float values from the color initialized for lineColor 
    const float* colors = CGColorGetComponents(lineColor.CGColor); 
    CGContextSetRGBStrokeColor(ctx, colors[0], colors[1], colors[2], 1);  
    //CGContextSetGrayStrokeColor(ctx, 0, 1); 
    CGContextMoveToPoint(ctx, 0, rect.size.height); 
    CGContextAddLineToPoint(ctx, rect.size.width, rect.size.height); 
    CGContextStrokePath(ctx); 
} 

- (void)dealloc 
{ 
    [super dealloc]; 
} 

@end 

사용합니다 (TableViewDelegate

- (UIView *) tableView:(UITableView *) tableView viewForHeaderInSection:(NSInteger)section { 
    CustomTableViewSectionHeaderWithLine *customView = [[[CustomTableViewSectionHeaderWithLine alloc] initWithFrame:CGRectMake(0.0, 0.0, 360.0, 25.0)] autorelease]; 
    [customView setTopColor:[UIColor whiteColor]]; 
    [customView setBottomColor:[UIColor blackColor]]; 
    [customView setLineColor:[UIColor whiteColor]]; 

    UILabel *label = [[[UILabel alloc] initWithFrame:CGRectMake(10, 3, tableView.bounds.size.width - 10, 18)] autorelease]; 
    label.text = [tableView.dataSource tableView:tableView titleForHeaderInSection:section]; 
    label.textColor = [UIColor blackColor]; 
    label.backgroundColor = [UIColor clearColor]; 
    [customView addSubview:label]; 

    return customView; 
} 

- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section { 
    return 25; 
} 
관련 문제