2013-02-08 19 views
12

कुछ समय छोड़ कृपया के रूप में यह एक लंबी स्पष्टीकरणUITableViewCell में एक कस्टम सेपरेटर कैसे जोड़ें?

है मैं एक UIViewController एक UIButton के होते हैं जो और एक UITableView जो पहचानकर्ता Cell1 और Cell2 साथ UITableViewCell रों के विभिन्न प्रकार लोड करता है, बटन की स्थिति touchUpInside पर है। मैं स्टोरीबोर्ड का उपयोग कर रहा हूँ।

दोनों कक्षों के लिए विभाजक अनुकूलित कर रहे हैं।

Cell1 में एक विभाजक है जो सेल की पूरी चौड़ाई और सेल के नीचे 1 पिक्सेल ऊंचाई पर कब्जा करता है।

जबकि Cell2 में एक विभाजक है जिसने सेल से 5 पिक्सेल ऑफसेट किया है, दोनों बाएं और दाएं।

प्रत्येक बार tableView के बाहर वाला बटन सेल पहचानकर्ता के आधार पर tableViewCell एस को बदल दिया गया है।

प्रारंभ में tableViewviewController की पूरी चौड़ाई पर है और CELL1 के होते हैं, लेकिन बटन, उपयोग किया जाता है tableViewCell रों CELL2 करने के लिए बदल रहे हैं और tableView के फ्रेम बदल गया है, चौड़ाई 10 और एक्स-मूल से कम हो जाता है 5.

लेकिन जब ऐसा होता है, तो Cell2 का विभाजक सेल से 5 पिक्सेल दूर है लेकिन बाईं ओर यह 5 पिक्सेल से दूर है। यह सभी Cell2 के लिए होता है जो डेटा के साथ लोड होता है, और जिन कक्षों में कोई डेटा नहीं है, फ्रेम उचित रूप से बदला जाता है।

लेकिन उस के बाद सेल Cell1 की चौड़ाई (बड़ा चौड़ाई) यह करने के लिए सेल कक्षा में साथ विभाजक के लिए किया जाएगा

-(void)setSeperatorStyleForTableView :(UITableViewCell *)cell //this is called in cellForRowAtIndex 
{ 
    //cell- type of cell(Cell1 or Cell2) 

    CGRect seperatorFrame; 
    UIImageView *seperatorImage; 

    seperatorFrame = [self setSeperatorFrame:cell]; 

    if(firstCellToBeLoaded)//BOOL used to change the button text and load appropriate cells 
    { 
     seperatorImage = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"table_row   
                      2.png"]]; 
    } 
    else 
    { 

     seperatorImage = [[UIImageView alloc] initWithImage:[UIImage 
                imageNamed:@"table_row.png"]]; 
    } 
    seperatorImage.frame = seperatorFrame; 
    seperatorImage.autoresizingMask = YES; 
    [cell.contentView addSubview:seperatorImage]; 

} 

//set the customized separator frame 

-(CGRect)setSeperatorFrame :(UITableViewCell *)cell 
{ 

    CGRect seperatorFrame; 
    seperatorFrame.size.height = 1.0; 
    seperatorFrame.origin.y = cell.frame.origin.y + (cell.frame.size.height - 1.0); 

    if(firstCellToBeLoaded) 
    { 
     seperatorFrame.origin.x = cell.frame.origin.x ; 
     seperatorFrame.size.width = cell.frame.size.width; 
    } 
    else 
    { 
     seperatorFrame.origin.x = cell.frame.origin.x + 5.0; 
     seperatorFrame.size.width = cell.frame.size.width -10.0; 

    } 

    return seperatorFrame; 
} 

उत्तर

44

आप tableView के मानक विभाजक रेखा जोड़ने के लिए, और प्रत्येक कोशिका के शीर्ष पर अपने कस्टम लाइन जोड़ सकते हैं।

निम्नलिखित कोड में हाइट/चौड़ाई/रंग/छविUIView को अपने सेपरेटरलाइन सेट करने के लिए बदलें।

कस्टम विभाजक जोड़ने के लिए सबसे आसान तरीका है 1px ऊंचाई के सरल UIView जोड़ने के लिए है:

UIView* separatorLineView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 1)];/// change size as you need. 
separatorLineView.backgroundColor = [UIColor grayColor];// you can also put image here 
[cell.contentView addSubview:separatorLineView]; 

इस कोड को आपकी समस्या :)

+1

सामान्य में आपूर्ति कृपया कर सकते हैं, इस काम करता है। हालांकि, जब सेल का चयन/हाइलाइट किया जाता है तो यह टूट जाता है क्योंकि तब सभी सबव्यूव में 'पृष्ठभूमि रंग' पारदर्शी पर रीसेट हो जाता है। 'पृष्ठभूमि रंग' के बजाय, एक सरल 'UIView' उपclass बनाना बेहतर है जो' drawRect: 'में दिए गए रंग के साथ स्वयं भर जाएगा। साथ ही, विभाजक 'सामग्री दृश्य' में नहीं जा सकता (हटाए गए बटन, accesory विचार आदि के कारण)। यह सीधे सेल पर जाना चाहिए। – Sulthan

+0

@ सुल्तान - आप रंग के बजाय छवि भी डाल सकते हैं, मैंने इसे अपने उत्तर की टिप्पणी में भी उल्लेख किया :) धन्यवाद :) – iPatel

+1

अंतिम सेल इस – Mittchel

2

सही तरीका है, उपवर्ग UITableViewCell अगर आप जोड़ नहीं है वहां एक विभाजक छवि परिवर्तक और प्रत्येक सेल निर्माण पर आप प्रत्येक रेड्रा पर जोड़ने के बजाय छवि और फ्रेम को बदल सकते हैं। यदि आपको इसके लिए एक कोड की आवश्यकता है तो मैं उसे भी आपूर्ति कर सकता हूं। वर्तमान में जब सेल को फिर से खींचा जाता है, तो इसमें पिछली बार आपके द्वारा जोड़ा गया चित्र होता है और आप इसे फिर से जोड़ते हैं, या तो आप उस प्रीपेयर फॉर रीय्यूज विधि को हटा दें या जैसा कि मैंने ऊपर बताया है वैसा ही करें।

***** Custom Cell ***** 
// 
// CustomCell.m 
// Custom 
// 
// Created by Syed Arsalan Pervez on 2/8/13. 
// Copyright (c) 2013 SAPLogix. All rights reserved. 
// 

#import "CustomCell.h" 

@implementation CustomCell 

- (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier 
{ 
    self = [super initWithStyle:style reuseIdentifier:reuseIdentifier]; 
    if (self) { 
     // Initialization code 
     _separatorImage = [[UIImageView alloc] initWithFrame:CGRectZero]; 
     [[self contentView] addSubview:_separatorImage]; 
    } 
    return self; 
} 

- (void)prepareForReuse 
{ 
    _separatorImage.image = nil; 
} 

- (void)dealloc 
{ 
    [_separatorImage release]; 
    [super dealloc]; 
} 

@end 

दृश्य नियंत्रक में उपरोक्त सेल का उपयोग करना।

***** Test View Controller ***** 
// 
// TestViewController.m 
// Custom 
// 
// Created by Syed Arsalan Pervez on 2/8/13. 
// Copyright (c) 2013 SAPLogix. All rights reserved. 
// 

#import "TestViewController.h" 
#import "CustomCell.h" 

@interface TestViewController() 

@end 

@implementation TestViewController 

- (void)viewDidLoad 
{ 
    [self.tableView setSeparatorStyle:UITableViewCellSeparatorStyleNone]; 

#warning TODO: set the image name here 
    _separatorImage1 = [[UIImage imageNamed:@""] retain]; 
    _separatorImage2 = [[UIImage imageNamed:@""] retain]; 
} 

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView 
{ 
    return 1; 
} 

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section 
{ 
    return 2; 
} 

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

    //Set Separator Image Here 
    //Preload the image so it doesn't effect the scrolling performance 
    CGRect frame = cell.contentView.frame; 
    switch (indexPath.row) 
    { 
     case 0: 
      cell.separatorImage.image = _separatorImage1; 
      cell.separatorImage.frame = CGRectMake(0, CGRectGetMaxY(frame)-1, frame.size.width, 1); 
      break; 
     case 1: 
      cell.separatorImage.image = _separatorImage2; 
      cell.separatorImage.frame = CGRectMake(frame.origin.x+5, CGRectGetMaxY(frame)-1, frame.size.width-10, 1); 
      break; 
    } 

    return cell; 
} 

- (void)dealloc 
{ 
    [_separatorImage1 release]; 
    [_separatorImage2 release]; 

    [super dealloc]; 
} 

@end 
+0

आप कोड :) – user1899840

1

का समाधान हो सकता है मैं इसे इस तरह से करना ... आशा यह मदद कर सकता है।

// 
// UITableViewCell+MyAdditions.h 
// 
// Created by Roberto O. Buratti on 19/02/14. 
// 

#import <UIKit/UIKit.h> 

@interface UITableViewCell (MyAdditions) 

@property (nonatomic,assign) UITableViewCellSeparatorStyle cellSeparatorStyle; 
@property (nonatomic,strong) UIColor *cellSeparatorColor; 

@end 

// 
// UITableViewCell+MyAdditions.m 
// 
// Created by Roberto O. Buratti on 19/02/14. 
// 

#import "UITableViewCell+MyAdditions.h" 

NSString *const kUITablewViewCellSeparatorLayerName = @"kUITablewViewCellSeparatorLayerName"; 

@implementation UITableViewCell (MyAdditions) 

-(CALayer *)separatorLayer 
{ 
    for (CALayer *sublayer in self.layer.sublayers) 
    { 
     if ([sublayer.name isEqualToString:kUITablewViewCellSeparatorLayerName]) 
      return sublayer; 
    } 
    return nil; 
} 

-(CALayer *)newSeparatorLayer 
{ 
    CALayer *separatorLayer = [CALayer layer]; 
    separatorLayer.name = kUITablewViewCellSeparatorLayerName; 
    separatorLayer.frame = CGRectMake(0, self.bounds.size.height - 1, self.bounds.size.width, 1); 
    separatorLayer.backgroundColor = [UIColor whiteColor].CGColor; 
    [self.layer addSublayer:separatorLayer]; 
    return separatorLayer; 
} 

-(UITableViewCellSeparatorStyle)cellSeparatorStyle 
{ 
    CALayer *separatorLayer = [self separatorLayer]; 
    if (separatorLayer == nil) 
     return UITableViewCellSeparatorStyleNone; 
    else 
     return UITableViewCellSeparatorStyleSingleLine; 
} 

-(void)setCellSeparatorStyle:(UITableViewCellSeparatorStyle)separatorStyle 
{ 
    CALayer *separatorLayer = [self separatorLayer]; 
    switch (separatorStyle) 
    { 
     case UITableViewCellSeparatorStyleNone: 
      [separatorLayer removeFromSuperlayer]; 
      break; 
     case UITableViewCellSeparatorStyleSingleLine: 
      if (separatorLayer == nil) 
       separatorLayer = [self newSeparatorLayer]; 
      break; 
     default: 
      @throw [NSException exceptionWithName:NSStringFromClass([self class]) reason:@"Unsupported separatorStyle" userInfo:nil]; 
      break; 
    } 
} 

-(UIColor *)cellSeparatorColor 
{ 
    CALayer *separatorLayer = [self separatorLayer]; 
    return [UIColor colorWithCGColor:separatorLayer.backgroundColor]; 
} 

-(void)setCellSeparatorColor:(UIColor *)separatorColor 
{ 
    CALayer *separatorLayer = [self separatorLayer]; 
    if (separatorLayer == nil) 
     separatorLayer = [self newSeparatorLayer]; 
    separatorLayer.backgroundColor = separatorColor.CGColor; 
} 

@end 

अब आप

UITableViewCell *cell = ... 
cell.cellSeparatorStyle = UITableViewCellSeparatorStyleSingleLine; 
cell.cellSeparatorColor = [UIColor orangeColor]; 
+0

मूल्यवान मूल्य निर्धारण, कि अगर 'सेलसेपरेटर स्टाइल' के बजाय संपत्ति के लिए 'विभाजक स्टाइल' नाम का उपयोग किया जाता है, तो सेल अपने अजीब विभाजक को आकर्षित करेगा चाहे कोई फर्क नहीं पड़ता। यह आवश्यक है कि आप अपने 'UITableViewCell' वंश पर ऐसी संपत्ति न बनाएं। –

0

जैसे काम कर सकें जैसा कि अन्य लोगों ने कहा, आम तौर पर वहाँ ऐसा करते हैं, या तो एक CALayer या 1px के UIView विभाजक बना सकते हैं और contentView में जोड़ने के लिए दो तरीके हैं।

समय के साथ मैंने कई परियोजनाओं को अलग-अलग किया है, और कभी-कभी, में प्रोजेक्ट में कई अलग-अलग तरीकों से भी कई अलग-अलग तरीके हैं। सेल पुन: उपयोग की वजह से बग पेश करना भी आसान है और पिक्सेल लाइनों के उचित प्रतिपादन के लिए, किसी को स्क्रीन स्केल को शामिल करना होगा: (1.0/[UIScreen mainScreen].scale)

मैंने library बनाया है जो इसे केवल एक विधि वर्ग में सरल बनाता है, जिसमें कोई सबक्लासिंग आवश्यक नहीं है। https://github.com/kgaidis/KGViewSeparators

ऑब्जेक्टिव-सी:

[view kg_show:YES separator:KGViewSeparatorTop color:[UIColor blackColor] lineWidth:KGViewSeparatorLineWidth(1.0) insets:UIEdgeInsetsMake(0, 15.0, 0, 15.0)];

स्विफ्ट:

view.kg_show(true, separator: .Bottom, color: UIColor.blackColor(), lineWidth: KGViewSeparatorLineWidth(1.0), insets: UIEdgeInsetsZero)

संबंधित मुद्दे