iOS初級開發學習筆記：tablevView中，點選cell後下部彈出下級列表，需實現cell高變化

蘆葦科技App技術團隊發表於2019-04-28
iOS筆記View

實現的效果如下圖：

iOS初級開發學習筆記：tablevView中，點選cell後下部彈出下級列表，需實現cell高變化

點選入會門檻，按鈕開啟後會彈出需要的貢獻值填寫欄，按鈕關閉時會隱藏填寫欄。

確定大致思路：

開始看到頁面設計稿，頁面比較簡單，每一行都是一個label一個按鈕，所以先確定用tablevView畫，且tablevView建立在controller裡即可，正常建立cell，很容易得出左邊圖的原始佈局頁面。

重點是：

1.對按鈕進行判斷，僅當入會門檻右邊的按鈕選中時才會彈出輸入框。

2.cell的佈局變化。

第二點對我來說會比較難和煩，cell高需要自適應，弄的時候也有踩坑。

因為cell的最底部都是一條淺橫線，涉及到它們的狀態變化（顯示或者隱藏），所以最好建立它們的全域性變數，可以偷懶，直接

{
    UIImageView *_line;
}
複製程式碼

或者老老實實宣告屬性建立。

控制元件包含5個：

1.左側label、

2.右側開關button、

3.小紅圓勾選button

4.初始頁每個cell都有的底部橫線line、

5.輸入欄的底部橫線（這根線很重要，用來撐開自適應的佈局，即需要它確定bottom）。

其中2.的初始狀態要設為未選中；輸入欄的控制元件3.和4.和5.的初始狀態要設為隱藏。

開始：- (void)setLayout;方法裡進行控制元件佈局：

左側label和右側button和紅色勾選button正常寫佈局，重點是線：

每個cell都有的底部橫線不能設定bottom，而輸入欄的底部橫線則需要設定相對bottom位置，用於確定cell的底部在哪，撐開cell高度。

依然使用cell.index = indexPath.row;傳每行cell的下標。

因為左側label數量比較少，就不建立dataArray來賦值了，直接在setIndex方法裡進行判斷賦值：

- (void)setIndex:(NSInteger)index{
    _index = index;
    
    if(index == 0){
        self.leftTitle.text = @"入會驗證";
    }else if(index == 1){
        self.leftTitle.text = @"入會門檻";
    }else if (index == 2){
        self.leftTitle.text = @"不允許任何人入會";
    }
}

複製程式碼

按鈕的點選事件方法裡，進行判斷，當為入會門檻一行時，即index == 1時，且按鈕為選中狀態時，才會彈出輸入欄。

實現點選按鈕，選中和不選中狀態交替的語句為： self.rightButton.selected = !self.rightButton.selected;

直接貼點選事件的方法了吧：

- (void)buttonAction:(UIButton *)button{

    self.rightButton.selected = !self.rightButton.selected;
    
    if(button.tag == 1){
        if(self.index == 0){
            NSLog(@"驗證，開！");
        }else if (self.index == 1){
            NSLog(@"門檻，開！");
            if(self.rightButton.selected == YES){
                self.redDotButton.hidden = NO;
                self.valueTextField.hidden = NO;
                self.bline.hidden = NO;
                [self.redDotButton mas_updateConstraints:^(MASConstraintMaker *make) {
                    make.top.offset(49+15);
                    
                }];
                
            }else{
                self.redDotButton.hidden = YES;
                self.valueTextField.hidden = YES;
                self.bline.hidden = YES;
                [self.redDotButton mas_updateConstraints:^(MASConstraintMaker *make) {
                    make.top.offset(15);
                    
                }];
            }
            [self.subject sendNext:@"1"];
        }else if (self.index == 2){
            NSLog(@"允不允許");
        }
    }else if(button.tag == 2){
        NSLog(@"貢獻值勾選按鈕常為選中狀態");
    }

}
複製程式碼

相關文章