[Swift通天遁地]九、拔剑吧-(5)创建Tab图标具有多种样式的Tab动画

概述本文将演示创建动画样式的底部标签条的切换效果。 Github项目地址：【animated-tab-bar】，下载项目，解压成文件夹窗口。 将第三方类库的标签控制器文件夹【RAMAnimatedTabBarConroller】拖动到项目中。 在d出的文件导入确认窗口中，点击【Finish】完成按钮，确认文件的导入。 在左侧的项目导航区打开视图控制器的代码文件【Main.storyboard】 选择故

本文将演示创建动画样式的底部标签条的切换效果。

Github项目地址：【animated-tab-bar】，下载项目，解压成文件夹窗口。

将第三方类库的标签控制器文件夹【RAMAnimatedTabbarConroller】拖动到项目中。

在d出的文件导入确认窗口中，点击【Finish】完成按钮，确认文件的导入。

在左侧的项目导航区打开视图控制器的代码文件【Main.storyboard】

选择故事板中的视图控制器。依次点击：

【Editor】编辑- >【Embed In】植入- >【Tab bar Controller】标签控制器

将选择的视图控制器，植入标签控制器。使用快捷键【Command】+【D】复制最初的视图控制器。

将复制后的视图控制器，拖动到和第一个视图控制器对齐的位置。

在故事板上点击鼠标右键，d出右键菜单。选择【Zoom  to 25%】缩小故事板的显示比例。

使用快捷键【Command】+【D】复制当前的视图控制器，并将它移动到适当的位置。

使用相同的方法，继续复制并放置两个新的视图控制器。在故事板上点击鼠标右键，d出右键菜单。

选择【Zoom  to 100%】故事板的显示比例恢复至原始显示比例。

现在开始将其他四个子视图控制器，和标签控制器做连接，将它们置入标签控制器。

将标签控制器的上方，按下鼠标右键，然后拖动到第一个子控制器。

在d出的选项菜单中，选择【vIEw controllers】视图控制器选项，

以建立两个控制器之间的从属关系。使用相同的方式，将标签控制器和另外二个子控制器，建立从属关系。

在d出的选项菜单中，选择【vIEw controllers】视图控制器选项，

以建立两个控制器之间的从属关系。在标签控制器的上方，按下鼠标右键，然后拖动到第三个子控制器。

在d出的选项菜单中，选择【vIEw controllers】视图控制器选项，

以建立两个控制器之间的从属关系。

点击故事板右侧的垂直滚动条，显示五个子视图控制器。

然后选择第一个控制器标签。点击属性检查器图标，进入属性设置面板。

输入标签的文字内容，

【Titile】:User

【Image】:icon_user

选择控制器的根视图，设置根视图的背景颜色。

点击背景颜色右侧的下拉箭头，d出颜色预设面板。

在d出的系统颜色预设面板中， 选择一种颜色作为视图的背景颜色。

选择第二个控制器的标签，输入标签的文字内容，

【Titile】:Settings

【Image】:Settings

选择控制器的根视图，设置根视图的背景颜色。

选择第三个控制器的标签，输入标签的文字内容，

【Titile】:Location

【Image】:icon_pin

选择控制器的根视图，设置根视图的背景颜色。

选择第四个控制器的标签，输入标签的文字内容，

【Titile】:Drop

【Image】:drop

选择控制器的根视图，设置根视图的背景颜色。

选择第五个控制器的标签，输入标签的文字内容，

【Titile】:Frame

【Image】:Tools_00028

选择控制器的根视图，设置根视图的背景颜色。

接着将五个视图控制器的标签控件，绑定到由第三方类库提供的自定义标签类。

使它们具有动画的属性，首先选择第五个视图控制器标签。

然后点击身份检查器图标，进入身份设置面板。

【Class】:RAMAnimatedTabbarItem

选择第四个视图控制器标签

【Class】:RAMAnimatedTabbarItem

选择第三个视图控制器标签

【Class】:RAMAnimatedTabbarItem

选择第二个视图控制器标签

【Class】:RAMAnimatedTabbarItem

选择第一个视图控制器标签

【Class】:RAMAnimatedTabbarItem

给每个标签指定不同的动画类型，

首先需要给标签控制器，绑定一个自定义的类文件。

选择标签控制器，在类名输入框，输入由第三方类库提供的自定义类。

【Class】:RAMAnimatedTabbarController

现在开始给每个视图控制器，设置不同的标签动画样式。

首先点击控件库右侧的垂直滚动条，跳转到对象控件所在的位置。

将【Object】对象控件拖动到第一个视图控制器。

点击身份检查器图标，进入身份设置面板。

【Class】:RAMRotationAnimation

给控制器的标签控件设置一个跳跃动画，

点击属性检查器图标。进入属性设置面板。

在动画时长输入框内，【Duration】0.8，作为跳跃动画的时长。

【Text Selected】：设置当标签处于焦点状态时，标签的文字颜色。

同样对第二个第三个第四个视图控制器进行相同的处理。

在此给第五个标签控件，添加了一个帧动画，

点击属性检查器图标，进入属性设置面板。

点击次数的下拉箭头，设置标签是否允许播放取消选择时的动画。

设置列表中的激活选项，当标签取消选择时，也会播放动画。

【Images Path】:ToolsIsAnimation

点击【显示辅助编辑器】图标，打开辅助编辑器。

选择故事板中的标签控制器，

在动画属性左侧的连接图标上按下鼠标，

并向第五个控制器的帧动画对象拖动，

将动画属性和其他的动画对象进行连接。

点击连接图标，可以查看该属性共连接了哪些控件。在面板外部点击隐藏该面板。

总结

以上是内存溢出为你收集整理的[Swift通天遁地]九、拔剑吧-(5)创建Tab图标具有多种样式的Tab动画全部内容，希望文章能够帮你解决[Swift通天遁地]九、拔剑吧-(5)创建Tab图标具有多种样式的Tab动画所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。