カスタムUITableViewCell選択スタイル?


82

私は私の上でクリックするとUITableViewCell、私は、セルをクリックすると、背景部分(私の背景画像をカバーしていないという領域)が青に変わります。また、UILabelセルのすべてのsは、クリックすると白に変わります。これは私が望むものです。

ただし、クリックしたときの背景は青色ですが、クリックすると、セル内のsのselectionstylenone強調表示された色が失われますUILabel

それで、セルがクリックされたときに青い背景を取り除くだけで、UILabelsの強調表示された色を維持する方法はありますか?


回答:


174

これは次のように実行できます。テーブルセルの選択スタイルをに設定しますUITableViewCellSelectionStyleNone。これにより、青い背景の強調表示が削除されます。次に、テキストラベルの強調表示を希望どおりに機能させるには、デフォルトのUITableViewCellクラスを使用する代わりに、のサブクラスを作成し、のサブクラスを作成して、強調表示された状態に応じてラベルの色を希望どおりに設定する独自の実装UITableViewCellでオーバーライドします。setHighlighted:animated

- (void)setHighlighted:(BOOL)highlighted animated:(BOOL)animated
{
    if (highlighted) {
        self.textLabel.textColor = [UIColor whiteColor];
    } else {
        self.textLabel.textColor = [UIColor blackColor];
    }
}

11
補足としてsetHighlighted:animated:animatedパラメータをとるをオーバーライドすることを確認してください。1つのパラメーターsetHighlighted:メソッドをオーバーライドすることはできません。
イムレKelényi

14
電話する必要があります[super setHighlighted:highlighted animated:animated];か?
SoftDesigner 2014年

どうもありがとう!チャームのように機能します!また、これにより、必要に応じてセル内の別のカスタムビューを強調表示することができます。これは、標準の強調表示が奇妙なためです。
imike 2014

2
しかし、この方法は、あなたが上書き一つの問題があるsetHighlightedsetSelected。最初にセルを選択し、textColorを白に変更します。次に、そのセルを画面の視覚部分からスクロールして外し、次にスクロールして戻ります。textColorが黒になります
ronan 2016年

1
@jonkroll概念を理解しましたが、セルが選択されているとき、そのセルのtextLabelの色はselectedColorのままである必要があります。現在、選択中にtextLabelの色を変更しているだけです。選択したtextLabelは元の色のままです
Samarth Kejriwal

75

iOS7より前で作業している場合は、セル選択スタイルをなしにします

cell.selectionStyle = UITableViewCellSelectionStyleNone;

それ以外の場合は、 UITableViewCellSelectionStyleDefault

次に:

UIView *selectedView = [[UIView alloc]init];
selectedView.backgroundColor = [UIColor redColor];
cell.selectedBackgroundView =  selectedView;

このコードは正しく機能します


2
@iBradApps ...ここでは、UIテーブルビューセルのカスタムクラスを作成していません...
アルファ

2
これにupvoteを与える-それはiOSの7で選択したセルの非テキストの色を変更するための私のために働いた唯一のソリューションです
バーンジェンセン

1
selectionstyleはselectionStyleである必要があります
Braden 2013年

12
このソリューションはiOS7で機能しましたが、selectionStyleをUITableViewCellStyleDefaultに設定した後でのみ機能しました。
ジェイQ.

1
この方法は、Appleの「すぐに使える」セル選択動作とまったく同じである唯一の方法です。それは受け入れられるべき答えです。
mkll 2014年

16

選択スタイルをnoneに設定した後、次のデリゲートメソッドを使用できます。

-(NSIndexPath *)tableView:(UITableView *)tableView willSelectRowAtIndexPath:(NSIndexPath *)indexPath

このように、ここにコードを実装します

-(NSIndexPath *)tableView:(UITableView *)tableView willSelectRowAtIndexPath:(NSIndexPath *)indexPath {
    CustomCell *cell = (CustomCell *)[tableView cellForRowAtIndexPath:indexPath];
    [cell.lbls setTextColor:[UIColor whiteColor]];
    return indexPath;
}

1
素晴らしい&クリーンなソリューション!willDeselectRowAtIndexPath呼び出しを実装するだけで、魔法のように機能します。
マテイBalantič

1
ここで考えられる欠点は、指が選択したセルから離れるまでこのメソッドが呼び出されないことです。他のいくつかのアプローチは、セルに触れるとすぐに有効になります。
arlomedia 2014年

14

この作業を行うには、選択スタイルをに設定UITableViewCellSelectionStyleNoneする必要があります。次に、メソッドsetSelected:animated:をオーバーライドして、目的の結果を取得する必要があります。青(または灰色)の選択が表示されたときにiOSの自動選択メカニズムが実行するのと同じことを行います。

- (void)setSelected:(BOOL)selected animated:(BOOL)animated
{
    if (selected) {
        self.textLabel.textColor = [UIColor whiteColor];
    } else {
        self.textLabel.textColor = [UIColor blackColor];
    }
}

UITableViewCellの背景を変更するなど、別の方法でこれをカスタマイズすることもできます。


13

cellForRowAtIndexPathで、次のコードを使用します。

[cell setSelectionStyle:UITableViewCellSelectionStyleNone];

[cell.myLabel setHighlightedTextColor: [UIColor whiteColor]]; // for all your labels

これがあなたのために働くことを願っています。

コーディングをお楽しみください:)


この答えは一番上にある必要があります。:)
Chintan Patel 2013

2
これは機能しません。[cell.textLabel setHighlightedTextColor:[UIColorblueColor]]を作成する場合; セルselectionStyleはNONEであってはなりません。
フェミナ2014年

6

のサブクラスで次の関数をオーバーライドしますUITableViewCell

override func setHighlighted(highlighted: Bool, animated: Bool) { }
override func setSelected(selected: Bool, animated: Bool) { }

ありがとうございました; これは、背景色を変更するときに画面の左端から右端までの行全体が選択されない唯一の方法です。
ホセ・ラミレス

setSelectedをオーバーライドしただけだったので、何らかの理由でセルがまだ時々点滅していました。
ZonilyJame18年

3

標準の選択スタイルの動作に一致させるには、setHighlighted:animated:との両方をオーバーライドする必要がありますsetSelected:animated:。コードの重複を避けるために、そのコードを共有メソッドに移動することをお勧めします。

override func setHighlighted(highlighted: Bool, animated: Bool) {

    setAsSelectedOrHighlighted(highlighted, animated: animated)
    super.setHighlighted(highlighted, animated: animated)
}

override func setSelected(selected: Bool, animated: Bool) {

    setAsSelectedOrHighlighted(selected, animated: animated)
    super.setSelected(selected, animated: animated)
}

func setAsSelectedOrHighlighted(selectedOrHighlighted: Bool, animated: Bool) {

    let action = {
        // Set animatable properties
    }

    if animated {
        UIView.animateWithDuration(1.0, delay: 0, options: .CurveEaseInOut, animations: action, completion: nil)
    }
    else {
        action()
    }
}

1

カスタムセルで、awakeFromNibとsetSelectedのデフォルトの実装をオーバーライドします。

- (void)awakeFromNib {
    // Initialization code
    UIImageView * imageView = [[UIImageView alloc] initWithFrame:self.bounds];
    imageView.image = [UIImage imageNamed:@"cell_selected_img"];
    self.selectedBackgroundView = imageView;
}

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

    // Configure the view for the selected state
    if (selected) {
        self.lblCustomText.textColor = [UIColor whiteColor];
    } else {
        self.lblCustomText.textColor = [UIColor blackColor];
    }
}

また、ことを確認してください選択スタイルがれないに設定なし


0

私がそれを機能させることができる唯一の方法は次のとおりでした:

- (void)awakeFromNib {
    UIView *bgColorView = [[UIView alloc] init];
    bgColorView.backgroundColor = [UIColor colorWithRed:(55.0/255.0) green:(163.0/255.0) blue:(237.0/255.0) alpha:1.0];
    bgColorView.layer.masksToBounds = YES;
    self.selectedBackgroundView = bgColorView;
}

0

また、contentView.alphaを使用することもできます。これが例です。

まず、セルの選択スタイルを設定します。

[cell setSelectionStyle:UITableViewCellSelectionStyleNone];

次に、カスタムセルクラスで、このメソッドをアニメーションの例でオーバーライドします。

  - (void)setHighlighted:(BOOL)highlighted animated:(BOOL)animated {
    [super setHighlighted:highlighted animated:animated];

    if (highlighted) {
        [UIView animateWithDuration:0.15f animations:^{
            self.contentView.alpha = 0.5f;
        }];
    } else {
        [UIView animateWithDuration:0.35f animations:^{
            self.contentView.alpha = 1.f;
        }];
    }
  }
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.