iOS-UI-导航控制器-导航栏

导航控制器

• 导航控制器：UINavigationController

UINavigationController是iOS提供的一个导航视图控制器，它必须设置一个RootViewController根控制器，页面跳转时，通过它将下一个子ViewController的视图添加到RootViewController的视图中。

导航控制器的基本创建方法

• 1⃣️.先创建一个根视图控制器
• 
• 对于新版的Xcode 我们不需要自己创建一个window，系统已经创建好了window，之前是在 AppDelegate.m文件里创建一个window并且创建一个根视图控制器，但现在SceneDelagate,m的文件里直接创建根视图控制器即可
• 在SceneDelagate.m里的 (void)scene:(UIScene *)scene willConnectToSession:(UISceneSession *)session options:(UISceneConnectionOptions *)connectionOptions {方法执行如下代码即可
• • 创基一个根视图控制器

VcRoot* root = [[VcRoot alloc] init];

• • 把该根视图控制器赋值给导航控制器 ， 因为导航控制器本身没有视图

UINavigationController* nav = [[UINavigationController alloc] initWithRootViewController:root];

• • 将windows的根视图设置为导航控制器

 self.window.rootViewController = nav;

• 2⃣️ 对根视图控制器的界面进行设计
• • 打开我们创建的VcRoot.m文件

  导航控制器的基本框架如下图所示

• UINavigationitem 的框架（我们把VcRoot作为了现在的UINavigationitem ）
• • 设置 UINavigationitem 界面
• • 导航栏文字

self.title = @" 根视图";
self.navigationItem.title = @"title";
//如果没有设置 navigationItem.title 为 nil
     系统自动把    self.title  作为标题
     不为空 navigationItem.title = @"title"; 为标题内容

添加单个按钮🔘

• • 添加按钮🔘 UIBarButtonItem （注意和普通🔘UIButton区分）
• • • 按钮函数的创建，创建一个左按钮，其中有4个参数，类似于UIButton的事件
• • • • 参数 1： 按钮文字
        参数 2 按钮风格 UIBarButtonItemStyleDone
        参数 3 事件拥有者 self
        参数 4 按钮事件 @selector(pressLeft)];

UIBarButtonItem* leftBtn = [[UIBarButtonItem alloc]initWithTitle:@"返回上一级 " style:UIBarButtonItemStyleDone target:self action:@selector(pressLeft)];

• • 导航元素项的左侧按钮赋值，设置出了一个按钮之后给导航栏的按钮赋值，注意区分是左按钮还是右按钮，上边创建的是一个左按钮，我们就给左按钮赋值

  self.navigationItem.leftBarButtonItem = leftBtn;

添加多个按钮🔘

• 若上我们个导航控制器添加了一个左按钮，上面的方法只能给导航控制器添加单个按钮，接下来添加多个按钮，以给右边添加按钮实例
• • 添加右侧按钮， 本次添加按照系统风格nitWithBarButtonSystemItem添加

---

UIBarButtonItem* rightBtn = [[UIBarButtonItem alloc]
initWithBarButtonSystemItem:UIBarButtonSystemItemAdd target:self action:@selector(pressRight)];
    
    self.navigationItem.rightBarButtonItem = rightBtn;
    

• • 给右侧按钮赋值

self.navigationItem.rightBarButtonItem = rightBtn;

• 再创建一个Label添加上去，注意我们先创建一个Label对象，然后通过添加到导航控制器的方法添加上即可
• • Label的创建

 UILabel* label1 = [[UILabel alloc]initWithFrame:CGRectMake(10, 10, 50, 40)];
    
    label1.text = @"MyTest";
    label1.textColor = [UIColor brownColor];
    // 创建一个label控件

• • 该方法将任何类型的控件添加到导航按钮的方法

UIBarButtonItem * item = [[UIBarButtonItem alloc]initWithCustomView:label1];

⚠️‼️创建按钮数组

• 当我们需要把多个按钮赋值给导航控制器的一边时，就需要用到我们iOS讲义学的数组
• • 把按钮都存到数组里面，然后把数组赋值给

 NSArray *arrayBtn = [NSArray arrayWithObjects:rightBtn,item, nil];
    // 将右侧按钮数组赋值
    self.navigationItem.rightBarButtonItems = arrayBtn;
    

导航控制器效果

• 添加上面写的pressLeft And pressRight事件

- (void) pressLeft {
    NSLog(@" Left Press!");
}

- (void) pressRight {
    NSLog(@" Right pressd");
}

导航控制器的切换

先看这样一张图

图上显示的是一种层级关系，接下来展示如何实现这种层级关系–导航控制器的切换

• 为了更好的显示这种层级关系到的切换，在左侧添加三个视图，VcRoot作为根视图（第一控制层级）

• 创建了VCRoot，VcSecond。VcThird三个视图

VcRoot

• 设置导航控制器的透明度，默认透明，此版本下的Xcode不透明情况下显示黑色，透明的话会和背景颜色一样，所以我们设置不透明之后再改一下背景颜色

self.navigationController.navigationBar.translucent = NO;
    // 导航拦颜色
    self.navigationController.navigationBar.backgroundColor = [UIColor whiteColor];

设置VcRoot的背景图颜色

    self.view.backgroundColor = [UIColor blueColor];

• 添加title和 UIBUttonItem 此处的事件函数重点照看

 self.title   = @"根视图";
    
    UIBarButtonItem* next = [[UIBarButtonItem alloc]initWithTitle:@"下一界面" style:UIBarButtonItemStylePlain target:self action:@selector(pressNext)];
     
    self.navigationItem.rightBarButtonItem = next;

界面切换事件函数

• 事件函数

-(void) pressNext {
    // 创建新的视图控制器
    VcScend* vcScend = [[VcScend alloc] init];
    
    // 使用当前视图控制器的导航控制器对象-UINavigationController
 
    [self.navigationController pushViewController:vcScend animated:YES];
    
}

• • 切换事件函数的模板
    在函数里创建子层级的视图，然后调用 pushViewController 把创建的子层级视图作为参数传入
    效果

• 点击下一界面跳转到Second界面

• 在第二视图界面跳转到第三视图界面
• 添加Next函数

- (void) pressScNext {
    VcThird *vThird = [[VcThird alloc] init];
    
    [self.navigationController pushViewController:vThird animated:YES];
}

注意我们要进行到下一个界面的时候只需要创建一个右按钮即可，当系统跳转到下一层级界面的时候会自动生成一个返回上一层级的左边按钮🔘，按钮的名称系统自动设为上一层级界面的title

• 第三级视图直接返回第一级视图

-(void) pressR {
    // 直接返回到根视图
    [self.navigationController 
    popToRootViewControllerAnimated:YES];
}

以上就是UI导航视图控制器，以后持续更新UI控件