iOS開發(fā)之多表視圖滑動切換示例（仿"頭條"客戶端）---優(yōu)化篇

2019-11-14 18:44:38

字體：大中小

供稿：網(wǎng)友

　　前幾天發(fā)布了一篇iOS開發(fā)之多表視圖滑動切換示例（仿"頭條"客戶端）的博客，之所以寫這篇博客，是因為一位iOS初學者提了一個問題，簡單的寫了個demo做了個示范，讓其在基礎(chǔ)上做擴展和改進。被CocoaChina中iOS模塊所收錄實在出乎我的意料，鏈接地址（http://www.cocoachina.com/ios/20150706/12370.html），在CocoaChina上看了下面的評論，Demo的問題確實有，優(yōu)化和改進的空間也是蠻大的。首先內(nèi)存問題是必須考慮的，不能把這么多的TabalView實例化后添加到ScrollView上，只要是做過iOS的小伙伴這個問題應(yīng)該不難看出。再一個是頭部按鈕多了以后會擠在一起，還有如果添加上網(wǎng)絡(luò)請求的話，沒做本地緩存，等一系列的問題。

　　在今天的博客中要做兩個優(yōu)化。第一：多個TableView的內(nèi)存問題。第二：頭部多個按鈕的顯示問題。今天的博客的內(nèi)容是在上一篇博客iOS開發(fā)之多表視圖滑動切換示例（仿"頭條"客戶端）做的優(yōu)化和擴展，同時也會在gitHub上更新一下Demo的代碼，廢話不多說，開始今天博客的主題。

　　一、多張表視圖的內(nèi)存問題解決方案

　　　　借鑒TableView中Cell的重用機制，我們就把之前的Demo中ScrollView上的TableView進行復用，在我的博客中用的是兩個TableView進行的交叉復用，當然你也可以用其他個數(shù)的TableView進行復用。下面是實例化ScrollView上的TableView的代碼，由下面的代碼可以看出只實例化2個TableView, 并且把初始化后的TableView放在了TableView的初始化的位置上。而在原來的Demo中 -(void) initDownTables 方法會實例化多個TableView, 這也是內(nèi)存問題的根源。

 1 #PRagma mark --初始化下方的TableViews 2 -(void) initDownTables{ 3      4     for (int i = 0; i < 2; i ++) { 5          6         UITableView *tableView = [[UITableView alloc] initWithFrame:CGRectMake(i * _mViewFrame.size.width, 0, _mViewFrame.size.width, _mViewFrame.size.height - TOPHEIGHT)]; 7         tableView.delegate = self; 8         tableView.dataSource = self; 9         tableView.tag = i;10         11         [_scrollTableViews addObject:tableView];12         [_scrollView addSubview:tableView];13     }14     15 }

　　上面的代碼減少了TableView的實例化，那么我們?nèi)绾芜M行復用呢？我個人采取的是改變TableView在ScrollView上的Frame, 并且刷新相應(yīng)的TableView, 下面的代碼是把TableView移動到當前顯示頁數(shù)，并且刷新TableView上的數(shù)據(jù)。代碼如下：

 1 #pragma mark --根據(jù)scrollView的滾動位置復用tableView，減少內(nèi)存開支 2 -(void) updateTableWithPageNumber: (NSUInteger) pageNumber{ 3     int tabviewTag = pageNumber % 2; 4      5     CGRect tableNewFrame = CGRectMake(pageNumber * _mViewFrame.size.width, 0, _mViewFrame.size.width, _mViewFrame.size.height - TOPHEIGHT); 6      7     UITableView *reuseTableView = _scrollTableViews[tabviewTag]; 8     reuseTableView.frame = tableNewFrame; 9     [reuseTableView reloadData];10 }

　　上面的方法在那調(diào)用呢？我是在ScrollView到達相應(yīng)的頁數(shù)時進行tableView的移動和數(shù)據(jù)的刷新。具體的調(diào)用代理方法如下：

 1 - (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView 2  3 { 4     if ([scrollView isEqual:_scrollView]) { 5         _currentPage = _scrollView.contentOffset.x/_mViewFrame.size.width; 6          7         _currentPage = _scrollView.contentOffset.x/_mViewFrame.size.width; 8          9         //    UITableView *currentTable = _scrollTableViews[_currentPage];10         //    [currentTable reloadData];11         12         [self updateTableWithPageNumber:_currentPage];13 14         return;15     }16     [self modifyTopScrollViewPositiong:scrollView];17 }

　　上面的代碼就可以實現(xiàn)TableView的復用了，并且減少了內(nèi)存開支。如有更好的解決方案，還請?zhí)岢觯瑫皶r的進行修改和改正。不希望大家只是“吐槽"和提出一些問題，我期待和大家交流和學習的是一些問題更好的解決方案。

　　二、頭部按鈕達到一定數(shù)量時，布局的顯示方案。

　　也是防新聞頭條的那種，按鈕多到一定個數(shù)時回使用ScrollView進行滾動。在本Demo中是超過6個按鈕就可以滑動，而6個以下是平分整個屏幕的寬度的。主要做的修改是把Button放到ScrollView上，找準時機，讓ScorllView進行滑動。下方的代碼是實例化TopScrollView，并把按鈕放到TopScrollView上：

 1 #pragma mark -- 實例化頂部的tab 2 -(void) initTopTabs{ 3     CGFloat width = _mViewFrame.size.width / 6; 4      5     if(self.tabCount <=6){ 6         width = _mViewFrame.size.width / self.tabCount; 7     } 8      9     _topMainView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, _mViewFrame.size.width, TOPHEIGHT)];10     11     _topScrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, _mViewFrame.size.width, TOPHEIGHT)];12     13     _topScrollView.showsHorizontalScrollIndicator = NO;14     15     _topScrollView.showsVerticalScrollIndicator = YES;16     17     _topScrollView.bounces = NO;18     19     _topScrollView.delegate = self;20     21     if (_tabCount >= 6) {22         _topScrollView.contentSize = CGSizeMake(width * _tabCount, TOPHEIGHT);23 24     } else {25         _topScrollView.contentSize = CGSizeMake(_mViewFrame.size.width, TOPHEIGHT);26     }27     28     29     [self addSubview:_topMainView];30     31     [_topMainView addSubview:_topScrollView];32     33     34     35     for (int i = 0; i < _tabCount; i ++) {36         37         UIView *view = [[UIView alloc] initWithFrame:CGRectMake(i * width, 0, width, TOPHEIGHT)];38         39         view.backgroundColor = [UIColor lightGrayColor];40         41         if (i % 2) {42             view.backgroundColor = [UIColor grayColor];43         }44         45         UIButton *button = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, width, TOPHEIGHT)];46         button.tag = i;47         [button setTitle:[NSString stringWithFormat:@"按鈕%d", i+1] forState:UIControlStateNormal];48         [button addTarget:self action:@selector(tabButton:) forControlEvents:UIControlEventTouchUpInside];49         [view addSubview:button];50         51         52         [_topViews addObject:view];53         [_topScrollView addSubview:view];54     }55 }

　　以上內(nèi)容實在之前的Demo的基礎(chǔ)上做的簡單的修改，Demo還在完善中，后期會加上網(wǎng)絡(luò)請求，本地緩存等。發(fā)表博客的初衷是與大家進行交流和學習，而不是看一些人進行吐槽。問題是在所難免，希望大家能提出問題所在，給出自己的解決方案，進行交流，共同進步。下方是Demo運行的效果：