UITableViewでセクションヘッダーの色を変更する方法
EDIT: DJ-Sが提供する回答 はiOS 6以降で考慮されるべきです。受け入れられた答えは時代遅れです。
うまくいけばUITableViewDelegate
プロトコルからのこのメソッドはあなたが始められるようになるでしょう:
Objective-C:
- (UIView *) tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
{
UIView *headerView = [[[UIView alloc] initWithFrame:CGRectMake(0, 0, tableView.bounds.size.width, 30)] autorelease];
if (section == integerRepresentingYourSectionOfInterest)
[headerView setBackgroundColor:[UIColor redColor]];
else
[headerView setBackgroundColor:[UIColor clearColor]];
return headerView;
}
Swift:
func tableView(_ tableView: UITableView!, viewForHeaderInSection section: Int) -> UIView!
{
let headerView = UIView(frame: CGRect(x: 0, y: 0, width: tableView.bounds.size.width, height: 30))
if (section == integerRepresentingYourSectionOfInterest) {
headerView.backgroundColor = UIColor.redColor()
} else {
headerView.backgroundColor = UIColor.clearColor()
}
return headerView
}
更新された2017年:
Swift 3:
func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView?
{
let headerView = UIView(frame: CGRect(x: 0, y: 0, width: tableView.bounds.size.width, height: 30))
if (section == integerRepresentingYourSectionOfInterest) {
headerView.backgroundColor = UIColor.red
} else {
headerView.backgroundColor = UIColor.clear
}
return headerView
}
[UIColor redColor]
を希望のUIColor
のいずれかに置き換えます。 headerView
の寸法を調整することもできます。
これは古い質問ですが、答えを更新する必要があると思います。
この方法では、独自のカスタムビューを定義および作成する必要はありません。 iOS 6以降では、定義することで背景色とテキスト色を簡単に変更できます。
-(void)tableView:(UITableView *)tableView
willDisplayHeaderView:(UIView *)view
forSection:(NSInteger)section
セクションデリゲートメソッド
例えば:
- (void)tableView:(UITableView *)tableView willDisplayHeaderView:(UIView *)view forSection:(NSInteger)section
{
// Background color
view.tintColor = [UIColor blackColor];
// Text Color
UITableViewHeaderFooterView *header = (UITableViewHeaderFooterView *)view;
[header.textLabel setTextColor:[UIColor whiteColor]];
// Another way to set the background color
// Note: does not preserve gradient effect of original header
// header.contentView.backgroundColor = [UIColor blackColor];
}
ここに私の記事から取った: https://happyteamlabs.com/blog/ios-how-to-customize-table-view-header-and-footer-colors/
Swift 3/4
func tableView(_ tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int){
view.tintColor = UIColor.red
let header = view as! UITableViewHeaderFooterView
header.textLabel?.textColor = UIColor.white
}
これはテキストの色を変更する方法です。
UILabel *label = [[[UILabel alloc] initWithFrame:CGRectMake(10, 3, tableView.bounds.size.width - 10, 18)] autorelease];
label.text = @"Section Header Text Here";
label.textColor = [UIColor colorWithRed:1.0 green:1.0 blue:1.0 alpha:0.75];
label.backgroundColor = [UIColor clearColor];
[headerView addSubview:label];
カスタムカラーのヘッダが欲しいならこれをすることができます:
[[UITableViewHeaderFooterView appearance] setTintColor:[UIColor redColor]];
このソリューションはiOS 6.0以降で非常にうまく機能します。
次の解決策はiOS 8以降のSwift 1.2以降に対して有効です。
override func tableView(tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int) {
// This changes the header background
view.tintColor = UIColor.blueColor()
// Gets the header view as a UITableViewHeaderFooterView and changes the text colour
var headerView: UITableViewHeaderFooterView = view as! UITableViewHeaderFooterView
headerView.textLabel.textColor = UIColor.redColor()
}
デリゲートからこのコードを追加することを忘れないでください。そうしないと、ビュー/ラベルの高さに対してビューが切り取られたり、テーブルの後ろに表示されたりすることがあります。
- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section
{
return 30;
}
カスタムビューを作成したくない場合は、このように色を変更することもできます(iOS 6が必要です)。
-(void) tableView:(UITableView *)tableView willDisplayHeaderView:(UIView *)view forSection:(NSInteger)section {
if ([view isKindOfClass: [UITableViewHeaderFooterView class]]) {
UITableViewHeaderFooterView* castView = (UITableViewHeaderFooterView*) view;
UIView* content = castView.contentView;
UIColor* color = [UIColor colorWithWhite:0.85 alpha:1.]; // substitute your color here
content.backgroundColor = color;
}
}
UITableViewHeaderFooterViewで背景色を設定することは非推奨です。代わりにcontentView.backgroundColor
を使用してください。
セクション領域の背景とテキストの色を設定します。(William Jockusch
とDj S
のおかげで)
- (void)tableView:(UITableView *)tableView willDisplayHeaderView:(UIView *)view forSection:(NSInteger)section
{
if ([view isKindOfClass: [UITableViewHeaderFooterView class]]) {
UITableViewHeaderFooterView* castView = (UITableViewHeaderFooterView*) view;
castView.contentView.backgroundColor = [UIColor grayColor];
[castView.textLabel setTextColor:[UIColor grayColor]];
}
}
Swift 4
UITableViewセクションのヘッダービューの背景色、テキストラベルカラーおよびフォントを変更するには、テーブルビューのwillDisplayHeaderView
をオーバーライドします。 :
override func tableView(_ tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int) {
let header = view as! UITableViewHeaderFooterView
header.backgroundView?.backgroundColor = .white
header.textLabel?.textColor = .black
header.textLabel?.font = UIFont(name: "Helvetica-Bold", size: 14)
}
これは私にとっては完璧に機能しました。それがあなたにも役立つことを願っています!
ヘッダービューに画像を追加する方法は次のとおりです。
- (UIView *) tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
{
UIView *headerView = [[[UIView alloc] initWithFrame:CGRectMake(0, 0, tableView.bounds.size.width, 30)] autorelease];
UIImageView *headerImage = [[[UIImageView alloc] initWithImage:[UIImage imageNamed:@"top-gery-bar.png"]] autorelease];
headerImage.frame = CGRectMake(0, 0, tableView.bounds.size.width, 30);
[headerView addSubview:headerImage];
return headerView;
}
IOS8(Beta)とSwiftの場合は、必要なRGBカラーを選択して試してください。
override func tableView(tableView: UITableView!, viewForHeaderInSection section: Int) -> UIView! {
var header :UITableViewHeaderFooterView = UITableViewHeaderFooterView()
header.contentView.backgroundColor = UIColor(red: 254.0/255.0, green: 190.0/255.0, blue: 127.0/255.0, alpha: 1)
return header
}
(私のプロジェクトでは通常のUIViewControllerの代わりにUITableViewControllerを使用しているので、「上書き」がありますが、セクションヘッダーの色を変更するために必須ではありません)
あなたのヘッダーのテキストはまだ見られます。セクションヘッダーの高さを調整する必要があります。
がんばろう。
Swift 2
ぼかし効果を追加して、セクションの背景色を変更することに成功しました(これは本当にクールです)。セクションの背景色を簡単に変更するには:
それからぼかし効果のために、コードに追加:
override func tableView(tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int) {
// This is the blur effect
let blurEffect = UIBlurEffect(style: .Light)
let blurEffectView = UIVisualEffectView(effect: blurEffect)
// Gets the header view as a UITableViewHeaderFooterView and changes the text colour and adds above blur effect
let headerView: UITableViewHeaderFooterView = view as! UITableViewHeaderFooterView
headerView.textLabel!.textColor = UIColor.darkGrayColor()
headerView.textLabel!.font = UIFont(name: "HelveticaNeue-Light", size: 13)
headerView.tintColor = .groupTableViewBackgroundColor()
headerView.backgroundView = blurEffectView
}
私はその答えを知っています、念のために、Swiftでは以下を使用してください
override func tableView(tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
let tableViewWidth = self.tableView.bounds
let headerView = UIView(frame: CGRectMake(0, 0, tableViewWidth.size.width, self.tableView.sectionHeaderHeight))
headerView.backgroundColor = UIColor.greenColor()
return headerView
}
Swift 3を使った@Dj Sの回答に基づいています。これはiOS 10でとてもうまくいきます。
func tableView(_ tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int) {
// Background color
view.tintColor = UIColor.black
// Text Color
let headerView = view as! UITableViewHeaderFooterView
headerView.textLabel?.textColor = UIColor.white
}
iOS 8以降
func tableView(tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int) {
tableView.tableHeaderView?.backgroundColor = UIColor.blue()
}
-(void) tableView:(UITableView *)tableView willDisplayHeaderView:(UIView *)view
forSection:(NSInteger)section
{
if ([view isKindOfClass: [UITableViewHeaderFooterView class]])
{
UITableViewHeaderFooterView *castView = (UITableViewHeaderFooterView *) view;
UIView *content = castView.contentView;
UIColor *color = [UIColor whiteColor]; // substitute your color here
content.backgroundColor = color;
[castView.textLabel setTextColor:[UIColor blackColor]];
}
}
IOS 7.xでは、静的テーブルビューセルを使用したプロジェクトがあります。 willDisplayHeaderViewは起動しません。ただし、この方法でもうまくいきます。
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
{
NSLog(@"%s", __FUNCTION__);
CGRect headerFrame = CGRectMake(x, y, w, h);
UIView *headerView = [[UIView alloc] initWithFrame:headerFrame];
headerView.backgroundColor = [UIColor blackColor];
このコードはそれほど悪くないと思います。
func tableView(tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
let headerView = tableView.dequeueReusableHeaderFooterViewWithIdentifier(MyHeaderView.reuseIdentifier) as MyHeaderView
let backgroundView = UIView()
backgroundView.backgroundColor = UIColor.whiteColor()
headerView.backgroundView = backgroundView
headerView.textLabel.text = "hello"
return headerView
}
誰もがSwiftを必要としているなら、タイトルを付け続けます。
override func tableView(tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
let view = UIView(frame: CGRect(x: 0,y: 0,width: self.tableView.frame.width, height: 30))
view.backgroundColor = UIColor.redColor()
let label = UILabel(frame: CGRect(x: 15,y: 5,width: 200,height: 25))
label.text = self.tableView(tableView, titleForHeaderInSection: section)
view.addSubview(label)
return view
}
ヘッダービューのレイヤーの色を変えるだけ
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)セクション UIView * headerView = [[UIView alloc] initWithFrame:CGRectMake(0、 0、tableView.bounds.size.width、30)]自動解放]; headerView.layer.backgroundColor = [UIColor clearColor] .CGColor }
私の場合、それはこのように働いていました:
let headerIdentifier = "HeaderIdentifier"
let header = self.tableView.dequeueReusableHeaderFooterView(withIdentifier: headerIdentifier)
header.contentView.backgroundColor = UIColor.white
IOS 7.0.4では、独自のXIBを使ってカスタムヘッダを作成しました。前にここで述べたことは何もうまくいきませんでした。 dequeueReusableHeaderFooterViewWithIdentifier:
を扱うためにはUITableViewHeaderFooterViewのサブクラスでなければなりませんでした、そして、クラスは背景色に関して非常に頑固です。最後に、customBackgroudViewという名前のUIView(コードまたはIBのどちらでも使用できます)を追加し、それをbackgroundColorプロパティに設定しました。 layoutSubviewsでは、そのビューのフレームを境界に設定します。 iOS 7で動作し、不具合はありません。
// in MyTableHeaderView.xib drop an UIView at top of the first child of the owner
// first child becomes contentView
// in MyTableHeaderView.h
@property (nonatomic, weak) IBOutlet UIView * customBackgroundView;
// in MyTableHeaderView.m
-(void)layoutSubviews;
{
[super layoutSubviews];
self.customBackgroundView.frame = self.bounds;
}
// if you don't have XIB / use IB, put in the initializer:
-(id)initWithReuseIdentifier:(NSString *)reuseIdentifier
{
...
UIView * customBackgroundView = [[UIView alloc] init];
[self.contentView addSubview:customBackgroundView];
_customBackgroundView = customBackgroundView;
...
}
// in MyTableViewController.m
-(UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
{
MyTableHeaderView * header = [self.tableView
dequeueReusableHeaderFooterViewWithIdentifier:@"MyTableHeaderView"];
header.customBackgroundView.backgroundColor = [UIColor redColor];
return header;
}
RubyMotion/RedPotionを使って、これをTableScreenに貼り付けます。
def tableView(_, willDisplayHeaderView: view, forSection: section)
view.textLabel.textColor = rmq.color.your_text_color
view.contentView.backgroundColor = rmq.color.your_background_color
end
魅力のように動作します!
背景ビューの背景色を設定するだけです。
func tableView(_ tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int){
let tableHeader = view as! UITableViewHeaderFooterView
tableHeader.backgroundView?.backgroundColor = UIColor.white
}
Xcodeからコンソールログを介してメッセージを受け取りました
[TableView] UITableViewHeaderFooterViewで背景色を設定することは非推奨です。代わりにbackgroundViewプロパティに希望の背景色を持つカスタムUIViewを設定してください。
それから私はちょうど新しいUIViewを作成し、HeaderViewの背景としてそれを置きます。良い解決策ではありませんが、Xcodeが言ったように簡単です。
UIAppearanceを使用すると、アプリケーション内のすべてのヘッダーに対してこのように変更できます。
UITableViewHeaderFooterView.appearance()。backgroundColor = theme.subViewBackgroundColor
func tableView(_ tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int)
も機能しますが、他のデリゲートメソッドを実装せずにこれを達成できます。 func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView?
メソッドでは、うまくいかないview.contentView.backgroundColor = UIColor.white
の代わりにview.backgroundView?.backgroundColor = UIColor.white
を使うことができます。 (私はbackgroundView
がオプションであることを知っています、しかしそれがそこにあったとしても、これはwillDisplayHeaderView
を実装せずにwokingではありません
Swift 4はとても簡単です。これをクラスに追加して、必要に応じて色を設定するだけです。
override func tableView(_ tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int) {
view.backgroundColor = UIColor(red: 0.094, green: 0.239, blue: 0.424, alpha: 1.0)
}
または単純な色の場合
override func tableView(_ tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int) {
view.backgroundColor = UIColor.white
}