UI学习--分栏控制器

UI学习

  • 分栏控制器基础
    • 概念
    • 用法
  • 分栏控制器高级
    • 高级属性
  • 总结


分栏控制器基础

概念

分栏控制器可以理解为一个容器,可以容纳多个子视图控制器,并通过选项卡的方式进行切换。每个选项卡都与一个特定的视图控制器相关联,当用户点击不同的选项卡时,分栏控制器会自动切换到相应的视图控制器,显示对应的内容。
分栏控制器管理的视图关系为平行关系,而导航控制器管理的视图关系为层级关系
由以下几部分组成

  • 分栏控制器(TabBarController):作为主要的容器控制器,管理子视图控制器和选项卡。
  • 子视图控制器(ViewControllers):每个选项卡对应一个子视图控制器。每个子视图控制器负责管理和显示与其对应的内容。
  • 选项卡(Tabs):分栏控制器底部的一行固定标签,用于表示不同的功能或页面。可以通过点击不同的选项卡来切换到对应的子视图控制器。
  • 标题和图标(Title and Icon):每个选项卡通常包含一个标题和一个图标,用于显示相应子视图控制器的信息。

用法

先创建三个子视图控制器。我们在SceneDelegate文件中操作。
在这里插入图片描述

我们需要先创建控制器,然后创建分栏控制器对象,将所有需要被分栏控制器管理的对象添加到数组中,再将分栏控制器作为根视图控制器
我们介绍一下基础属性:

  • viewControllers:一个数组,用于指定每个选项卡对应的子视图控制器。可以通过设置该属性来添加或更改选项卡的数量和内容。
  • selectedIndex:当前选中的选项卡索引。可以通过设置该属性来切换选项卡,索引从0开始。
  • tabBar:分栏控制器的选项卡栏。可以通过该属性进行外观和行为的自定义设置,如修改选项卡的颜色、样式、图标等。
  • tabBar.tintColor:选项卡的颜色。可以设置该属性来改变选项卡图标和文字的颜色。
  • tabBar.barTintColor:选项卡栏的背景颜色。可以设置该属性来改变选项卡栏的背景色。
  • tabBar.translucent:选项卡栏是否半透明。设置为true时,选项卡栏会显示为透明效果;设置为false时,选项卡栏会显示为不透明效果。
- (void)scene:(UIScene *)scene willConnectToSession:(UISceneSession *)session options:(UISceneConnectionOptions *)connectionOptions {
    
    //创建控制器一
    VCFirst *vcFirst = [[VCFirst alloc] init];
    
//    vcFirst.view.backgroundColor = [UIColor blueColor];
    
    //创建控制器二
    VCSecond *vcSecond = [[VCSecond alloc] init];
    
    vcSecond.view.backgroundColor = [UIColor yellowColor];
    
    //创建控制器三
    VCThird *vcThird = [[VCThird alloc] init];
    
    vcThird.view.backgroundColor = [UIColor redColor];
    
    vcFirst.title = @"视图一";
    
    vcSecond.title = @"视图二";
    
    vcThird.title = @"视图三";
    
    //.语法会调用VCFirst,后面赋值覆盖了111
    vcFirst.view.backgroundColor = [UIColor blueColor];
    
    //创建分栏控制器对象
    UITabBarController *tbController = [[UITabBarController alloc] init];
    
    //创建一个控制器数组对象
    //将所有要被分栏控制器管理的对象添加到数组中
    NSArray *arrayAC = [NSArray arrayWithObjects:vcSecond,vcFirst, vcThird, nil];
    
    //将分栏视图控制器管理数组赋值
    tbController.viewControllers = arrayAC;
    
    tbController.tabBar.backgroundColor = [UIColor whiteColor];
    
    //将分栏控制器作为根视图控制器
    self.window.rootViewController = tbController;
    
    
    //设置选中的视图控制器的索引
    //通过缩影来确定显示哪一个控制器
    tbController.selectedIndex = 2;
    
    if (tbController.selectedViewController == vcThird)
    {
        NSLog(@"........");
    }
    
    //设置分栏控制器的工具栏的透明度
    tbController.tabBar.translucent = NO;

效果:
在这里插入图片描述
点击视图二:
在这里插入图片描述
我们还可以将选项卡设置为图像:
在第一视图中我们写下如下代码:


#import "VCFirst.h"

@interface VCFirst ()

@end

@implementation VCFirst

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view.
    
    //方法一
    //创建一个分栏按钮对象
    //参一:文字
    //参二:显示图片图标
    //参三:设置按钮的tag
//    UITabBarItem *tabBarItem = [[UITabBarItem alloc] initWithTitle:@"111" image:nil tag:101];
//    
//    self.tabBarItem = tabBarItem;
    
    
    //根据系统风格创建分栏按钮
    //p1:系统风格设定
    UITabBarItem *tabBarItem = [[UITabBarItem alloc] initWithTabBarSystemItem:UITabBarSystemItemContacts tag:101];
    //按钮右上角的提示信息
    //通常用来提示未读的信息
    tabBarItem.badgeValue = @"22";
    
    self.tabBarItem = tabBarItem;
}

效果:
在这里插入图片描述

分栏控制器高级

我们先创建六个视图控制器,并创建分栏控制器定义好属性。
在一个分栏控制器中,最多显示五个卡栏,当超过五个卡栏时,会出现一个More的卡栏来储存其他视图。


- (void)scene:(UIScene *)scene willConnectToSession:(UISceneSession *)session options:(UISceneConnectionOptions *)connectionOptions {
    // Use this method to optionally configure and attach the UIWindow `window` to the provided UIWindowScene `scene`.
    // If using a storyboard, the `window` property will automatically be initialized and attached to the scene.
    // This delegate does not imply the connecting scene or session are new (see `application:configurationForConnectingSceneSession` instead).
    
    vcFirst *vc1 = [[vcFirst alloc] init];
    vcSecond *vc2 = [[vcSecond alloc] init];
    vcThird *vc3 = [[vcThird alloc] init];
    vcFour *vc4 = [[vcFour alloc] init];
    vcFive *vc5 = [[vcFive alloc] init];
    vcSix *vc6 = [[vcSix alloc] init];
    
    vc1.view.backgroundColor = [UIColor  greenColor];
    vc2.view.backgroundColor = [UIColor redColor];
    vc3.view.backgroundColor = [UIColor blueColor];
    vc4.view.backgroundColor = [UIColor blackColor];
    vc5.view.backgroundColor = [UIColor brownColor];
    vc6.view.backgroundColor = [UIColor greenColor];
    
    vc1.title = @"视图1";
    vc2.title = @"视图2";
    vc3.title = @"视图3";
    vc4.title = @"视图4";
    vc5.title = @"视图5";
    vc6.title = @"视图6";
    
    NSArray *arrayVC = [NSArray arrayWithObjects:vc1, vc2, vc3, vc4, vc5, vc6, nil];
    UITabBarController *tbc = [[UITabBarController alloc] init];
    
    tbc.viewControllers = arrayVC;
    
    tbc.tabBar.barTintColor = [UIColor redColor];
    
    //设置透明
    tbc.tabBar.translucent = NO;
    //字体变黑
    tbc.tabBar.tintColor = [UIColor blackColor];
    
    tbc.tabBar.barTintColor = [UIColor redColor];
    //tbc.tabBar.backgroundColor = [UIColor redColor];
    
    self.window.rootViewController = tbc;
    
    tbc.delegate = self;
}

效果:
在这里插入图片描述
点击More后:

在这里插入图片描述

高级属性

分栏控制器中还有四个协议方法。

//在启动编辑器前调用
- (void) tabBarController:(UITabBarController *)tabBarController willBeginCustomizingViewControllers:(NSArray<__kindof UIViewController *> *)viewControllers
{
    NSLog(@"编辑器前");
}
//点击选项卡调用
- (void) tabBarController:(UITabBarController *)tabBarController didSelectViewController:(UIViewController *)viewController
{
    if (tabBarController.selectedViewController == viewController) 
    {
            NSLog(@"包的");
    }
    NSLog(@"选中编辑器");
}
//编辑结束前调用
- (void) tabBarController:(UITabBarController *)tabBarController willEndCustomizingViewControllers:(NSArray<__kindof UIViewController *> *)viewControllers changed:(BOOL)changed
{
    NSLog(@"即将结束前!");
}
//编辑结束后调用
-(void) tabBarController:(UITabBarController *)tabBarController didEndCustomizingViewControllers:(NSArray<__kindof UIViewController *> *)viewControllers changed:(BOOL)changed
{
    NSLog(@"vcs = %@", viewControllers);
    
    if (changed == YES)
    {
        NSLog(@"顺序发生改变");
    }
    NSLog(@"已经结束编辑!");
}

效果:
在这里插入图片描述
更改视图二和视图三的位置后:
在这里插入图片描述

总结

以上就是分栏控制器的总结,主要学习了如何创建一个分栏控制器,以及使用图片作为提示,和分栏控制器的协议。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/713986.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

JUC并发编程第十三章——读写锁、邮戳锁

本章路线总纲 无锁——>独占锁——>读写锁——>邮戳锁 1 关于锁的面试题 你知道Java里面有那些锁你说说你用过的锁&#xff0c;锁饥饿问题是什么&#xff1f;有没有比读写锁更快的锁StampedLock知道吗&#xff1f;&#xff08;邮戳锁/票据锁&#xff09;ReentrantR…

「动态规划」如何求乘积最大子数组?

152. 乘积最大子数组https://leetcode.cn/problems/maximum-product-subarray/description/ 给你一个整数数组nums&#xff0c;请你找出数组中乘积最大的非空连续子数组&#xff08;该子数组中至少包含一个数字&#xff09;&#xff0c;并返回该子数组所对应的乘积。测试用例的…

WebGL学习【焕新计划】

WebGL基础 在正式进入webgl之前&#xff0c;我想有必要简单了解一下渲染管线&#xff0c;毕竟它贯穿webgl学习的整个过程。 渲染管线流程图&#xff1a; webgl着色器简单语法&#xff1a; 在GLSL&#xff08;OpenGL Shading Language&#xff09;中&#xff0c;常见的变量类…

企业化运维(4)_tomcat

###1.配置tomcat### 可以将tomcat部署在server2主机&#xff0c;与nginx主服务器分开&#xff0c;便于进行交互存储。 下载安装jdk与tomcat&#xff0c;并开启服务&#xff0c;便可以在浏览器进行访问。 [rootserver3 ~]# rpm -ivh jdk-8u121-linux-x64.rpm [rootserver3 ~]#…

Mybatis-Plus多种批量插入方案对比

背景 六月某日上线了一个日报表任务&#xff0c;因是第一次上线&#xff0c;故需要为历史所有日期都初始化一次报表数据 在执行过程中发现新增特别的慢&#xff1a;插入十万条左右的数据&#xff0c;SQL执行耗费高达三分多钟 因很早就听闻过mybatis-plus的[伪]批量新增的问题&…

万事开头难——Java实现俄罗斯小方块【第一步】

目录 技术实现&#xff1a; 1.初始化游戏窗口&#xff1b; 1.1 什么是窗口&#xff1a; 1.2 Swing 1.3 JFrame创建窗口&#xff1a; 1.3.1创建窗口的逻辑 1.3.2.设置简单的页面 1.3.3.优化 1.3.4.设置标题 1.4 创建游戏窗口 技术实现&#xff1a; 1.初始化游戏窗口&am…

【CT】LeetCode手撕—20. 有效的括号

题目 原题连接&#xff1a;20. 有效的括号 1- 思路 模式识别 模式1&#xff1a;括号左右匹配 ——> 借助栈来实现 ——> Deque<Character> deque new LinkedList<>()模式2&#xff1a;顺序匹配 ——> 用 if 判断 具体思路 1.遇到左括号 直接入栈相应…

ARM32开发--电源管理单元

知不足而奋进 望远山而前行 目录 文章目录 前言 学习目标 学习内容 PMU 电源域 VDD/VDDA域 备份域 1.2V域 省电模式 睡眠模式 深度睡眠模式 待机模式 几种模式总结 WFI和WFE指令 案例需求 模式初始化 源码 总结 前言 在嵌入式系统中&#xff0c;有效的电池管…

【AI基础】第六步:纯天然保姆喂饭级-安装并运行qwen2-7b

整体步骤类似于 【AI基础】第五步&#xff1a;纯天然保姆喂饭级-安装并运行chatglm3-6b-CSDN博客。 此系列文章列表&#xff1a; 【AI基础】概览 【AI基础】第一步&#xff1a;安装python开发环境-windows篇_下载安装ai环境python 【AI基础】第一步&#xff1a;安装python开发环…

面试题 17.05. 字母与数字

链接&#xff1a;. - 力扣&#xff08;LeetCode&#xff09; 题解&#xff1a;把字母看成1&#xff0c;把数字看为-1&#xff0c;将题目变为求的和为0的最长连续子数组 class Solution { public:vector<string> findLongestSubarray(vector<string>& array) …

MySQL查询练习题1.平均工资2.查询各部门的总薪水3.查询总薪水排名第二的部门4.查询姓名重复的员工信息5.查询各部门薪水大于900的男性员工的平均薪水

创建一个员工表emp&#xff0c;包含字段&#xff1a;姓名name&#xff0c;性别sex&#xff0c;部门depart&#xff0c;工资salary create table emp(name varchar(30) not null,sex varchar(30) not null,depart int not null,salary int not null); 插入数据打印为 mysql>…

Windows Server 2008 r2 IIS .NET

Windows Server 2008 r2 IIS .NET

2-2 基于matlab的变邻域

基于matlab的变邻域&#xff0c;含变惯性权重策略的自适应离散粒子群算法&#xff0c;适应函数是多式联运路径优化距离。有10城市、30城市、75城市三个案例。可直接运行。 2-2 路径规划 自适应离散粒子群算法 - 小红书 (xiaohongshu.com)

MySQL基础——多表查询和事务

目录 1多表关系 2多表查询概述 3连接查询 3.1内连接 3.2左外连接 3.3右外连接 3.4自连接 4联合查询 5子查询 5.1标量子查询(子查询结果为单个值) 5.2列子查询(子查询结果为一列) 5.3行子查询(子查询结果为一行) 5.4表子查询(子查询结果为多行多列) 6事务简介和操…

模拟电子技术基础(二)--PN结

PN结的本质 芯片都是由硅晶体制成&#xff0c;单个硅原子最外层有带有4个电子 在纯硅当中这些电子会两两形成共价键&#xff0c;此时周围形成非常稳定的八电子结构 在一个回路中&#xff0c;灯泡不亮&#xff0c;不导通&#xff0c;因为电池无法吸引其中的电子离开&#xff0c…

机器学习在医学领域中的应用|文献精析·24-06-13

小罗碎碎念 2024-06-13&#xff5c;文献精析&#xff1a;机器学习在医学领域中的应用 为了系统性地和大家梳理一下机器学习在医学领域中的应用&#xff0c;我特意去找了一篇文献&#xff0c;把其中有价值的信息筛选出来了。但是我没选的内容不代表不重要&#xff0c;感兴趣的可…

高分论文密码---大尺度空间模拟预测与数字制图

大尺度空间模拟预测和数字制图技术和不确定性分析广泛应用于高分SCI论文之中&#xff0c;号称高分论文密码。大尺度模拟技术可以从不同时空尺度阐明农业生态环境领域的内在机理和时空变化规律&#xff0c;又可以为复杂的机理过程模型大尺度模拟提供技术基础。我们将结合一些经典…

Java SE进阶必备:数组中的命令行参数详解

哈喽&#xff0c;各位小伙伴们&#xff0c;你们好呀&#xff0c;我是喵手。运营社区&#xff1a;C站/掘金/腾讯云&#xff1b;欢迎大家常来逛逛 今天我要给大家分享一些自己日常学习到的一些知识点&#xff0c;并以文字的形式跟大家一起交流&#xff0c;互相学习&#xff0c;一…

5000天后的世界

为何可以预见未来 1993年&#xff0c;在互联网的黎明时代&#xff0c;凯文凯利创办了《连线》杂志。他曾经采访过以比尔盖茨、史蒂夫乔布斯、杰夫贝佐斯为代表的一众风云创业家。《连线》杂志是全球发行的世界著名杂志&#xff0c;一直致力于报道科学技术带来的经济、社会变革…

Linux screen命令使用

文章目录 1. 前言2. screen是什么?3. screen使用场景描述3. screen常用命令4. 小结5. 参考 1. 前言 实际开发中用到的云服务器&#xff0c;如果项目使用的是python&#xff0c;需要利用项目运行一些时间较长的项目程序脚本的话&#xff0c;由于我们通过ssh连接远端服务器&…