Làm cách nào để thay đổi màu nổi bật màu xanh của UITableViewCell?


131

Tôi đang tự hỏi làm thế nào để thay đổi màu nổi bật / lựa chọn màu xanh của một UITableViewCell, bất kỳ ý tưởng?

Câu trả lời:


213

Bạn có thể thay đổi màu nổi bật theo nhiều cách.

  1. Thay đổi thuộc tính selectStyle của ô của bạn. Nếu bạn thay đổi nó UITableViewCellSelectionStyleGray, nó sẽ có màu xám.

  2. Thay đổi selectedBackgroundViewtài sản. Trên thực tế những gì tạo ra gradient màu xanh là một khung nhìn. Bạn có thể tạo chế độ xem và vẽ những gì bạn thích và sử dụng chế độ xem làm nền của các ô xem bảng của bạn.


8
tuyệt vời, tìm thấy một lời giải thích tốt và ví dụ ở đây: cocoawithlove.com/2009/04/easy-custom-uitableview-drawing.html
Thomas Joos

1
Tôi nhận ra rằng trong IB bạn không thể đặt "Lựa chọn" của UITableViewCell thành "Không" - vì selectedBackgroundViewsau đó sẽ không bao giờ xuất hiện. Chỉ sau khi đặt "Lựa chọn" thành Mặc định, nó sẽ selectedBackgroundViewhiển thị. Đã thử nghiệm trên iOS 6 và 7.
Jonny

12
Cảm ơn các lưu ý tuyệt vời! Điều này làm cho nó trở nên đơn giản ngay bây giờ: bạn tạo một chế độ xem mới (thậm chí không cần chỉ định khung: cell.selectedBackgroundView = [UIView new];và bạn đặt bất kỳ màu nào bạn muốn:cell.selectedBackgroundView.backgroundColor = [UIColor colorWithHex:@"ecf2f5" andAlpha:1];
Dannie P

nhìn vào cuối trang này, có nhiều cách tiếp cận gần đây hơn
Climbatize

145

Zonble đã cung cấp một câu trả lời tuyệt vời. Tôi nghĩ rằng có thể hữu ích khi bao gồm một đoạn mã ngắn để thêm một UIViewô vào ô xem bảng sẽ hiển thị dưới dạng chế độ xem nền đã chọn.

cell = [[[UITableViewCell alloc] initWithFrame:CGRectZero reuseIdentifier:CellIdentifier] autorelease];

    UIView *selectionColor = [[UIView alloc] init];
    selectionColor.backgroundColor = [UIColor colorWithRed:(245/255.0) green:(245/255.0) blue:(245/255.0) alpha:1];
    cell.selectedBackgroundView = selectionColor;
  • tế bào là của tôi UITableViewCell
  • Tôi đã tạo một UIView và đặt màu nền của nó bằng các màu RGB (xám nhạt)
  • Sau đó, tôi đặt ô selectedBackgroundViewlà màu UIViewmà tôi đã tạo với màu nền đã chọn

Điều này làm việc tốt cho tôi. Cảm ơn vì tiền boa.


2
Điều này không hoạt động quá tốt khi sử dụng chế độ xem bảng với các phần. Khi được chọn, ô sẽ mất các đường viền và không được làm tròn khi ô đầu tiên hoặc ô cuối cùng.
Kirk Woll

7
@kirk, ý bạn là được nhóm lại :)
Tieme

@Tieme, không, ý tôi là các phần : "Chế độ xem bảng được tạo thành từ 0 hoặc nhiều phần, mỗi phần có các hàng riêng."
Kirk Woll

Bạn phải đặt nó trong 'cellForRowAtIndexPath'. Hoạt động tốt cho tôi, với một phần. Không thử nó với nhiều phần.
Vincent

Hơi muộn một chút với trò chơi nhưng tôi có thể xác nhận nó hoạt động trong chế độ xem bàn với nhiều phần (không được nhóm)
matto0

30

UITableViewCell có ba kiểu chọn mặc định: -

  1. Màu xanh da trời
  2. Xám
  3. không ai

Thực hiện như sau: -

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

     [cell setSelectionStyle:UITableViewCellSelectionStyleNone];       
}

7
thay vì ba kiểu mặc định này, chúng tôi cũng có thể tùy chỉnh cho kiểu dự kiến ​​của mình bằng thuộc tính được chọnBackgroundView.
Sunil Targe

Làm việc cho tôi ... Cảm ơn rất nhiều.
Mujeeb Farooqi

19

Trong Swift, sử dụng cái này trong cellForRowAtIndexPath

let selectedView = UIView()
selectedView.backgroundColor = .white
cell.selectedBackgroundView = selectedView

Nếu bạn muốn màu lựa chọn của bạn giống nhau UITableViewCell, hãy sử dụng màu này trong AppDelegate.

let selectedView = UIView()
selectedView.backgroundColor = .white
UITableViewCell.appearance().selectedBackgroundView = selectedView

18

Nếu bạn muốn thay đổi ứng dụng rộng rãi, bạn có thể thêm logic vào Đại biểu ứng dụng của mình

class AppDelegate: UIResponder, UIApplicationDelegate {

    //... truncated

   func application(application: UIApplication!, didFinishLaunchingWithOptions launchOptions: NSDictionary!) -> Bool {

        // set up your background color view
        let colorView = UIView()
        colorView.backgroundColor = UIColor.yellowColor()

        // use UITableViewCell.appearance() to configure 
        // the default appearance of all UITableViewCells in your app
        UITableViewCell.appearance().selectedBackgroundView = colorView

        return true
    }

    //... truncated
}

Hoàn hảo. Bất kỳ ý tưởng làm thế nào để thiết lập màu văn bản của ô mặc định đó trên toàn cầu trên chọn?
BananaAcid

1
điều này hoạt động, nhưng sau đó lựa chọn sẽ bị xóa trực tiếp khi đẩy bộ điều khiển khung nhìn mới.
bobmoff

Cách hay để thực hiện các thay đổi toàn cầu đối với UITableViewCell
Shashi3456643

12

để hoàn thiện: nếu bạn đã tạo lớp con của riêng mình, UITableViewCellbạn có thể triển khai - (void)setSelected:(BOOL)selected animated:(BOOL)animatedphương thức và đặt màu nền của một số chế độ xem mà bạn đã thêm trong chế độ xem nội dung. (nếu đó là trường hợp) hoặc của chính nội dung Xem (nếu nó không được bao phủ bởi một trong các chế độ xem của riêng bạn.

- (void)setSelected:(BOOL)selected animated:(BOOL)animated
{
    if(selected) {
        self.contentView.backgroundColor = UIColor.blueColor;
    } else {
        self.contentView.backgroundColor = UIColor.whiteColor;
    }
}

(không sử dụng? để vừa với chiều rộng nhỏ của mã nguồn DIV's :)

Cách tiếp cận này có hai ưu điểm so với sử dụng được chọnBackgroundView, nó sử dụng ít bộ nhớ hơn và CPU ít hơn một chút, thậm chí bạn sẽ không nhận ra trừ khi bạn hiển thị hàng trăm ô.


Đây chỉ hoạt động sau khi một chế độ xem mới được gán cho selectedBackgroundView Lúc bắt đầu phương thức thêmself. selectedBackgroundView = [UIView new];
enadun

@enadun Phương pháp này hoạt động với tôi trên iOS 12, hoàn toàn không có cài đặt thuộc selectedBackgroundViewtính.
Nate

11

Tôi phải đặt kiểu chọn thành UITableViewCellSelectionStyleDefaultmàu nền tùy chỉnh để hoạt động. Nếu bất kỳ phong cách khác, màu nền tùy chỉnh sẽ bị bỏ qua. Đã thử nghiệm trên iOS 8.

Mã đầy đủ cho ô như sau:

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    static NSString *CellIdentifier = @"MyCell";
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    if (cell == nil) {
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];
    }

    // This is how you change the background color
    cell.selectionStyle = UITableViewCellSelectionStyleDefault;
    UIView *bgColorView = [[UIView alloc] init];
    bgColorView.backgroundColor = [UIColor redColor];
    [cell setSelectedBackgroundView:bgColorView];

    return cell;
}

6

Dựa trên câu trả lời của @ người dùng , bạn chỉ có thể thêm tiện ích mở rộng này ở bất kỳ đâu trong mã ứng dụng của mình và có màu lựa chọn trực tiếp trong trình chỉnh sửa bảng phân cảnh cho mọi ô của ứng dụng:

@IBDesignable extension UITableViewCell {
    @IBInspectable var selectedColor: UIColor? {
        set {
            if let color = newValue {
                selectedBackgroundView = UIView()
                selectedBackgroundView!.backgroundColor = color
            } else {
                selectedBackgroundView = nil
            }
        }
        get {
            return selectedBackgroundView?.backgroundColor
        }
    }
}

Màu lựa chọn UITableViewCell trong bảng phân cảnh


5
@IBDesignable class UIDesignableTableViewCell: UITableViewCell {
  @IBInspectable var selectedColor: UIColor = UIColor.clearColor() {
    didSet {
      selectedBackgroundView = UIView()
      selectedBackgroundView?.backgroundColor = selectedColor
    }
  }
}

Trong bảng phân cảnh của bạn, đặt lớp UITableViewCell của bạn thành UIDesignableTableViewCell, trên trình kiểm tra thuộc tính, bạn có thể thay đổi màu đã chọn của ô thành bất kỳ màu nào.

Bạn có thể sử dụng điều này cho tất cả các tế bào của bạn. Đây là cách thanh tra thuộc tính của bạn sẽ trông như thế nào.

Đây là cách thanh tra thuộc tính của bạn sẽ trông như thế nào


Rất sáng tạo! tuyệt quá!
Kaushil Ruparelia

bạn có thể làm cho nó đơn giản hơn nữa, hãy nhìn vào câu trả lời của tôi;) stackoverflow.com/a/51764804/537694
Climbatize

Tôi sử dụng một ô tùy chỉnh để đặt nhãn, vì vậy điều này hoạt động tốt, cảm ơn! Thay đổi cho Swift 5: Bây giờ UIColor.clear, không phải UIColor.clearColor(). Không chắc đó có phải là một thay đổi trong Swift không nhưng nó cũng hoạt động mà không có @IBDesignable.
Neph

5

Swift 3.0 / 4.0

Nếu bạn đã tạo ô tùy chỉnh của riêng mình, bạn có thể thay đổi màu lựa chọn awakeFromNib()cho tất cả các ô:

 override func awakeFromNib() {
    super.awakeFromNib()

    let colorView = UIView()
    colorView.backgroundColor = UIColor.orange.withAlphaComponent(0.4)

    self.selectedBackgroundView = colorView


}

0

1- Thêm chế độ xem vào chế độ xem nội dung của ô của bạn.
2- Nhấp chuột phải vào ô của bạn.
3- Tạo chế độ xem được thêm dưới dạng "chọnBackgroundView" nhập mô tả hình ảnh ở đây

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.