Table extensible dans iphone
Je veux faire ce type de extensible/pliable vue de table . Il y a des catégories et sous-catégories comme dans l'image . Par exemple "santé et beauté" est une catégorie et quand je clique sur cette cellule que sa ouvrir les sous-catégories comme dans l'image ci-dessous . Alors, comment puis-je créer ce type de vue sous forme de tableau?.
Enfin, j’obtiens deux liens d’aide très utiles ci-dessous, décrivant exactement le besoin ici Développer/Réduire les sections TableView
Vue de table pliante pour iOS
Vraiment, de bons articles pour ce type de sections tableview en expansion/réduction
Utiliser le code suivant pour une cellule extensible dans UITableView
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *CellIdentifier = @"Cell";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
if (cell == nil) {
cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] autorelease];
}
cell.textLabel.text=[[self.arForTable objectAtIndex:indexPath.row] valueForKey:@"name"];
[cell setIndentationLevel:[[[self.arForTable objectAtIndex:indexPath.row] valueForKey:@"level"] intValue]];
return cell;
}
code pour développer et réduire des lignes - Méthode TableView DidSelectRow
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
[tableView deselectRowAtIndexPath:indexPath animated:YES];
NSDictionary *d=[self.arForTable objectAtIndex:indexPath.row];
if([d valueForKey:@"Objects"]) {
NSArray *ar=[d valueForKey:@"Objects"];
BOOL isAlreadyInserted=NO;
for(NSDictionary *dInner in ar ){
NSInteger index=[self.arForTable indexOfObjectIdenticalTo:dInner];
isAlreadyInserted=(index>0 && index!=NSIntegerMax);
if(isAlreadyInserted) break;
}
if(isAlreadyInserted) {
[self miniMizeThisRows:ar];
} else {
NSUInteger count=indexPath.row+1;
NSMutableArray *arCells=[NSMutableArray array];
for(NSDictionary *dInner in ar ) {
[arCells addObject:[NSIndexPath indexPathForRow:count inSection:0]];
[self.arForTable insertObject:dInner atIndex:count++];
}
[tableView insertRowsAtIndexPaths:arCells withRowAnimation:UITableViewRowAnimationLeft];
}
}
}
Une méthode qui aidera à minimiser et à maximiser/développer/réduire-réduire les lignes.
-(void)miniMizeThisRows:(NSArray*)ar{
for(NSDictionary *dInner in ar ) {
NSUInteger indexToRemove=[self.arForTable indexOfObjectIdenticalTo:dInner];
NSArray *arInner=[dInner valueForKey:@"Objects"];
if(arInner && [arInner count]>0){
[self miniMizeThisRows:arInner];
}
if([self.arForTable indexOfObjectIdenticalTo:dInner]!=NSNotFound) {
[self.arForTable removeObjectIdenticalTo:dInner];
[self.tableView deleteRowsAtIndexPaths:
[NSArray arrayWithObject:[NSIndexPath indexPathForRow:indexToRemove inSection:0]]
withRowAnimation:UITableViewRowAnimationRight];
}
}
}
Si cela vous aide: [Accédez aux sections extensibles et réductibles de uitableview] https://github.com/OliverLetterer/UIExpandableTableView
J'ai une approche légèrement différente des vues de table extensibles - une approche qui s'aligne sur la manière dont ces types de vues de table sont généralement construits.
Il y a en-têtes et il y a cells. Headers devrait être tappable, puis cells sous les en-têtes serait _ {afficher ou masquer. Cela peut être réalisé en ajoutant un identificateur de geste à l'en-tête, et lorsque vous appuyez dessus, vous supprimez simplement toutes les cellules situées sous cet en-tête (la section) et vice versa (ajout de cellules). Bien sûr, vous devez conserver les en-têtes "ouverts" et les en-têtes "fermés".
C'est bien pour deux raisons:
- Le travail des en-têtes et des cellules est séparé, ce qui rend le code plus propre.
- Cette méthode décrit parfaitement la manière dont les vues de tableau sont construites (en-têtes et cellules) et, par conséquent, il n’ya pas beaucoup de magie: le code supprime ou ajoute simplement des cellules et devrait être compatible avec les versions ultérieures d’iOS.
J'ai créé une bibliothèque très simple pour y parvenir. Tant que votre vue tableau est configurée avec des en-têtes et des cellules de section UITableView, il vous suffit de sous-classer la vue tableau et l'en-tête. Essayez-le :)
Lien: https://github.com/fuzz-productions/FZAccordionTableView
Essayez d’utiliser ce code ... Peut-être que cela peut aider ... et vous pouvez modifier le code en fonction de vos besoins ...
#import "ViewController.h"
#import <QuartzCore/QuartzCore.h>
@interface ViewController ()
@end
@implementation ViewController
@synthesize myTable;
- (void)viewDidLoad
{
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
//myTable.backgroundColor=[UIColor clearColor];
// self.view.backgroundColor=[UIColor colorWithPatternImage:[UIImage imageNamed:@"wood.png"]];
muArr= [[NSMutableArray alloc]initWithObjects:@"Vinay",@"Anmol",@"Jagriti", nil];
ExpArr=[[NSMutableArray alloc]initWithObjects:@"Useeee",@"Thissss",@"Codeee", nil];
otherExpand=100;
checker=100;
}
-(NSInteger) numberOfSectionsInTableView:(UITableView *)tableView
{
return muArr.count;
}
-(NSInteger) tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
if(otherExpand==section)
return ExpArr.count;
return 0;
}
-(BOOL)tableView:(UITableView *)table canCollapse:(NSIndexPath *)indexPath
{
return NO;
}
-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
static NSString *Identifier=@"Cell";
UITableViewCell *cell=[tableView dequeueReusableCellWithIdentifier:Identifier];
if (cell==nil)
{
cell=[[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:Identifier];
}
cell.textLabel.text=[ExpArr objectAtIndex:indexPath.row];
cell.textLabel.backgroundColor=[UIColor clearColor];
UIView *viewww=[[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 44)];
viewww.backgroundColor=[UIColor colorWithPatternImage:[UIImage imageNamed:@"wood.png"]];
cell.backgroundView=viewww;
// cell.backgroundColor=[UIColor colorWithPatternImage:[UIImage imageNamed:@"wood.png"]];
[tableView setSeparatorStyle:UITableViewCellSeparatorStyleSingleLineEtched];
[tableView setSeparatorColor:[UIColor purpleColor]];
return cell;
}
-(UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
{
UIView *view1=[[UIView alloc]initWithFrame:CGRectMake(0, 0, 320, 44)];
[view1.layer setCornerRadius:20];
view1.layer.borderWidth=2;
view1.layer.borderColor=[UIColor brownColor].CGColor;
UILabel *label=[[UILabel alloc]initWithFrame:CGRectMake(10, 0, 295, 44)];
label.backgroundColor=[UIColor clearColor];
label.text=[muArr objectAtIndex:section];
UIButton *btn=[UIButton buttonWithType:UIButtonTypeDetailDisclosure];
btn.frame=CGRectMake(280, -5, 50, 50);
btn.backgroundColor=[UIColor clearColor];
btn.tag=section;
view1.backgroundColor=[UIColor colorWithPatternImage:[UIImage imageNamed:@"wood.png"]];
label.textColor=[UIColor blackColor];
label.font=[UIFont fontWithName:@"American TypeWriter" size:18];
//btn.backgroundColor=[UIColor blackColor];
[view1 addSubview:btn];
[view1 addSubview:label];
[btn addTarget:self action:@selector(Btntap:) forControlEvents:UIControlEventTouchUpInside];
return view1;
}
-(void)Btntap : (UIButton *)btn
{
if(otherExpand!=100)
{
if (otherExpand==btn.tag)
{
NSMutableArray *tempArr2=[[NSMutableArray alloc]init];
for(int j=0;j<ExpArr.count;j++)
{
NSIndexPath *indexx1=[NSIndexPath indexPathForRow:j inSection:otherExpand];
[tempArr2 addObject:indexx1];
}
checker=0;
otherExpand=100;
[myTable deleteRowsAtIndexPaths:tempArr2 withRowAnimation:UITableViewRowAnimationAutomatic];
}
else
{
NSMutableArray *tempArr2=[[NSMutableArray alloc]init];
for(int j=0;j<ExpArr.count;j++)
{
NSIndexPath *indexx1=[NSIndexPath indexPathForRow:j inSection:otherExpand];
[tempArr2 addObject:indexx1];
}
checker=1;
otherExpand=100;
[myTable deleteRowsAtIndexPaths:tempArr2 withRowAnimation:UITableViewRowAnimationAutomatic];
}
}
if(checker!=0)
{
otherExpand=btn.tag;
//checker=
NSMutableArray *tempArr=[[NSMutableArray alloc]init];
for(int i=0;i<ExpArr.count;i++)
{
NSIndexPath *indexx=[NSIndexPath indexPathForRow:i inSection:btn.tag];
[tempArr addObject:indexx];
}
[myTable insertRowsAtIndexPaths:tempArr withRowAnimation:UITableViewRowAnimationAutomatic];
checker=1;
}
checker=100;
}
-(CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section
{
return 44;
}
@end
WWDC 2011 contient une superbe vidéo intitulée UITableView Modifications, conseils et astuces - session 125 qui montre comment procéder.
Consultez également l'exemple de code TVAnimationsGestures
Vous pouvez consulter cet exemple d'accordéon dans Swift: https://github.com/tadija/AEAccordion
Il a très peu de code pour créer un effet d'accordéon (pas en utilisant des sections mais des cellules), et en prime, il existe également une solution pour utiliser des fichiers XIB dans d'autres fichiers XIB (utile pour les cellules personnalisées utilisant des vues personnalisées).
S'il vous plaît essayez cet exemple:
meilleur exemple pour Expandable TableView
TLIndexPathTools peut faire ce genre de chose naturellement. En fait, il existe des extensions pour les sections extensibles et les structures arborescentes extensibles. Essayez d’exécuter le projet exemple Collapse pour les sections extensibles et le projet exemple Outline pour les arbres extensibles.
TLIndexPathTools présente l’avantage de pouvoir, en tant qu’API simple et de bas niveau, résoudre toutes sortes de problèmes de vue de table dynamique et de vue de collection en utilisant une approche commune. Et cela fonctionne de manière interchangeable avec les données de base et les baies standard.
Vous pouvez utiliser ExpyTableView
Ce qui fait une section extensible de votre cellule donnée. Compatible jusqu'à iOS 8.0. Vous aurez de la flexibilité en générant une vue de tableau extensible avec plusieurs cellules de vue de tableau. Il suffit de manipuler les séparateurs pour les états et personne ne saura alors que vous utilisez plusieurs cellules pour se développer.
Autres solutions: Vous manipulez la hauteur pour développer une cellule. Lorsqu'une mise à jour est nécessaire à la conception de la cellule, vous devez reconstruire toutes les contraintes de disposition automatique ou la logique dans le code.
ExpyTableView: Vous créez une vue sous forme de tableau extensible en utilisant plusieurs cellules, en les insérant et en les supprimant (ce qui peut signifier le développement et la réduction), vous aurez de grandes chances pour les futures demandes de conception. Tout ce que vous avez à faire est d’ajouter un nouveau UITableViewCell et d’écrire le code correspondant. Vous aurez facilement le nouveau design.
Tout ce que vous avez à faire est de import ExpyTableView et ensuite:
class ViewController: ExpyTableViewDataSource, ExpyTableViewDelegate {
@IBOutlet weak var expandableTableView: ExpyTableView!
// First, set data source and delegate for your table view.
override func viewDidLoad() {
super.viewDidLoad()
expandableTableView.dataSource = self
expandableTableView.delegate = self
}
// Then return your expandable cell instance from expandingCell data source method.
func expandableCell(forSection section: Int, inTableView tableView: ExpyTableView) -> UITableViewCell {
// this cell will be displayed at IndexPath with section: section and row 0
}
}
Vous pouvez voir que votre ancienne section de vue de table est maintenant une section de vue de table extensible. Vous pouvez également télécharger le projet example et voir des exemples plus détaillés.
Dans votre fichier .h
LoadCustomCell *cell1;
NSMutableArray *arrayForBool;
NSMutableArray *questionArray;
NSMutableArray *answerArray;
Dans votre fichier .m
viewDidLoadMethod {
_faqTblView.estimatedRowHeight = 30;
_faqTblView.rowHeight = UITableViewAutomaticDimension;
arrayForBool = [[NSMutableArray alloc]init];
_questionArray = [[NSMutableArray alloc]init];
_answerArray = [[NSMutableArray alloc]init];
for (int i = 0; i < _questionArray.count; i++) {
[arrayForBool addObject:@"0"];
}
self.faqTblView.dataSource = self;
self.faqTblView .delegate = self;
[self.faqTblView reloadData];
}
après ça
#pragma mark - TableView Datasource & Delegate Method.
-(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
return [_questionArray count];
}
- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section {
UILabel *lblText = [[UILabel alloc]initWithFrame:CGRectMake(0, 0, 260, 100)];
lblText.text = [_questionArray objectAtIndex:section];
return [lblText getLabelHeight] + 20;(created custom class)
}
-(UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section {
UITapGestureRecognizer *headerTapped = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(sectionHeaderTapped:)];
cell1 = [[[NSBundle mainBundle] loadNibNamed:@"LoadCustomCell" owner:self options:nil] objectAtIndex:0];
[cell1 setFrame:CGRectMake(0, 0, cell1.frame.size.width, cell1.frame.size.height)];
NSString *numStr = [NSString stringWithFormat:@"%ld. ",section + 1];
[cell1.sideMenuUserNameLabel setText:[numStr stringByAppendingString:[_questionArray objectAtIndex:section]]];
[cell1 setBackgroundColor:[UIColor lightGrayColor]];
cell1.tag = section;
[cell1 addGestureRecognizer:headerTapped];
return cell1;
}
- (void)sectionHeaderTapped:(UITapGestureRecognizer *)gestureRecognizer {
NSIndexPath *indexPath = [NSIndexPath indexPathForRow:0 inSection:gestureRecognizer.view.tag];
if (indexPath.row == 0) {
BOOL collapsed = [[arrayForBool objectAtIndex:indexPath.section] boolValue];
for (int i = 0; i < [_questionArray count]; i++) {
if (indexPath.section==i) {
[arrayForBool removeObjectAtIndex:i];
[arrayForBool insertObject:[NSString stringWithFormat:@"%d", !collapsed] atIndex:i];
}
}
NSLog(@"%@", arrayForBool);
[self.faqTblView reloadSections:[NSIndexSet indexSetWithIndex:gestureRecognizer.view.tag] withRowAnimation:UITableViewRowAnimationAutomatic];
for (NSIndexPath *indexPath in self.faqTblView.indexPathsForSelectedRows) {
[self.faqTblView deselectRowAtIndexPath:indexPath animated:NO];
}
cell1.imageView.transform = CGAffineTransformMakeRotation(M_PI);
}
}
-(UITableViewCell*)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
static NSString *questionCellIdentifier = @"questionCellIdentifier";
QuestionCustomCell *cell = [tableView dequeueReusableCellWithIdentifier:questionCellIdentifier];
if (cell == nil) {
NSArray * myNib;
myNib =[[NSBundle mainBundle]loadNibNamed:@"QuestionCustomCell" owner:self options:nil];
cell = (QuestionCustomCell *)[myNib lastObject];
}
BOOL manyCells = [[arrayForBool objectAtIndex:indexPath.section] boolValue];
if(manyCells){
cell.questionNameLbl.text = [_answerArray objectAtIndex:indexPath.section];
}
return cell;
}
Vérifiez ce lien:
http://iostechnotips.blogspot.in/2014/05/expandable-uitableview.html
-(UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
* Utilisez la méthode de délégué UITableViewviewForHeaderInSection et renvoyez un UIView personnalisé.
* Ajouter une UIButton en tant que sous-vue avec l'action "expandable: (id) sender", vérifiez l'ID de l'expéditeur en tant que numéro de section et rechargez la vue tableau.