iOS開發--ChildViewController實現訂單頁的切換

本文轉載自查看原文 2016-03-22 11:59 2000 iOS開發

　　先不說廢話, 上效果圖, 代碼量也不大, 也不上傳github騙星星了, 你們復制粘貼下代碼, 就可以輕而易舉的弄出一個小demo.

　　這個代碼的實現並不復雜, 甚至於說非常簡單, 就是邏輯有點小繞, 下面將用代碼詳細講解下.

　　childViewController方便在一個vc上面呈現出這種多種vc的效果, 相信好處百度上面說的多了去了, 這里只說實現.

　　首先, 需要新建一個父vc和五個子vc, 這里就不多說了, 先給大家看看進入父vc后的上面的btn控件封裝, 以及方法回調.

　　IndentButtonView.h中代碼

1 #import "RootClassView.h"
2 
3 typedef void(^buttonBlock)(NSInteger);
4 
5 @interface IndentButtonView : RootClassView
6 
7 @property(nonatomic, copy)buttonBlock block;
8 
9 @end

　　這里聲明了一個具有整形參數的block閉包屬性, 用於捕獲button的tag值來作為參數回調.

　　IndentButtonView.m中代碼, 有我自己定義的宏和基類, 你們按照你們自己的習慣來寫就好.

 1 #import "IndentButtonView.h"
 2 #import "ALLHeaderFile.pch"
 3 @implementation IndentButtonView
 4 
 5 - (instancetype)initWithFrame:(CGRect)frame{
 6     self = [super initWithFrame:frame];
 7     if (self) {
 8         [self createButton];
 9     }
10     return self;
11 }
12 
13 - (void)createButton{
14     NSArray *nameArray = @[@"全部", @"待付款", @"待收貨", @"待評價", @"退換貨"];
15     for (NSInteger i = 0; i < 5; i++) {
16         UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
17         button.frame = CGRectMake(150 / 2 * i, 0, 150 / 2, self.H);
18         [button setTitle:nameArray[i] forState:UIControlStateNormal];
19         button.tag = 2006 + i;
20         [button addTarget:self action:@selector(buttonAction:) forControlEvents:UIControlEventTouchUpInside];
21         button.backgroundColor = [UIColor grayColor];
22         button.titleLabel.textColor = [UIColor redColor];
23         button.titleLabel.font = [UIFont systemFontOfSize:15];
24         [self addSubview:button];
25     }
26 }
27 
28 - (void)buttonAction:(UIButton *)button{
29     NSLog(@"第%ld個按鈕被點擊了", button.tag -2006);
30     _block(button.tag - 2006);
31 }
32 @end

　　當點擊button的時候, 觸發閉包傳值回調. 通過button的tag值判斷, 在閉包實現的地方也會有不同的結果. 這樣一個button按鈕條的封裝就完成了.

　　然后是外部的一個自定義cell, 我選擇了用四個imageView作為訂單四個狀態的按鈕. 這個自定義cell同樣聲明了一個閉包屬性, 作為以后的回調, 傳遞的也是imageView的tag值作為參數.

#import "RootClassTableViewCell.h"
#import "RootClassImageView.h"
typedef void(^indentBlock)(NSInteger);
@interface IndentTableViewCell : RootClassTableViewCell
@property(nonatomic, copy)indentBlock block;
@end

　　.m中代碼

 1 #import "IndentTableViewCell.h"
 2 #import "XCLHeader.h"
 3 #import "RootClassLabel.h"
 4 @implementation IndentTableViewCell
 5 
 6 - (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier
 7 {
 8     self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
 9     if (self) {
10         [self createCell];
11     }
12     return self;
13 }
14 
15 - (void)createCell
16 {
17     //訂單Label
18     RootClassLabel *indentLabel = [[RootClassLabel alloc]initWithFrame:CGRectMake(48, 18, 30, 15)];
19     indentLabel.text = @"訂單";
20     indentLabel.font = [UIFont systemFontOfSize:15];
21     [self.contentView addSubview:indentLabel];
22     
23     //查看全部訂單
24     RootClassLabel *checkIndentLabel = [[RootClassLabel alloc]initWithFrame:CGRectMake(SCREEN_WIDTH - (168 + 10 + 14 + 40) / 2, 38 / 2, 168 / 2, 28 / 2)];
25     checkIndentLabel.text = @"查看全部訂單";
26     checkIndentLabel.font = [UIFont systemFontOfSize:14];
27     [self.contentView addSubview:checkIndentLabel];
28     
29     RootClassImageView *imageView = [[RootClassImageView alloc]initWithFrame:CGRectMake(checkIndentLabel.X + checkIndentLabel.W + 5, checkIndentLabel.Y, 7, 14)];
30     [self.contentView addSubview:imageView];
31     
32     /**循環實例化imageView對象
33      *
34      *待付款
35      *
36      *待收貨
37      *
38      *待評價
39      *
40      *退換貨
41      *
42      */
43     
44     for (NSInteger i = 0; i < 4; i++) {
45         RootClassImageView *imageView = [[RootClassImageView alloc]initWithFrame:CGRectMake(41 + 167 / 2 * i, 117 / 2, 85 / 2, 85 / 2)];
46         //imageView增加tag值
47         imageView.tag = 2002 + i;
48         
49         //打開imageView交互
50         imageView.userInteractionEnabled = YES;
51         
52         //為imageView添加輕拍手勢
53         UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc]initWithTarget:self action:@selector(tapAction:)];
54         [imageView addGestureRecognizer:tap];
55         imageView.t;
56         [self.contentView addSubview:imageView];
57     }
58 }
59 
60 
61 - (void)tapAction:(UITapGestureRecognizer *)tap
62 {
63     _block(tap.view.tag - 2002);
64 }
65 
66 - (void)layoutSubviews
67 {
68     [super layoutSubviews];
69 }

　　自定義cell在重用池協議中代碼, 對閉包進行了實現, 同時傳遞值給要跳轉的vc.

 1         //訂單
 2         static NSString *indentifier = @"indent";
 3         IndentTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:indentifier];
 4         if (!cell) {
 5             cell = [[IndentTableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:indentifier];
 6             cell.selectionStyle = 0;
 7         }
 8         cell.block = ^(NSInteger index){
 9             //index就是通過block傳遞過來imageView的tag值.
10             MyIndentViewController *myIndentViewController = [MyIndentViewController new];
11             //當點擊imageView后, 將圖片的tag值傳遞給vc, vc通過這個值來布局, 以實現點擊不同的imageView, 使頁面中呈現不同的子視圖.
12             myIndentViewController.index = index + 1;
13             [self.navigationController pushViewController: myIndentViewController animated:1];
14         };
15         return cell;

　　可能上面傳tag值讓大家很迷茫, 現在把最重要的實現部分的VC代碼拿出來, 大家就好懂了.

1 #import "ViewController.h"
2 
3 @interface MyIndentViewController : ViewController
4 
5 @property(nonatomic, assign)NSInteger index;
6 
7 @end

  1 //我的訂單頁
  2 
  3 #import "MyIndentViewController.h"
  4 #import "ALLHeaderFile.pch"
  5 @interface MyIndentViewController ()
  6 @property(nonatomic, strong)IndentButtonView *buttonView;
  7 //子視圖
  8 @property(nonatomic, strong)AllIndentViewController *allIndentViewController;
  9 @property(nonatomic, strong)ObligationViewController *obligationViewController;
 10 @property(nonatomic, strong)WaitingReceiveViewController *waitingReceiveViewController;
 11 @property(nonatomic, strong)WaitingEvaluateViewController *waitingEvaluateViewController;
 12 @property(nonatomic, strong)ExchangeViewController *exchangeViewController;
 13 
 14 //當前視圖
 15 @property(nonatomic, strong)RootClassViewController *currentViewController;
 16 
 17 //視圖控制器數組
 18 @property(nonatomic, strong)NSMutableArray *viewControllerArray;
 19 
 20 
 21 @end
 22 
 23 @implementation MyIndentViewController
 24 
 25 
 26 - (void)loadView {
 27     [super loadView];
 28     //實例化buttonView
 29     _buttonView = [[IndentButtonView alloc]initWithFrame:CGRectMake(0, 69, SCREEN_WIDTH, 30)];
 30     [self.view addSubview:_buttonView];
 31     
 32     //添加視圖方法
 33     [self addViewController];
 34     
 35 }
 36 
 37 
 38 - (void)viewDidLoad {
 39     [super viewDidLoad];
 40     // Do any additional setup after loading the view.
 41     
 42     //實現buttonView的block
 43     __weak typeof (self) WeakSelf = self;
 44     _buttonView.block = ^(NSInteger sign){
 45         [WeakSelf changeChildViewController:sign];
 46     };
 47 }
 48 
 49 - (void)changeChildViewController:(NSInteger)sign {
 50     //通過block傳遞過來的tag值判斷切換視圖
 51     //如果點擊的button在當前頁, 則廢棄點擊操作
 52     if ((_currentViewController == _allIndentViewController && sign == 0) ||
 53         (_currentViewController == _obligationViewController && sign == 1) ||
 54         (_currentViewController == _waitingReceiveViewController && sign == 2) ||
 55         (_currentViewController == _waitingEvaluateViewController && sign == 3) ||
 56         (_currentViewController == _exchangeViewController && sign == 4)
 57         ) {
 58         return;
 59     }
 60     else{
 61         [self replaceOldViewCroller:_currentViewController newViewController:_viewControllerArray[sign]];
 62     }
 63 }
 64 
 65 - (void)addViewController {
 66     //視圖控制器數組
 67     _viewControllerArray = [NSMutableArray array];
 68     
 69     //設置子視圖的尺寸
 70     CGRect rect = CGRectMake(0, 109, SCREEN_HEIGHT, SCREEN_HEIGHT - 109);
 71     
 72     //實例化子視圖的vc
 73     _allIndentViewController = [AllIndentViewController new];
 74     _obligationViewController = [ObligationViewController new];
 75     _waitingReceiveViewController = [WaitingReceiveViewController new];
 76     _waitingEvaluateViewController = [WaitingEvaluateViewController new];
 77     _exchangeViewController = [ExchangeViewController new];
 78     
 79     //將子視圖的vc添加到一個可變數組中, 方便處理
 80     [_viewControllerArray addObject:_allIndentViewController];
 81     [_viewControllerArray addObject:_obligationViewController];
 82     [_viewControllerArray addObject:_waitingReceiveViewController];
 83     [_viewControllerArray addObject:_waitingEvaluateViewController];
 84     [_viewControllerArray addObject:_exchangeViewController];
 85     
 86     //偷懶
 87     for (NSInteger i = 0; i < 5; i++) {
 88         [_viewControllerArray[i] view].frame = rect;
 89     }
 90     
 91     //這塊是實現能夠在外面點擊不同的imageView進入不同頁面的關鍵, 通過屬性傳值確定視圖的內部布局
 92     [self.view addSubview:[_viewControllerArray[_index] view]];
 93     
 94     //將當前子視圖設置為傳值確定的子視圖
 95     _currentViewController = _viewControllerArray[_index];
 96     
 97     //將子視圖添加到父視圖上
 98     [self addChildViewController:_viewControllerArray[_index]];
 99 
100     
101 }
102 
103 #pragma mark 切換子視圖方法
104 
105 - (void)replaceOldViewCroller:(RootClassViewController *)oldViewController newViewController:(RootClassViewController *)newViewController{
106     
107     //將新的子視圖先添加到父視圖上
108     [self addChildViewController:newViewController];
109     
110     //這個方法是負責對子視圖進行切換的, 有幾個參數, 前兩個參數是切換前子視圖和切換后子視圖, 這個方法有個條件, 就是一定要兩個視圖都是當前父視圖的子視圖才可以切換, 所以在上面才會先添加子視圖, 后面的參數都應該很熟悉了, duration延時, options選項, 可以將動畫的枚舉類型給他, animations更不用說了, 動畫效果, 閉包的bool參數finish代表的是切換是否成功
111     [self transitionFromViewController:oldViewController toViewController:newViewController duration:.3 options:UIViewAnimationOptionTransitionCrossDissolve  animations:nil completion:^(BOOL finished) {
112         if (finished) {
113             //切換后將老視圖移除, 新的視圖設置為當前視圖
114             [oldViewController removeFromParentViewController];
115             _currentViewController = newViewController;
116             
117         }else{
118             
119             _currentViewController = oldViewController;
120             
121         }
122     }];
123 }
124 
125 
126 - (void)didReceiveMemoryWarning {
127     [super didReceiveMemoryWarning];
128     // Dispose of any resources that can be recreated.
129 }
130 
131 /*
132 #pragma mark - Navigation
133 
134 // In a storyboard-based application, you will often want to do a little preparation before navigation
135 - (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender {
136     // Get the new view controller using [segue destinationViewController].
137     // Pass the selected object to the new view controller.
138 }
139 */
140 
141 @end

　　通過這么簡單的幾步, 就實現了如上界面.

免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 IOS—通過ChildViewController實現view的切換用CSS實現Tab頁切換效果 Bootstrap實現標簽頁內容切換實現多頁簽切換效果 iOS開發tips-UINavigationBar的切換 iOS開發系列--視圖切換 ios開發-引導頁實現 iOS開發之蝦米音樂頻道選擇切換效果分析與實現 iOS開發——iOS國際化 APP內語言切換 JavaScript實現Tab標簽頁切換的最簡便方式