Linkage between iOS two TableView, TableView and CollectionView

Linkage between two TableView, linkage between TableView and CollectionView This is a theme created 359 days ago, where information may have evolved or changed. [linkage]: linkage between the two TableView, the linkage between TableView and CollectionView preface

Now there are many apps on the market have linkage function, there are some two TableView between the linkage, such as the United States to sell outside, Baidu takeout, hungry and so on. There are some linkage between TableView and CollectionView, such as gift saying and so on.

This article imitated the American group takeaway and the gift said, respectively realizes the two TableView between and the Tablview and the collectionview between the linkage effect, looks below the GIF chart.

A demo download link to the GIF is attached, [Code4app] with the demo to see the article, the effect will be better.

The linkage between body one, TableView and TableView

The following is the main idea of implementing linkage between two TableView:

First parse the data loading model, objectWithDictionary: is to convert the dictionary into a model, this tool is I write with runtime, a line of code parsing data, the specific use of the method can refer to my Jane book another article [Objective-c in the runtime].

NSString *path = [[NSBundle Mainbundle] Pathforresource:@ "Meituan" OfType:@ "JSON"];NSData *data = [NSData Datawithcontentsoffile:path];nsdictionary *dict = [nsjsonserialization Jsonobjectwithdata:data options:nsjsonreadingallowfragments Error: nil]; nsarray *foods = Dict[@ "Data"][@ " Food_spu_tags "]; for (nsdictionary *dict in Foods ) {Categorymodel *model = [Categorymodel objectwithdictionary:dict]; [self.categorydata Addobject:model]; nsmutablearray *datas = [nsmutablearray array]; for (Foodmodel *f_model in model.spus) {[Datas Addobject:f_model];} [self.fooddata Addobject:datas];}          

The

defines two Tableview:lefttableview and Righttableview.

 -(uitableviewcell *) TableView: (uitableview *) TableView Cellforrowatindexpath: (nsindexpath *) IndexPath {if (_lefttableview = tableView) {Lefttableviewcell *cell = [TableView dequeuer        Eusablecellwithidentifier:kcellidentifier_left Forindexpath:indexpath]; Foodmodel *model = self.categorydata[indexpath.row]; cell.name.text = model.name; return cell; } else {Righttableviewcell *cell = [TableView dequeuereusablecellwithidentifier: Kcellidentifier_right Forindexpath:indexpath]; Foodmodel *model = self.productdata[indexpath.section][indexpath.row]; Cell.model = model ; return Cell;}           

First the left TableView Association to the right of the TableView: Click on the left side of the Tableviewcell, the right TableView jump to the corresponding partition list header.

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(nonnull NSIndexPath *)indexPath{    if (_leftTableView == tableView)    {        _selectIndex = indexPath.row;        [_rightTableView scrollToRowAtIndexPath:[NSIndexPath indexPathForRow:0 inSection:_selectIndex] atScrollPosition:UITableViewScrollPositionTop animated:YES]; }}

Then the right side of the TableView Association to the left of the TableView: mark the direction of the Righttableview scroll, and then the TableView partition title will show and show the end of the proxy function inside the processing logic.

• 1. In the TableView section heading will be displayed inside, judging the current TableView is Righttableview, righttableview the direction of the slide upward, Righttableview is the user dragged and produced scrolling (the main judgment right TableView is the user drag, or click Lefttableview scrolling), if the three are set up, then lefttableview the selected line is the current section of Righttableview.
• 2. At the end of the TableView section title display, judging the current TableView is Righttableview, the direction of the slide downward, Righttableview is the user dragged and generated scrolling, if the three are set up, then Lefttableview The selected line is the current section-1 of Righttableview.

Mark the scroll direction of the Righttableview, up or down-(void) Scrollviewdidscroll: (Uiscrollview *) scrollview{StaticCGFloat lastoffsety =0;UITableView *tableview = (UITableView *) ScrollView;if (_righttableview = = TableView) {_isscrolldown = Lastoffsety < Scrollview.contentoffset.y; lastoffsety = ScrollView. Contentoffset.y; }}TableView section title is about to show-(void) TableView: (UITableView *) TableView Willdisplayheaderview: (nonnullUIView *) View forsection: (Nsinteger) section{The current TableView is Righttableview, righttableview the direction of the scroll upward, Righttableview is the user dragged and produced scrolling (the main judgment righttableview the user dragged and scrolled, or click Lefttableview and rolling)if ((_righttableview = = TableView) &&!_isscrolldown && _righttableview.dragging) {[Self selectrowatindexpath:section]; }}TableView section title Show End-(void) TableView: (UITableView *) TableView Didenddisplayingheaderview: (UIView *) View forsection: (nsinteger) section{ //Current TableView is Righttableview, Righttableview scrolling in the direction downward, Righttableview is user-dragged and produces scrolling (main judgment Ri Ghttableview If the user is dragging and scrolling, or clicking Lefttableview and Scrolling) if ((_righttableview = = TableView) && _isscrolldown & & _righttableview.dragging) {[Selfselectrowatindexpath:section + 1];}} //When dragging the right TableView, handle left tableview-(void) Selectrowatindexpath: (nsinteger) index{[_lefttableview selectrowatindexpath:[nsindexpath indexpathforrow:index insection:0] Animated:YES scrollposition: uitableviewscrollpositiontop];}           

This achieves the linkage between the two TableView, is not very simple.

Second, the linkage between TableView and CollectionView

The linkage between TableView and CollectionView is similar to the linkage logic between the two TableView.

The following is the main idea of realizing the linkage between TableView and CollectionView:

Again, the data loading model is parsed first.

NSString *path = [[NSBundle Mainbundle] Pathforresource:@ "Liwushuo" OfType:@ "JSON"];NSData *data = [NSData Datawithcontentsoffile:path];Nsdictionary *dict = [nsjsonserialization jsonobjectwithdata:data options: Nsjsonreadingallowfragments error:nil]; nsarray *categories = Dict[@ "Data" [ @ "categories"]; for (nsdictionary *dict in Categories) {Collectioncategorymodel *model = [Collectioncategorymodel objectwithdictionary:dict]; [self.datasource Addobject:model]; nsmutablearray *datas = [nsmutablearray array]; for (Subcategorymodel *smodel in model.subcategories) {[Datas addObject: Smodel]; } [self.collectiondatas Addobject:datas];}        

Define a TableView, a collectionview.

- (UITableViewCell *) TableView: (uitableview *) TableView Cellforrowatindexpath: ( Nsindexpath *) indexpath{Lefttableviewcell *cell = [TableView dequeuereusablecellwithidentifier:kcellidentifier_left    Forindexpath:indexpath];    Collectioncategorymodel *model = self.datasource[indexpath.row]; Cell.name.text = Model.name; return Cell;} -(uicollectionviewcell *) CollectionView: ( Uicollectionview *) CollectionView Cellforitematindexpath: (NSIndexPath *) indexPath{ Collectionviewcell *cell = [CollectionView Dequeuereusablecellwithreuseidentifier:kcellidentifier_collectionview Forindexpath:indexpath]; Subcategorymodel *model = self.collectiondatas[indexpath.section][indexpath.row]; Cell.model = model; return cell;         

First the TableView Association CollectionView, click Tableviewcell, the right side of the CollectionView jump to the corresponding partition list header.

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{    _selectIndex = indexPath.row;    [self.collectionView scrollToItemAtIndexPath:[NSIndexPath indexPathForItem:0 inSection:_selectIndex] atScrollPosition:UICollectionViewScrollPositionTop animated:YES];}

Then associate the CollectionView with TableView, mark the scroll direction of the Righttableview, and then deal with the logic in the proxy function that will show and show the end of the CollectionView partition title respectively.

• 1. In the CollectionView section heading will be displayed inside, judging the current collectionview scrolling direction upward, CollectionView is the user dragged and produced scrolling (mainly to determine the CollectionView is the user drag and scroll, or click TableView and scroll), if both are true, then TableView's selected line is the current section of CollectionView.
• 2. At the end of the CollectionView section title display, judging the current collectionview scrolling direction downward, CollectionView is the user dragged and generated scrolling, if both are established, then the TableView of the selected row is The current section-1 of the CollectionView.

Mark the scroll direction of the CollectionView, up or down-(void) Scrollviewdidscroll: (Uiscrollview *) scrollview{Staticfloat lastoffsety =0;if (Self.collectionview = = ScrollView) {_isscrolldown = Lastoffsety < Scrollview.contentoffset.y; lastoffsety = ScrollVie W.contentoffset.y; }}CollectionView section title is about to show-(void) CollectionView: (Uicollectionview *) CollectionView Willdisplaysupplementaryview: (Uicollectionreusableview *) View Forelementkind: (NSString *) Elementkind Atindexpath: (Nsindexpath *) indexpath{The current CollectionView scrolling direction upward, CollectionView is the user drag and drop to produce scrolling (mainly to determine whether the CollectionView is user drag and scroll, or click TableView and scroll)if (!_isscrolldown && collectionview.dragging) {[Self selectRowAtIndexPath:indexPath.section]; }}CollectionView section title Show End-(void) CollectionView: (Uicollectionview *) CollectionView Didenddisplayingsupplementaryview: (nonnullUicollectionreusableview *) View Forelementofkind: (nonnullnsstring *) Elementkind Atindexpath: (nonnull NSIndexPath *) indexpath{//the current CollectionView rolling direction downward, CollectionView is the user dragged and produced scrolling (mainly to Judge CollectionView is the user dragging and scrolling, or clicking TableView and scrolling) if (_isscrolldown && collectionview.dragging) {[ Span class= "Hljs-keyword" >self selectRowAtIndexPath:indexPath.section + 1]; }}//when dragging CollectionView, handle tableview-(void) Selectrowatindexpath: (nsinteger) index{[self.tableView Selectrowatindexpath:[nsindexpath indexpathforrow:index inSection: 0] animated:yes scrollposition: Uitableviewscrollpositionmiddle];}             

The linkage between TableView and CollectionView is so realized, is it also very simple.

Linkage between iOS two TableView, TableView and CollectionView