วิธีการปรับใช้ส่วนหัวของตารางและมุมมองส่วนกำหนดเองกับกระดานเรื่องราว


176

โดยไม่ต้องใช้สตอรี่บอร์ดเราสามารถลากUIViewไปยังผืนผ้าใบวางมันแล้ววางมันในวิธีการtableView:viewForHeaderInSectionหรือtableView:viewForFooterInSectionมอบหมาย

เราจะทำสิ่งนี้ให้สำเร็จด้วยกระดานเรื่องราวซึ่งเราไม่สามารถลาก UIView ไปบนผืนผ้าใบได้

คำตอบ:


91

ฉันรู้ว่าคำถามนี้เป็น iOS 5 แต่เพื่อประโยชน์ของผู้อ่านอนาคตทราบว่า iOS 6 ที่มีประสิทธิภาพตอนนี้เราสามารถใช้แทนdequeueReusableHeaderFooterViewWithIdentifierdequeueReusableCellWithIdentifier

ดังนั้นในการviewDidLoadโทรอย่างใดอย่างหนึ่งหรือregisterNib:forHeaderFooterViewReuseIdentifier: registerClass:forHeaderFooterViewReuseIdentifier:จากนั้นในโทรviewForHeaderInSection tableView:dequeueReusableHeaderFooterViewWithIdentifier:คุณไม่ได้ใช้เซลล์ต้นแบบกับ API นี้ (เป็นทั้งมุมมองที่ใช้ NIB หรือมุมมองที่สร้างโดยทางโปรแกรม) แต่นี่เป็น API ใหม่สำหรับส่วนหัวและส่วนท้ายที่มีการเลื่อน


13
ถอนหายใจความอัปยศที่ทั้งสองคำตอบที่สะอาดเกี่ยวกับการใช้ NIB แทนเซลล์ proto ขณะนี้อยู่ภายใต้ 5 คะแนนโหวตและคำตอบที่ "แฮ็คมันกับเซลล์โปรโต" นั้นสูงกว่า 200
Benjohn

5
ความแตกต่างคือด้วยการแฮ็กจาก Tieme คุณสามารถออกแบบของคุณในกระดานเรื่องราวเดียวกันและไม่ใช้ Xib แยกต่างหาก
CedricSoubrie

คุณสามารถหลีกเลี่ยงการใช้ไฟล์ NIB แยกต่างหากและใช้สตอรีบอร์ดแทนได้หรือไม่
Foriger

@Foriger - ยังไม่ถึงจุดนี้ มันเป็นความผิดปกติในมุมมองตารางกระดานเรื่องราว แต่มันคือสิ่งที่มันเป็น ใช้แฮ็ค kludgy นั้นกับเซลล์ต้นแบบหากคุณต้องการ แต่ส่วนตัวแล้วฉันก็ทนกับความรำคาญของ NIBs สำหรับมุมมองส่วนหัว / ท้ายกระดาษ
Rob

2
เพียงแค่บอกว่ามันเป็น "เก่า" ไม่แข็งแรงพอ IMHO คำตอบที่ได้รับการยอมรับเป็นวิธี kludgy เพื่อหลีกเลี่ยงความจริงที่ว่าคุณไม่สามารถมีเซลล์ต้นแบบสำหรับมุมมองส่วนหัวและท้าย แต่ฉันคิดว่ามันผิดเพราะคิดว่าการตัดส่วนหัวและส่วนท้ายทำงานเหมือนกับการตัดเซลล์ (ซึ่งการมี API ใหม่สำหรับส่วนหัว / ส่วนท้ายอาจไม่เป็นเช่นนั้น) คำตอบที่ยอมรับได้เป็นวิธีแก้ปัญหาที่สร้างสรรค์ซึ่งสามารถเข้าใจได้ใน iOS 5 แต่ใน iOS 6 ขึ้นไปควรใช้ API ที่ออกแบบมาอย่างชัดเจนเพื่อนำส่วนหัว / ท้ายกระดาษกลับมาใช้ใหม่
Rob

384

เพียงใช้เซลล์ต้นแบบเป็นส่วนหัวและ / หรือส่วนท้ายของคุณ

  • เพิ่มเซลล์พิเศษและใส่องค์ประกอบที่คุณต้องการในมัน
  • ตั้งค่าตัวระบุเป็นบางอย่างที่เฉพาะเจาะจง (ในกรณีของฉัน SectionHeader)
  • ใช้tableView:viewForHeaderInSection:วิธีการหรือtableView:viewForFooterInSection:วิธีการ
  • ใช้[tableView dequeueReusableCellWithIdentifier:]เพื่อรับส่วนหัว
  • ใช้tableView:heightForHeaderInSection:วิธีการ

(ดูภาพหน้าจอ)

-(UIView *) tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section {
    static NSString *CellIdentifier = @"SectionHeader"; 
    UITableViewCell *headerView = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    if (headerView == nil){
        [NSException raise:@"headerView == nil.." format:@"No cells with matching CellIdentifier loaded from your storyboard"];
    }
    return headerView;
}  

แก้ไข:วิธีเปลี่ยนชื่อส่วนหัว (คำถามที่มีความคิดเห็น):

  1. เพิ่มป้ายกำกับในเซลล์ส่วนหัว
  2. ตั้งค่าแท็กของฉลากเป็นหมายเลขเฉพาะ (เช่น 123)
  3. ในtableView:viewForHeaderInSection:วิธีการของคุณรับป้ายกำกับโดยโทร:
    UILabel *label = (UILabel *)[headerView viewWithTag:123]; 
  1. ตอนนี้คุณสามารถใช้ป้ายกำกับเพื่อตั้งชื่อใหม่:
    [label setText:@"New Title"];

7
มาสายปาร์ตี้ แต่หากต้องการปิดการคลิกในมุมมองส่วนหัวเพียงแค่ส่งคืน cell.contentView ในviewForHeaderInSection เมธอด (ไม่จำเป็นต้องเพิ่ม UIViews ที่กำหนดเอง)
paulvs

3
@PaulVon ฉันพยายามทำในโครงการล่าสุดของฉัน แต่ถ้าคุณทำอย่างนั้นลอง longpress บนหนึ่งในส่วนหัวของคุณและมันจะผิดพลาด
Hons

13
ใน iOS 6.0 dequeueReusableHeaderFooterViewWithIdentifierมีการเปิดตัวและเป็นที่ต้องการมากกว่าคำตอบนี้ แต่การใช้อย่างถูกต้องในขณะนี้จะทำขั้นตอนเพิ่มเติม ผมมีคำแนะนำ @ samwize.com/2015/11/06/...
samwize

3
อย่าสร้างส่วนเฮดเดอร์วิวโดยใช้ UITableViewCells เพราะจะสร้างพฤติกรรมที่ไม่คาดคิด ใช้ UIView แทน
ชื่นชมมัน

4
โปรดอย่าใช้UITableViewCellเป็นมุมมองส่วนหัว คุณจะได้รับยากมากในการแก้ไขข้อบกพร่องภาพ - บางครั้งส่วนหัวจะหายไปเนื่องจากวิธี dequeued เซลล์และคุณจะมองหาชั่วโมงว่าทำไมเป็นเช่นนั้นจนกว่าคุณUITableViewCellจะรู้ว่าไม่ได้อยู่ในUITableViewส่วนหัว
raven_raven

53

ใน iOS 6.0 ขึ้นไปสิ่งต่าง ๆ ได้เปลี่ยนไปด้วยdequeueReusableHeaderFooterViewWithIdentifierAPI ใหม่

ฉันได้เขียนคำแนะนำ (ทดสอบบน iOS 9) ซึ่งสามารถสรุปได้ดังนี้:

  1. ประเภทรอง UITableViewHeaderFooterView
  2. สร้างปลายปากกาด้วยมุมมองคลาสย่อยและเพิ่ม 1 มุมมองคอนเทนเนอร์ซึ่งมีมุมมองอื่นทั้งหมดในส่วนหัว / ส่วนท้าย
  3. ลงทะเบียน Nib viewDidLoad
  4. ใช้viewForHeaderInSectionและใช้dequeueReusableHeaderFooterViewWithIdentifierเพื่อเรียกคืนส่วนหัว / ส่วนท้าย

2
ขอบคุณสำหรับคำตอบที่ไม่ใช่การแฮ็คและวิธีการทำสิ่งที่ถูกต้อง ขอบคุณสำหรับการแนะนำฉันให้กับ UITableViewHeaderFooterVIew Btw คู่มือนั้นยอดเยี่ยมมาก! :)
Roboris

ยินดีต้อนรับ การใช้ส่วนหัว / ท้ายกระดาษสำหรับมุมมองตารางหรือคอลเลกชันนั้นไม่ได้รับการบันทึกไว้เป็นอย่างดีโดย Apple เพียงแค่เมื่อวานนี้ผมก็ติดอยู่ในหัวทะเยอทะยานที่จะแสดงเมื่อการออกแบบผ่าน storyboad
samwize

1
นี่ควรเป็นคำตอบที่ได้รับคะแนนสูงสุดแน่นอน!
Ben Williams

คุณช่วยอธิบายวิธีทำผ่านกระดานเรื่องราวแทนที่จะเป็น xib ได้ไหม เมื่อทำเช่นนั้นฉัน dequeue สำเร็จ แต่ UILabels ของฉันเป็นโมฆะ
bunkerdive

22

ฉันทำให้มันทำงานใน iOS7 โดยใช้เซลล์ต้นแบบในกระดานเรื่องราว ฉันมีปุ่มในมุมมองส่วนหัวที่กำหนดเองของฉันซึ่งทำให้มีส่วนต่อขยายที่ติดตั้งในกระดานเรื่องราว

เริ่มต้นด้วยโซลูชันของ Tieme

เมื่อ pedro.m ชี้ให้เห็นปัญหาของปัญหานี้คือการแตะที่ส่วนหัวของส่วนทำให้เซลล์แรกในส่วนที่เลือกไว้

เมื่อ Paul Von ชี้ให้เห็นสิ่งนี้จะได้รับการแก้ไขโดยการคืน contentView ของเซลล์แทนทั้งเซลล์

อย่างไรก็ตามเมื่อ Hons ชี้ให้เห็นการกดที่ส่วนหัวของส่วนที่กล่าวมานานจะทำให้แอปเสียหาย

วิธีแก้ไขคือลบ gestureRecognizers ใด ๆ ออกจาก contentView

-(UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section {
     static NSString *CellIdentifier = @"SectionHeader";
     UITableViewCell *sectionHeaderView = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];

     while (sectionHeaderView.contentView.gestureRecognizers.count) {
         [sectionHeaderView.contentView removeGestureRecognizer:[sectionHeaderView.contentView.gestureRecognizers objectAtIndex:0]];
     }

     return sectionHeaderView.contentView; }

หากคุณไม่ได้ใช้รูปแบบลายเส้นในมุมมองส่วนหัวของคุณแฮ็คตัวเล็ก ๆ นี้ก็ดูเหมือนจะเสร็จเรียบร้อยแล้ว


2
คุณถูก. ฉันเพิ่งทดสอบและใช้งานได้ดังนั้นฉันจึงอัปเดตโพสต์ของฉัน ( hons82.blogspot.it/2014/05/uitableviewheader-done-right.html ) ที่มีโซลูชันที่เป็นไปได้ทั้งหมดที่ฉันพบในระหว่างการวิจัยของฉัน ขอบคุณมากสำหรับการแก้ไขนี้
Hons

คำตอบที่ดี ... ขอบคุณผู้ชาย
Jogendra.Com

13

หากคุณใช้กระดานเรื่องราวคุณสามารถใช้เซลล์ต้นแบบใน Tableview เพื่อจัดวางมุมมองส่วนหัวของคุณ ตั้งค่า id ที่ไม่ซ้ำกันและ viewForHeaderInSection คุณสามารถ dequeue เซลล์ด้วย ID นั้นและส่งไปยัง UIView


12

หากคุณต้องการ Swift Implementation ให้ทำตามคำแนะนำที่ยอมรับแล้ว UITableViewController จะใช้วิธีการต่อไปนี้:

override func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
    return tableView.dequeueReusableCell(withIdentifier: "CustomHeader")
}

override func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
    return 75
}

2
ด้วยเหตุผลบางอย่างมันไม่ทำงานสำหรับฉันจนกว่าฉันจะเอาชนะความสูงสำหรับส่วนต่อท้ายส่วนด้วย
Entalpi

นี่คือรหัสเก่าที่สวย คุณควรโพสต์คำตอบอื่น!
JZ

ฉันติดอยู่เพราะฉันไม่รู้ว่าฉันต้องเอาชนะความสูงสำหรับส่วนต่อท้ายส่วนต่อท้าย ขอบคุณ @Entalpi
guijob

1
@JZ ในตัวอย่าง Swift 3 ของคุณคุณ deque ด้วย self.tableView.dequeueReuseHeaderFooterView และ Swift 2 ต่อไปนี้: self.tableView.dequeueReuseCellWithIdentifier มีความแตกต่างกันหรือไม่?
Vrutin Rathod

1
สิ่งนี้ช่วยชีวิตก้นฉัน! การเพิ่มความสูงให้กับ headerCell ทำให้มองเห็นได้
CRey

9

การแก้ปัญหาที่ฉันคิดขึ้นนั้นเป็นวิธีการแก้ปัญหาเดียวกับที่ใช้ก่อนการนำเสนอสตอรีบอร์ด

สร้างไฟล์คลาสอินเตอร์เฟสใหม่ที่ว่างเปล่า ลาก UIView ไปที่ canvas, เลย์เอาต์ตามต้องการ

โหลดปลายปากกาด้วยตนเองกำหนดให้กับส่วนหัว / ท้ายกระดาษที่เหมาะสมในวิธีการมอบสิทธิ์ viewForHeaderInSection หรือ viewForFooterInSection

ฉันหวังว่า Apple จะทำให้สถานการณ์นี้ง่ายขึ้นด้วยสตอรี่บอร์ดและมองหาวิธีที่ดีกว่า ตัวอย่างเช่นส่วนหัวของตารางที่กำหนดเองและท้ายกระดาษจะตรงไปข้างหน้าเพื่อเพิ่ม


แอปเปิ้ลทำได้ดีถ้าคุณใช้เซลล์สตอรี่บอร์ดเป็นวิธีส่วนหัว :) stackoverflow.com/questions/9219234/#11396643
Tieme

2
ยกเว้นว่าจะทำงานได้กับเซลล์ต้นแบบเท่านั้นไม่ใช่เซลล์แบบคงที่
Jean-Denis Muys

1
หนึ่งในวิธีที่ง่ายจริงๆคือการใช้Pixate ; คุณสามารถปรับแต่งได้ค่อนข้างมากโดยไม่ได้รับการอ้างอิงถึงส่วนหัว สิ่งที่คุณต้องนำไปใช้ก็tableView:titleForHeaderInSectionคือหนึ่งในสายการบิน
John Starr Dewar

5
นั่นเป็นทางออกที่แท้จริง ... น่าเสียดายที่มันไม่ได้อยู่ด้านบนดังนั้นจึงใช้เวลาสักครู่ในการค้นหา ฉันสรุปปัญหาที่ฉันมีhons82.blogspot.it/2014/05/uitableviewheader-done-right.html
Hons

ง่ายกว่านั้นเพียงลากแล้วปล่อย
Ricardo

5

เมื่อคุณคืน contentView ของเซลล์คุณจะพบปัญหา 2 ประการ:

  1. ความผิดพลาดที่เกี่ยวข้องกับท่าทาง
  2. คุณไม่ได้ใช้ contentView ซ้ำ (ทุกครั้งที่มีการviewForHeaderInSectionโทรคุณต้องสร้างเซลล์ใหม่)

สารละลาย:

คลาส Wrapper สำหรับส่วนหัวของตาราง \ footer มันเป็นเพียงภาชนะบรรจุซึ่งสืบทอดมาจากUITableViewHeaderFooterViewเซลล์

https://github.com/Magnat12/MGTableViewHeaderWrapperView.git

ลงทะเบียนคลาสใน UITableView ของคุณ (ตัวอย่างเช่นใน viewDidLoad)

- (void)viewDidLoad {
    [super viewDidLoad];
    [self.tableView registerClass:[MGTableViewHeaderWrapperView class] forHeaderFooterViewReuseIdentifier:@"ProfileEditSectionHeader"];
}

ใน UITableViewDelegate ของคุณ:

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section {
    MGTableViewHeaderWrapperView *view = [tableView dequeueReusableHeaderFooterViewWithIdentifier:@"ProfileEditSectionHeader"];

    // init your custom cell
    ProfileEditSectionTitleTableCell *cell = (ProfileEditSectionTitleTableCell * ) view.cell;
    if (!cell) {
        cell = [tableView dequeueReusableCellWithIdentifier:@"ProfileEditSectionTitleTableCell"];
        view.cell = cell;
    }

    // Do something with your cell

    return view;
}

2

ฉันเคยทำสิ่งต่อไปนี้เพื่อสร้างมุมมองส่วนหัว / ท้ายกระดาษอย่างเกียจคร้าน:

  • เพิ่มตัวควบคุมมุมมองอิสระสำหรับส่วนหัว / ท้ายกระดาษลงในกระดานเรื่องราว
  • จัดการทุกสิ่งสำหรับส่วนหัวในตัวควบคุมมุมมอง
  • ในตัวควบคุมมุมมองตารางให้อาร์เรย์ที่ไม่แน่นอนของตัวควบคุมมุมมองสำหรับส่วนหัว / ท้ายกระดาษส่วน repopulated ด้วย [NSNull null]
  • ใน viewForHeaderInSection / viewForFooterInSection หากยังไม่มีตัวควบคุมมุมมองให้สร้างมันด้วยสตอรีบอร์ดแบบอินเทอร์เฟซ ViewControllerWithIdentifier ให้จำไว้ในอาร์เรย์และส่งคืนมุมมองตัวควบคุมมุมมอง

2

ฉันมีปัญหาในสถานการณ์ที่ Header ไม่เคยถูกนำมาใช้ซ้ำแม้กระทั่งทำตามขั้นตอนที่เหมาะสมทั้งหมด

ดังนั้นเพื่อเป็นคำแนะนำสำหรับทุกคนที่ต้องการบรรลุสถานการณ์ของการแสดงส่วนที่ว่างเปล่า (0 แถว) โปรดเตือนว่า:

dequeueReusableHeaderFooterViewWithIdentifier จะไม่ใช้ส่วนหัวซ้ำจนกว่าคุณจะส่งกลับอย่างน้อยหนึ่งแถว

หวังว่ามันจะช่วย


1

เพื่อติดตามข้อเสนอแนะของเดมอนต่อไปนี้เป็นวิธีที่ฉันเลือกให้ส่วนหัวเหมือนกับแถวปกติพร้อมตัวบ่งชี้การเปิดเผย

ฉันเพิ่มปุ่ม subclassed จาก UIButton (ชื่อคลาสย่อย "ButtonWithArgument") ไปยังเซลล์ต้นแบบของส่วนหัวและลบข้อความหัวเรื่อง (ข้อความตัวหนา "ชื่อ" เป็น UILabel อื่นในเซลล์ต้นแบบ)

ปุ่มในเครื่องมือสร้างส่วนต่อประสาน

จากนั้นตั้งค่าปุ่มเป็นมุมมองส่วนหัวทั้งหมดและเพิ่มตัวบ่งชี้การเปิดเผยด้วยเคล็ดลับของ Avario

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
{
    static NSString *CellIdentifier = @"PersonGroupHeader";
    UITableViewCell *headerView = (UITableViewCell *) [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    if(headerView == nil)
    {
        [NSException raise:@"headerView == nil, PersonGroupTableViewController" format:[NSString stringWithFormat:@"Storyboard does not have prototype cell with identifier %@",CellIdentifier]];
    }

    //  https://stackoverflow.com/a/24044628/3075839
    while(headerView.contentView.gestureRecognizers.count)
    {
        [headerView.contentView removeGestureRecognizer:[headerView.contentView.gestureRecognizers objectAtIndex:0]];
    }


    ButtonWithArgument *button = (ButtonWithArgument *)[headerView viewWithTag:4];
    button.frame = headerView.bounds; // set tap area to entire header view
    button.argument = [[NSNumber alloc] initWithInteger:section]; // from ButtonWithArguments subclass
    [button addTarget:self action:@selector(headerViewTap:) forControlEvents:UIControlEventTouchUpInside];

    // https://stackoverflow.com/a/20821178/3075839
    UITableViewCell *disclosure = [[UITableViewCell alloc] init];
    disclosure.accessoryType = UITableViewCellAccessoryDisclosureIndicator;
    disclosure.userInteractionEnabled = NO;
    disclosure.frame = CGRectMake(button.bounds.origin.x + button.bounds.size.width - 20 - 5, // disclosure 20 px wide, right margin 5 px
          (button.bounds.size.height - 20) / 2,
          20,
          20);
    [button addSubview:disclosure];

    // configure header title text

    return headerView.contentView;
}

- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section
{
    return 35.0f;
}

-(void) headerViewTap:(UIGestureRecognizer *)gestureRecognizer;
{
    NSLog(@"header tap");
    NSInteger section = ((NSNumber *)sender.argument).integerValue;
    // do something here
}

ButtonWithArgument.h

#import <UIKit/UIKit.h>

@interface ButtonWithArgument : UIButton
@property (nonatomic, strong) NSObject *argument;
@end

ButtonWithArgument.m

#import "ButtonWithArgument.h"
@implementation ButtonWithArgument
@end

1

คุณควรใช้โซลูชันของ Tiemeเป็นฐาน แต่ลืมเกี่ยวกับviewWithTag:และวิธีการคาวอื่น ๆ แทนพยายามโหลดส่วนหัวของคุณใหม่ (โดยโหลดซ้ำส่วนนั้น)

ดังนั้นหลังจากที่คุณนั่งมุมมองส่วนหัวของเซลล์ที่กำหนดเองกับสิ่งที่แปลกAutoLayoutใหม่เพียง dequeue และกลับ contentView หลังจากการตั้งค่าของคุณเช่น

-(UIView *) tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section {
 static NSString *CellIdentifier = @"SectionHeader"; 

    SettingsTableViewCell *sectionHeaderCell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];

    sectionHeaderCell.myPrettyLabel.text = @"Greetings";
    sectionHeaderCell.contentView.backgroundColor = [UIColor whiteColor]; // don't leave this transparent

    return sectionHeaderCell.contentView;
}  

1

สิ่งที่เกี่ยวกับการแก้ปัญหาที่ส่วนหัวขึ้นอยู่กับมุมมองอาร์เรย์:

class myViewController: UIViewController {
    var header: [UILabel] = myStringArray.map { (thisTitle: String) -> UILabel in
        let headerView = UILabel()
            headerView.text = thisTitle
    return(headerView)
}

ถัดไปในผู้รับมอบสิทธิ์:

extension myViewController: UITableViewDelegate {
    func tableView(tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
        return(header[section])
    }
}

1
  1. เพิ่มเซลล์ในStoryBoardและตั้งค่าreuseidentified

    SB

  2. รหัส

    class TP_TaskViewTableViewSectionHeader: UITableViewCell{
    }
    

    และ

    ลิงค์

  3. ใช้:

    func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
        let header = tableView.dequeueReusableCell(withIdentifier: "header", for: IndexPath.init(row: 0, section: section))
        return header
    }
    

2
นี่ไม่ใช่วิธีที่เหมาะสมในการเพิ่มส่วนหัว
Manish Malviya

2
ถ้าเช่นนั้นจะเป็นอย่างไร
Pramod Shukla

1

คล้ายกับคำตอบ laszlo แต่คุณสามารถใช้เซลล์ต้นแบบเดิมซ้ำได้ทั้งเซลล์ตารางและเซลล์ส่วนหัว เพิ่มสองฟังก์ชันแรกด้านล่างในคลาสย่อย UIViewController ของคุณ

override func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
let cell = tableView.dequeueReusableCell(withIdentifier: "DataCell") as! DataCell
    cell.data1Label.text = "DATA KEY"
    cell.data2Label.text = "DATA VALUE"
    return cell
}

override func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
    return 75
}

// Example of regular data cell dataDelegate to round out the example
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "DataCell", for: indexPath) as! PlayerCell

    cell.data1Label.text = "\(dataList[indexPath.row].key)"
    cell.data2Label.text = "\(dataList[indexPath.row].value)"
    return cell
}

0

นี่คือคำตอบของ @Vitaliy Gozhenkoใน Swift
เพื่อสรุปคุณจะสร้าง UITableViewHeaderFooterView ที่มี UITableViewCell UITableViewCell นี้จะ "dequeuable" และคุณสามารถออกแบบได้ในกระดานเรื่องราวของคุณ

  1. สร้างคลาส UITableViewHeaderFooterView

    class CustomHeaderFooterView: UITableViewHeaderFooterView {
    var cell : UITableViewCell? {
        willSet {
            cell?.removeFromSuperview()
        }
        didSet {
            if let cell = cell {
                cell.frame = self.bounds
                cell.autoresizingMask = [UIViewAutoresizing.FlexibleHeight, UIViewAutoresizing.FlexibleWidth]
                self.contentView.backgroundColor = UIColor .clearColor()
                self.contentView .addSubview(cell)
            }
        }
    }
    
  2. เสียบ tableview ของคุณกับคลาสนี้ในฟังก์ชัน viewDidLoad ของคุณ:

    self.tableView.registerClass(CustomHeaderFooterView.self, forHeaderFooterViewReuseIdentifier: "SECTION_ID")
    
  3. เมื่อถามถึงส่วนหัวให้ถอนการกำหนด CustomHeaderFooterView และใส่เซลล์ลงในเซลล์

    func tableView(tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
        let view = self.tableView.dequeueReusableHeaderFooterViewWithIdentifier("SECTION_ID") as! CustomHeaderFooterView
        if view.cell == nil {
            let cell = self.tableView.dequeueReusableCellWithIdentifier("Cell")
            view.cell = cell;
        }
    
        // Fill the cell with data here
    
        return view;
    }
    
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.