UITableView अनुभाग हेडर के लिए फ़ॉन्ट आकार बदलना


139

क्या कोई मुझे UITableView सेक्शन के हेडर में टेक्स्ट के लिए फॉन्ट साइज़ बदलने का सबसे आसान तरीका बता सकता है?

मेरे पास निम्नलिखित विधि का उपयोग करके अनुभाग शीर्षक है:

- (NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section

फिर, मैं समझता हूं कि इस पद्धति का उपयोग करके अनुभाग शीर्ष लेख को सफलतापूर्वक कैसे बदला जाए:

- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section

मेरे पास इस विधि का उपयोग करके UITableView कोशिकाएँ हैं:

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

हालाँकि, मैं वास्तव में फ़ॉन्ट का आकार बढ़ाने के लिए - या उस हेडर पाठ के फ़ॉन्ट शैली - के लिए कैसे के रूप में अटक गया हूँ?

क्या कोई कृपया सहायता कर सकता है? धन्यवाद।


जवाबों:


118

दुर्भाग्य से, आपको इसे ओवरराइड करना पड़ सकता है:

उद्देश्य-सी में:

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section

स्विफ्ट में:

func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView?

कुछ इस तरह की कोशिश करो:

उद्देश्य-सी में:

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section {

    UILabel *myLabel = [[UILabel alloc] init];
    myLabel.frame = CGRectMake(20, 8, 320, 20);
    myLabel.font = [UIFont boldSystemFontOfSize:18];
    myLabel.text = [self tableView:tableView titleForHeaderInSection:section];

    UIView *headerView = [[UIView alloc] init];
    [headerView addSubview:myLabel];

    return headerView;
}

स्विफ्ट में:

func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {

    let myLabel = UILabel()
    myLabel.frame = CGRect(x: 20, y: 8, width: 320, height: 20)
    myLabel.font = UIFont.boldSystemFont(ofSize: 18)
    myLabel.text = self.tableView(tableView, titleForHeaderInSection: section)

    let headerView = UIView()
    headerView.addSubview(myLabel)

    return headerView
}

1
धन्यवाद। यह पूरी तरह से काम किया। बहुत सराहना की।
JRD8

5
जबकि यह एक सही समाधान है, इस विधि से सावधान रहें। एक पंक्ति से अधिक समय तक शीर्ष लेख के लिए, आपको शीर्ष लेख की ऊंचाई की गणना करनी होगी tableView:heightForHeaderInSection:जिसमें बोझिल हो सकता है।
लियो नटन

3
यह करने की कोशिश की और जब आप तालिका को स्क्रॉल करते हैं तो यह काम करता है, हैडर लेबल स्क्रीन पर रहता है और कोशिकाओं को ओवरले करता है। :(
प्लास्मा

2
@ मुझे लगता है कि आप पाएंगे कि यह अपेक्षित व्यवहार नहीं है। मैं हेडर अनुभाग के बारे में बात नहीं कर रहा हूं, केवल लेबल, और इसके सुपर सेल पर लगाए गए हैं क्योंकि वे इसके नीचे से गुजरते हैं, जिससे यह एक वास्तविक गड़बड़ दिखता है। मैंने इसे हासिल करने के लिए एक बेहतर तरीका खोजा और एक बार फिर इसे ढूंढने के बाद इसे वापस पोस्ट करूंगा।
प्लाज्मा

1
@ mosca1337 को एक और दृश्य बनाने की कोई आवश्यकता नहीं है, आप वास्तविक 'UITableViewHeaderFooterView' प्रदर्शित होने और मापदंडों को समायोजित कर सकते हैं।
जुआन बोइरो

368

ऐसा करने का एक और तरीका UITableViewDelegateविधि का जवाब देना होगा willDisplayHeaderView। पारित दृश्य वास्तव में एक उदाहरण है UITableViewHeaderFooterView

नीचे दिया गया उदाहरण फ़ॉन्ट को बदलता है, और शीर्षक पाठ को सेल के भीतर लंबवत और क्षैतिज रूप से केंद्रित करता है। ध्यान दें कि heightForHeaderInSectionटेबल व्यू के लेआउट में आपके हेडर की ऊंचाई के हिसाब से किसी भी तरह के बदलाव के लिए आपको जवाब देना चाहिए । (अर्थात, यदि आप इस willDisplayHeaderViewविधि में हेडर की ऊँचाई को बदलने का निर्णय लेते हैं ।)

फिर आप titleForHeaderInSectionविभिन्न खंड शीर्षकों के साथ इस कॉन्फ़िगर हेडर का पुन: उपयोग करने के लिए विधि का जवाब दे सकते हैं ।

उद्देश्य सी

- (void)tableView:(UITableView *)tableView willDisplayHeaderView:(UIView *)view forSection:(NSInteger)section {
    UITableViewHeaderFooterView *header = (UITableViewHeaderFooterView *)view;

    header.textLabel.textColor = [UIColor redColor];
    header.textLabel.font = [UIFont boldSystemFontOfSize:18];
    CGRect headerFrame = header.frame;
    header.textLabel.frame = headerFrame;
    header.textLabel.textAlignment = NSTextAlignmentCenter;
}

स्विफ्ट 1.2

(नोट: यदि आपका व्यू कंट्रोलर किसी का वंशज है UITableViewController, तो इसे घोषित करने की आवश्यकता होगी override func।)

override func tableView(tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int) 
{
    let header:UITableViewHeaderFooterView = view as! UITableViewHeaderFooterView

    header.textLabel.textColor = UIColor.redColor()
    header.textLabel.font = UIFont.boldSystemFontOfSize(18)
    header.textLabel.frame = header.frame
    header.textLabel.textAlignment = NSTextAlignment.Center
}

स्विफ्ट 3.0

यह कोड यह भी सुनिश्चित करता है कि यदि आपका हेडर दृश्य UITableViewHeaderFooterView के अलावा कुछ और है तो ऐप क्रैश नहीं होता है:

override func tableView(_ tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int) {
    guard let header = view as? UITableViewHeaderFooterView else { return }
    header.textLabel?.textColor = UIColor.red
    header.textLabel?.font = UIFont.boldSystemFont(ofSize: 18)
    header.textLabel?.frame = header.frame
    header.textLabel?.textAlignment = .center
}

3
इस विधि ने मेरे लिए ऊपर वाले की तुलना में बहुत बेहतर काम किया
प्लाज़्मा

6
सबसे अच्छा जवाब मैंने देखा है।
फातमान

2
यह जानकारी को समायोजित करने के लिए "उचित" तरीका होगा, यह मानते हुए कि उपवर्ग के लिए कोई अन्य कारण नहीं है (उदाहरण के लिए विचार जोड़ने जैसे)। इसके अतिरिक्त, डायनामिक टाइप के हेडर टेक्स्ट को अपडेट करने के लिए इस पद्धति का उपयोग किया जा सकता है। बस का उपयोग करें: header.textLabel.font = [UIFont preferredFontForTextStyle:UIFontTextStyleHeadline];और / या header.detailTextLabel.font = [UIFont preferredFontForTextStyle:UIFontTextStyleHeadline];अन्य आवश्यक कदमों के साथ (यहाँ देखें: captechconsulting.com/blog/john-szumski/… )
leanne

3
यह शीर्ष लेख दृश्य का आकार नहीं बदलता है, इसलिए यदि आपका फ़ॉन्ट बड़ा या काफी अलग है, जैसे कि जैफिनो (क्यों नहीं पूछें), तो यह पाठ को काट देगा। यदि आपको अपने आप ही आकार की गणना करनी है, तो यह गड़बड़ है और आपको ऐसा नहीं करना चाहिए।
सिंह नटन्

@CocoaPriest मेरे बीटा संस्करण में नहीं क्रैश हो रहा है, यद्यपि। (जीएम बीज 2)
पैट्रिक बासुत

96

जबकि mosca1337 का जवाब एक सही समाधान है, इस विधि से सावधान रहें। एक पंक्ति से अधिक लंबे टेक्स्ट वाले हेडर के लिए, आपको हेडर की ऊंचाई की गणना करनी होगी tableView:heightForHeaderInSection:जिसमें बोझिल हो सकता है।

उपस्थिति API का उपयोग करने के लिए एक बहुत ही पसंदीदा तरीका है:

[[UILabel appearanceWhenContainedIn:[UITableViewHeaderFooterView class], nil] setFont:[UIFont boldSystemFontOfSize:28]];

यह फ़ॉन्ट को बदल देगा, जबकि अभी भी खुद को प्रबंधित करने के लिए तालिका छोड़ रहा है।

इष्टतम परिणामों के लिए, तालिका दृश्य को उप-वर्ग करें, और यह appearanceWhenContainedIn:सुनिश्चित करने के लिए कि यह केवल तालिका के विशिष्ट तालिका विचारों के लिए परिवर्तित किया गया है, इसे नियंत्रण श्रृंखला (में ) में जोड़ें ।


1
यदि उपवर्ग है, तो आप वैसे भी - tableView:viewForHeaderInSection:सही से एक कस्टम दृश्य लौटाएंगे? जिस स्थिति में फ़ॉन्ट को वहीं सेट किया जा सकता है। यह वही है जो @ mosca1337 का समाधान वैसे भी करता है।
trss

1
हाहा, खैर मैं कल के बाद एक वूजी हूं। तालिका दृश्य को उप-वर्ग करें और इसे कंटेनर सूची में जोड़ें। ;-)
लियो नटन

2
यह समाधान वास्तविक पाद / हेडर आकार की गणना के साथ कई कीड़े का कारण बनता है। मैं कुछ उदाहरण दिखा सकता हूं जब कस्टम फॉन्ट की स्थापना के दौरान शीर्षक काट दिया जाता है।
कास-काद

5
स्विफ्ट 3 :UILabel.appearance(whenContainedInInstancesOf: [UITableViewHeaderFooterView.self]).font = UIFont.boldSystemFont(ofSize: 28)
एरिक हॉजिन्स

3
यह iOS 11 पर फ़ॉन्ट को फिट करने के लिए लेबल को सही ढंग से आकार नहीं देता है। इसके अलावा, दृश्य लोड करने के बाद ऊपर और नीचे स्क्रॉल करने से वह डिफ़ॉल्ट फ़ॉन्ट पर रीसेट हो जाता है।
21

25

IOS 7 के लिए मैं इसका उपयोग करता हूं,


-(void)tableView:(UITableView *)tableView willDisplayHeaderView:(UIView *)view forSection:(NSInteger)section
{
    UITableViewHeaderFooterView *header = (UITableViewHeaderFooterView *)view;

    header.textLabel.font = [UIFont boldSystemFontOfSize:10.0f];
    header.textLabel.textColor = [UIColor orangeColor];
}

हेडर आकार बदलने के साथ यहां स्विफ्ट 3.0 संस्करण है

override func tableView(_ tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int) {
    if let header = view as? UITableViewHeaderFooterView {
        header.textLabel!.font = UIFont.systemFont(ofSize: 24.0)
        header.textLabel!.textColor = UIColor.orange          
    }
}

6
यह नए फॉन्ट को फिट करने के लिए हेडर व्यू को आकार नहीं देगा।
लियो नटन

@LeoNatan नए फॉन्ट को फिट करने के लिए हम हेडर व्यू को कैसे आकार दे सकते हैं - क्या इसे इस विधि में किया जा सकता है?
SAHM

मैं स्पष्ट करना चाहता था कि मैंने आपके उपरोक्त उत्तर को देखा है, लेकिन मैं केवल आकार को सीमित करने के लिए फ़ॉन्ट को बदलना चाहता हूं जब कोई उपयोगकर्ता चयनित फ़ॉन्ट (पहुंच) एक निश्चित आकार से अधिक होता है (इसलिए, सभी समय नहीं)। मेरा मानना ​​है कि मुझे willDisplayHeaderView में फ़ॉन्ट बदलने और जांचने की आवश्यकता है, तो क्या कोई तरीका है कि मैं फ़ॉन्ट ऊंचाई बदल सकता हूं?
SAHM

19

स्विफ्ट 3:

केवल आकार समायोजित करने का सबसे सरल तरीका :

func tableView(_ tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int) {

    let header = view as! UITableViewHeaderFooterView

    if let textlabel = header.textLabel {
        textlabel.font = textlabel.font.withSize(15)
    }
}

वह सबसे आसान तरीका है जिसकी मुझे तलाश है।
रयान

स्विफ्ट 4 में काम करता है! मत भूलना "ओवरराइड फंक .."
मैटवे

8

स्विफ्ट 2.0 :

  1. डिफ़ॉल्ट सेक्शन हेडर को पूरी तरह से अनुकूलन करने योग्य यूआईबेल से बदलें।

इस तरह से देखें

  override func tableView(tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {

    let sectionTitle: String = self.tableView(tableView, titleForHeaderInSection: section)!
    if sectionTitle == "" {
      return nil
    }

    let title: UILabel = UILabel()

    title.text = sectionTitle
    title.textColor = UIColor(red: 0.0, green: 0.54, blue: 0.0, alpha: 0.8)
    title.backgroundColor = UIColor.clearColor()
    title.font = UIFont.boldSystemFontOfSize(15)

    return title
  }
  1. डिफ़ॉल्ट शीर्षलेख को बदलें (डिफ़ॉल्ट को बरकरार रखता है)।

इस तरह लागू करेगा।

  override func tableView(tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int) {

    if let view = view as? UITableViewHeaderFooterView {
      view.backgroundView?.backgroundColor = UIColor.blueColor()
      view.textLabel!.backgroundColor = UIColor.clearColor()
      view.textLabel!.textColor = UIColor.whiteColor()
      view.textLabel!.font = UIFont.boldSystemFontOfSize(15)
    }
  }

याद रखें: यदि आप स्थैतिक कोशिकाओं का उपयोग कर रहे हैं, तो पहला खंड शीर्षलेख UITableView के शीर्ष के कारण अन्य अनुभाग हेडर की तुलना में अधिक गद्देदार है; इसे ठीक करने के लिए:

ऊंचाई को लागू करें

  override func tableView(tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {

    return 30.0 // Or whatever height you want!
  }

4

लियो नटन जवाब का स्विफ्ट 4 संस्करण है

UILabel.appearance(whenContainedInInstancesOf: [UITableViewHeaderFooterView.self]).font = UIFont.boldSystemFont(ofSize: 28)

यदि आप एक कस्टम फ़ॉन्ट सेट करना चाहते हैं, जिसका आप उपयोग कर सकते हैं

if let font = UIFont(name: "font-name", size: 12) {
    UILabel.appearance(whenContainedInInstancesOf: [UITableViewHeaderFooterView.self]).font = font
}

यह दुर्भाग्य से फ्रेम का आकार नहीं बदलता है।
निकडंक

3

इस पद्धति से आप फ़ॉन्ट आकार, फ़ॉन्ट शैली और हेडर पृष्ठभूमि भी सेट कर सकते हैं। इसके लिए 2 विधि हैं

पहला तरीका

- (void)tableView:(UITableView *)tableView willDisplayHeaderView:(UIView *)view forSection:(NSInteger)section{
        UITableViewHeaderFooterView *header = (UITableViewHeaderFooterView *)view;
        header.backgroundView.backgroundColor = [UIColor darkGrayColor];
        header.textLabel.font=[UIFont fontWithName:@"Open Sans-Regular" size:12];
        [header.textLabel setTextColor:[UIColor whiteColor]];
    }

दूसरी विधि

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section{
    UILabel *myLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, tableView.frame.size.width, 30)];
//    myLabel.frame = CGRectMake(20, 8, 320, 20);
    myLabel.font = [UIFont fontWithName:@"Open Sans-Regular" size:12];
    myLabel.text = [NSString stringWithFormat:@"   %@",[self tableView:FilterSearchTable titleForHeaderInSection:section]];

    myLabel.backgroundColor=[UIColor blueColor];
    myLabel.textColor=[UIColor whiteColor];
    UIView *headerView = [[UIView alloc] init];
    [headerView addSubview:myLabel];
    return headerView;
}

1

स्विफ्ट 2:

जैसा कि ओपी ने पूछा है, केवल आकार को समायोजित करें, इसे सिस्टम बोल्ड फ़ॉन्ट या जो कुछ भी सेट न करें:

func tableView(tableView: UITableView, willDisplayHeaderView view: UIView, forSection section: Int) {
        if let headerView = view as? UITableViewHeaderFooterView, textLabel = headerView.textLabel {

            let newSize = CGFloat(16)
            let fontName = textLabel.font.fontName
            textLabel.font = UIFont(name: fontName, size: newSize)
        }
    }

0

यह स्विफ्ट 5 के साथ मेरा समाधान है।

शीर्ष लेख अनुभाग दृश्य को पूरी तरह से नियंत्रित करने के लिए, आपको अपने नियंत्रक में तालिका दृश्य (: viewForHeaderInsection: :) विधि का उपयोग करने की आवश्यकता है, जैसा कि पिछली पोस्ट में दिखाया गया है। हालांकि, एक और कदम है: प्रदर्शन में सुधार करने के लिए, सेब हर बार एक नया दृश्य उत्पन्न नहीं करने की सलाह देता है, लेकिन शीर्ष लेख दृश्य का पुन: उपयोग करने के लिए, जैसे कि पुन: उपयोग तालिका सेल। यह विधि द्वारा किया गया है tableView.dequeueReusableHeaderFooterView (withIdentifier:)। लेकिन समस्या यह थी कि एक बार जब आप इस पुन: उपयोग फ़ंक्शन का उपयोग करना शुरू करते हैं, तो फ़ॉन्ट अपेक्षित रूप से कार्य नहीं करेगा। अन्य चीजें जैसे रंग, सभी ठीक संरेखण लेकिन सिर्फ फ़ॉन्ट। कुछ चर्चाएं हैं लेकिन मैंने इसे निम्नलिखित की तरह काम किया।

समस्या tableView.dequeueReusableHeaderFooterView (withIdentifier :) है, जो tableView.dequeneReuseCell (:) की तरह नहीं है, जो हमेशा एक सेल लौटाता है। यदि कोई उपलब्ध नहीं है तो पूर्व एक शून्य लौटाएगा। भले ही यह पुन: उपयोग करने वाला शीर्ष लेख दृश्य देता हो, यह आपका मूल वर्ग प्रकार नहीं है, लेकिन UITableHeaderFooterView है। इसलिए आपको निर्णय लेने और अपने कोड के अनुसार कार्य करने की आवश्यकता है। मूल रूप से, अगर यह शून्य है, तो एक नया हेडर दृश्य प्राप्त करें। यदि शून्य नहीं है, तो बल देने के लिए आप नियंत्रित कर सकते हैं।

override func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
        let reuse_header = tableView.dequeueReusableHeaderFooterView(withIdentifier: "yourHeaderID")
        if (reuse_header == nil) {
            let new_sec_header = YourTableHeaderViewClass(reuseIdentifier:"yourHeaderID")
            new_section_header.label.text="yourHeaderString"
            //do whatever to set color. alignment, etc to the label view property
            //note: the label property here should be your custom label view. Not the build-in labelView. This way you have total control.
            return new_section_header
        }
        else {
            let new_section_header = reuse_section_header as! yourTableHeaderViewClass
            new_sec_header.label.text="yourHeaderString"
            //do whatever color, alignment, etc to the label property
            return new_sec_header}

    }
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.