objective-c - カスタマイズされたセルの代替背景色を持つUITableViewCell

Question

UITableViewCellsの背景に、表示される2つのセルごとに異なる色を設定したいのですが、上下にスクロールすると、すべて同じ色になります。セルのcontentViewサイズが（コンテンツに応じて）異なることを知って、この効果を得るにはどうすればよいですか？

#define FONT_SIZE 14.0f
#define CELL_CONTENT_WIDTH 320.0f
#define CELL_CONTENT_MARGIN 20.0f
#define NAME_CELL_HEIGHT 20.0f

#import "CartCell.h"

@implementation CartCell

@synthesize nameLabel = _nameLabel;
@synthesize ingredientsLabel = _ingredientsLabel;
@synthesize myStore;

- (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier
{

    myStore = [Store sharedStore];

    self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
    if (self) {

        self.nameLabel = nil;
        self.ingredientsLabel = nil;

        // SET "NAME" CELL
        self.nameLabel = [[UILabel alloc] initWithFrame:CGRectZero];
        [self.nameLabel setLineBreakMode:UILineBreakModeWordWrap];
        [self.nameLabel setMinimumFontSize:FONT_SIZE];
        [self.nameLabel setNumberOfLines:1];
        [self.nameLabel setTag:1];
        self.nameLabel.font = [UIFont fontWithName:@"Helvetica-Bold" size:18];
        [self.nameLabel sizeToFit];
        self.nameLabel.backgroundColor = [UIColor clearColor];
        [[self contentView] addSubview:self.nameLabel];

        // SET "INGREDIENTS" CELL
        self.ingredientsLabel = [[UILabel alloc] initWithFrame:CGRectZero];
        [self.ingredientsLabel setLineBreakMode:UILineBreakModeWordWrap];
        [self.ingredientsLabel setMinimumFontSize:FONT_SIZE];
        [self.ingredientsLabel setNumberOfLines:0];
        [self.ingredientsLabel setFont:[UIFont systemFontOfSize:FONT_SIZE]];
        [self.ingredientsLabel setTag:2];
        self.ingredientsLabel.backgroundColor = [UIColor clearColor];
        [[self contentView] addSubview:self.ingredientsLabel];

        if (myStore.cellBackgroundShouldBeLight == YES) {
            NSLog(@"clear [in] ? %@", myStore.cellBackgroundShouldBeLight ? @"Yes" : @"No");
            self.contentView.backgroundColor = [[UIColor alloc]initWithRed:87.0/255.0 green:168.0/255.0 blue:229.0/255.0 alpha:1];
            myStore.cellBackgroundShouldBeLight = NO;
        } else {
            NSLog(@"clear [in] ? %@", myStore.cellBackgroundShouldBeLight ? @"Yes" : @"No");
            self.contentView.backgroundColor = [[UIColor alloc]initWithRed:187.0/255.0 green:268.0/255.0 blue:229.0/255.0 alpha:1];
            myStore.cellBackgroundShouldBeLight = YES;
        }

    }

    return self;
}


- (void)setSelected:(BOOL)selected animated:(BOOL)animated
{
    [super setSelected:selected animated:animated];

    // Configure the view for the selected state
}

@end

アップデート：

提案されたとおりにcellForRowAtIndexPathに設定しようとしていることはわかっていますが、同じ結果が得られます。最初は下にスクロールしても問題なく機能しましたが、もう一度上にスクロールするとセルの背景色が乱れました。

- (UITableViewCell *)tableView:(UITableView *)tableView
         cellForRowAtIndexPath:(NSIndexPath *)indexPath {

    static NSString *CellIdentifier = @"CartCell";
    CartCell *cell = (CartCell *)[tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    Recipes *info = [_fetchedResultsController objectAtIndexPath:indexPath];

    if (cell == nil) 
    {
        cell = [[CartCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];

    }

//    if (!cell.nameLabel) {
//        cell.nameLabel = (UILabel*)[cell viewWithTag:1];
//        //        cell.nameLabel = (UILabel*)[cell viewWithTag:1];
//    }
//    if (!cell.ingredientsLabel)
//        cell.ingredientsLabel = (UILabel*)[cell viewWithTag:2];

    CGSize constraint = CGSizeMake(CELL_CONTENT_WIDTH - (CELL_CONTENT_MARGIN * 2), 20000.0f);
    CGSize size = [info.ingredients sizeWithFont:[UIFont systemFontOfSize:FONT_SIZE] constrainedToSize:constraint lineBreakMode:UILineBreakModeWordWrap];

    [cell.nameLabel setFrame:CGRectMake(10, 10, CELL_CONTENT_WIDTH - (CELL_CONTENT_MARGIN * 2), NAME_CELL_HEIGHT)];
    [cell.ingredientsLabel setFrame:CGRectMake(CELL_CONTENT_MARGIN, CELL_CONTENT_MARGIN + NAME_CELL_HEIGHT, CELL_CONTENT_WIDTH - (CELL_CONTENT_MARGIN * 2), MAX(size.height, 44.0f))];

    // SETTING TEXT CONTENT
    cell.nameLabel.text = info.name;
    cell.ingredientsLabel.text = info.ingredients;

    // SETTING BACKGROUND COLOR

    //        UIView *lab = [[UIView alloc] initWithFrame:cell.frame];
    //        [lab setBackgroundColor:[UIColor blueColor]];

    if (myStore.cellBackgroundShouldBeLight == YES) {
        NSLog(@"clear? %@", myStore.cellBackgroundShouldBeLight ? @"Yes" : @"No");
        cell.contentView.backgroundColor = [[UIColor alloc]initWithRed:87.0/255.0 green:84.0/255.0 blue:229.0/255.0 alpha:1];
        //            cell.backgroundView = lab;
        //            ingredientsLabel.backgroundColor = [UIColor clearColor];
        //            nameLabel.backgroundColor = [[UIColor alloc]initWithRed:87.0/255.0 green:168.0/255.0 blue:229.0/255.0 alpha:1];
        //            [cell setBackgroundColor: [[UIColor alloc]initWithRed:87.0/255.0 green:168.0/255.0 blue:229.0/255.0 alpha:1]];
        //            [cell setBackgroundColor:[UIColor colorWithRed:.8 green:.8 blue:1 alpha:1]];
        myStore.cellBackgroundShouldBeLight = NO;
    } else {
//        cell.contentView.tag = 2;
        NSLog(@"clear? %@", myStore.cellBackgroundShouldBeLight ? @"Yes" : @"No");
        cell.contentView.backgroundColor = [[UIColor alloc]initWithRed:187.0/255.0 green:184.0/255.0 blue:229.0/255.0 alpha:1];
        myStore.cellBackgroundShouldBeLight = YES;
    }


    return cell;
}

score 20 · Accepted Answer

それは非常に単純で、indexPathはあなたが知る必要があるすべてを教えてくれます。indexPath.rowが偶数の場合は、1つの色を使用します。indexPath.rowが奇数の場合は、別の色を使用してください。

- (UITableViewCell *)tableView:(UITableView *)tableView
         cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    …

    // SETTING BACKGROUND COLOR

    //        UIView *lab = [[UIView alloc] initWithFrame:cell.frame];
    //        [lab setBackgroundColor:[UIColor blueColor]];

    if (indexPath.row % 2) {
        cell.contentView.backgroundColor = [[[UIColor alloc]initWithRed:87.0/255.0 green:84.0/255.0 blue:229.0/255.0 alpha:1] autorelease];
    } else {
        cell.contentView.backgroundColor = [[[UIColor alloc]initWithRed:187.0/255.0 green:184.0/255.0 blue:229.0/255.0 alpha:1] autorelease];
    }

    …

    return cell;
}

セルが交互のペアで要求されると盲目的に仮定することは悪い仮定であるため、あなたの方法には問題があります。tableViewは、選択された任意の順序でセルを要求できます。あなたの例では、次のようにセルを要求できると思います。まず、0、1、…、9が求められます。次に、下にスクロールすると、10、11、および12がフェッチされます。この時点で、0、1、および2が画面から消えています。上にスクロールすると2が要求されますが、モデルが奇数の交互になっているため、間違った色になります。

score 1 · Accepted Answer

メソッドを使用し-willDisplayCellます。

- (void)tableView: (UITableView *)tableView willDisplayCell: (UITableViewCell *)cell forRowAtIndexPath: (NSIndexPath *)indexPath {

    if (indexPath.row %2) { //change the "%2" depending on how many cells you want alternating.
        UIColor *altCellColor = [UIColor colorWithRed:255/255.0 green:237/255.0 blue:227/255.0 alpha:1.0]; //this can be changed, at the moment it sets the background color to red.
        cell.backgroundColor = altCellColor;
    }
    else if (indexPath.row %2) { 
        UIColor *altCellColor2 = [UIColor colorWithRed:1 green:1 blue:1 alpha:1.0]; //this can be changed, at the moment it sets the background color to white.
        cell.backgroundColor = altCellColor2;
    }
}

score 0 · Accepted Answer

セルの背景色を変更する適切な場所cellForRowAtIndexPath:は、セルのデータが入力されてテーブルビューに戻る""メソッドです。

これを行う1つの方法は、次のとおりです。データがセルに入るときに、現在の行に応じて背景色を変更します。

score 0 · Accepted Answer

0

cellForRowAtIndexPathに色を付けます。カスタムセルには設定しないでください。

于 2012-06-23T12:37:19.887 に答える

score 0 · Accepted Answer

テーブルをカスタマイズするために使用するものを見てください

- (UITableViewCell *)tableView:(UITableView *)aTableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
#if USE_CUSTOM_DRAWING
    const NSInteger TOP_LABEL_TAG = 1001;
    const NSInteger BOTTOM_LABEL_TAG = 1002;
    UILabel *topLabel;
    UILabel *bottomLabel;
#endif

    static NSString *CellIdentifier = @"Cell";
    UITableViewCell *cell = [aTableView dequeueReusableCellWithIdentifier:CellIdentifier];
    if (cell == nil)
    {
        //
        // Create the cell.
        //
        cell =
            [[[UITableViewCell alloc]
                initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier]
            autorelease];

#if USE_CUSTOM_DRAWING
        UIImage *indicatorImage = [UIImage imageNamed:@"indicator.png"];
        cell.accessoryView =
            [[[UIImageView alloc]
                initWithImage:indicatorImage]
            autorelease];

        const CGFloat LABEL_HEIGHT = 20;
        UIImage *image = [UIImage imageNamed:@"imageA.png"];

        //
        // Create the label for the top row of text
        //
        topLabel =
            [[[UILabel alloc]
                initWithFrame:
                    CGRectMake(
                        image.size.width + 2.0 * cell.indentationWidth,
                        0.5 * (aTableView.rowHeight - 2 * LABEL_HEIGHT),
                        aTableView.bounds.size.width -
                            image.size.width - 4.0 * cell.indentationWidth
                                - indicatorImage.size.width,
                        LABEL_HEIGHT)]
            autorelease];
        [cell.contentView addSubview:topLabel];

        //
        // Configure the properties for the text that are the same on every row
        //
        topLabel.tag = TOP_LABEL_TAG;
        topLabel.backgroundColor = [UIColor clearColor];
        topLabel.textColor = [UIColor colorWithRed:0.25 green:0.0 blue:0.0 alpha:1.0];
        topLabel.highlightedTextColor = [UIColor colorWithRed:1.0 green:1.0 blue:0.9 alpha:1.0];
        topLabel.font = [UIFont systemFontOfSize:[UIFont labelFontSize]];

        //
        // Create the label for the top row of text
        //
        bottomLabel =
            [[[UILabel alloc]
                initWithFrame:
                    CGRectMake(
                        image.size.width + 2.0 * cell.indentationWidth,
                        0.5 * (aTableView.rowHeight - 2 * LABEL_HEIGHT) + LABEL_HEIGHT,
                        aTableView.bounds.size.width -
                            image.size.width - 4.0 * cell.indentationWidth
                                - indicatorImage.size.width,
                        LABEL_HEIGHT)]
            autorelease];
        [cell.contentView addSubview:bottomLabel];

        //
        // Configure the properties for the text that are the same on every row
        //
        bottomLabel.tag = BOTTOM_LABEL_TAG;
        bottomLabel.backgroundColor = [UIColor clearColor];
        bottomLabel.textColor = [UIColor colorWithRed:0.25 green:0.0 blue:0.0 alpha:1.0];
        bottomLabel.highlightedTextColor = [UIColor colorWithRed:1.0 green:1.0 blue:0.9 alpha:1.0];
        bottomLabel.font = [UIFont systemFontOfSize:[UIFont labelFontSize] - 2];

        //
        // Create a background image view.
        //
        cell.backgroundView =
            [[[UIImageView alloc] init] autorelease];
        cell.selectedBackgroundView =
            [[[UIImageView alloc] init] autorelease];
#endif
    }

#if USE_CUSTOM_DRAWING
    else
    {
        for (UIView *sub in [cell.contentView subviews]) {
//            if([sub class] == [UITableViewCellContentView class])
                NSLog(@"this is uilabel %@",[sub class]);
        }
        topLabel = (UILabel *)[cell viewWithTag:TOP_LABEL_TAG];
        bottomLabel = (UILabel *)[cell viewWithTag:BOTTOM_LABEL_TAG];
    }

    topLabel.text = [NSString stringWithFormat:@"Cell at row %ld.", [indexPath row]];
    bottomLabel.text = [NSString stringWithFormat:@"Some other information.", [indexPath row]];

    //
    // Set the background and selected background images for the text.
    // Since we will round the corners at the top and bottom of sections, we
    // need to conditionally choose the images based on the row index and the
    // number of rows in the section.
    //
    UIImage *rowBackground;
    UIImage *selectionBackground;
    NSInteger sectionRows = [aTableView numberOfRowsInSection:[indexPath section]];
    NSInteger row = [indexPath row];
    if (row == 0 && row == sectionRows - 1)
    {
        rowBackground = [UIImage imageNamed:@"topAndBottomRow.png"];
        selectionBackground = [UIImage imageNamed:@"topAndBottomRowSelected.png"];
    }
    else if (row == 0)
    {
        rowBackground = [UIImage imageNamed:@"topRow.png"];
        selectionBackground = [UIImage imageNamed:@"topRowSelected.png"];
    }
    else if (row == sectionRows - 1)
    {
        rowBackground = [UIImage imageNamed:@"bottomRow.png"];
        selectionBackground = [UIImage imageNamed:@"bottomRowSelected.png"];
    }
    else
    {
        rowBackground = [UIImage imageNamed:@"middleRow.png"];
        selectionBackground = [UIImage imageNamed:@"middleRowSelected.png"];
    }
    ((UIImageView *)cell.backgroundView).image = rowBackground;
    ((UIImageView *)cell.selectedBackgroundView).image = selectionBackground;
//  cell.backgroundView.backgroundColor = [UIColor colorWithPatternImage:rowBackground];
//    cell.selectedBackgroundView.backgroundColor = [UIColor colorWithPatternImage:selectionBackground];
    //
    // Here I set an image based on the row. This is just to have something
    // colorful to show on each row.
    //
    if ((row % 3) == 0)
    {
        cell.imageView.image = [UIImage imageNamed:@"imageA.png"];
    }
    else if ((row % 3) == 1)
    {
        cell.imageView.image = [UIImage imageNamed:@"imageB.png"];
    }
    else
    {
        cell.imageView.image = [UIImage imageNamed:@"imageC.png"];
    }
#else
    cell.text = [NSString stringWithFormat:@"Cell at row %ld.", [indexPath row]];
#endif

    return cell;
}

#importすべての行の後にそれを過ぎて

#define USE_CUSTOM_DRAWING 1

score 0 · Accepted Answer

見出し##代替色を変更する最も簡単な方法

if(indexPath.row%2) {
    cell.backgroundColor=[UIColor nameUrColor] //brownColor, yellowColor, blueColor
} else {
    cell.backgroundColor=[UIColor nameAnotherColor]
}

score 0 · Accepted Answer

if(cell.contentView)
{
    [cell.nameLbl setFont:[UIFont systemFontOfSize:24]];
    int red_value = arc4random() % 210;
    int green_value = arc4random() % 210;
    int blue_value = arc4random() % 210;

    cell.contentView.backgroundColor = [UIColor colorWithRed:red_value/255.0 green:green_value/255.0 blue:blue_value/255.0 alpha:0.6];

}

objective-c - カスタマイズされたセルの代替背景色を持つUITableViewCell

7 に答える 7

見出し##代替色を変更する最も簡単な方法

Related

Reference