布局TabBar
布局TabBar中的items
- Tabbar中应该有5个Item
- 主页/消息/发布按钮/发现/我
- 布局TabBar中的Items可以通过下面的方式
- 通过自定义TabBar的方式
- 多添加一个控制器,让中间空出位置
- 注意:如果只是在storyboard中设置item的图片,不能设置选中的图片,因此需要通过代码重新设置
/// 图片数组
private lazy var imageNames : [String] = {
return ["tabbar_home", "tabbar_message_center", "" ,"tabbar_discover", "tabbar_profile"]
}()
private func adjustItems() {
for i in 0..<tabBar.items!.count {
// 1.取出item
let item = tabBar.items![i]
// 2.如果是第二个item,则不可以和用户交互.并且不需要设置图片
if i == 2 {
item.enabled = false
continue
}
// 2.设置图片
item.image = UIImage(named: imageNames[i])
item.selectedImage = UIImage(named: imageNames[i] + "_highlighted")
}
}
添加'+'按钮
- 创建UIButton
- 扩展UIButton的构造函数
convenience init(imageName : String, bgImageName : String) {
self.init()
// 设置相关属性
setBackgroundImage(UIImage(named: bgImageName), forState: .Normal)
setBackgroundImage(UIImage(named: bgImageName + "_highlighted"), forState: .Highlighted)
setImage(UIImage(named: imageName), forState: .Normal)
setImage(UIImage(named: imageName + "_highlighted"), forState: .Highlighted)
sizeToFit()
}
- 通过懒加载创建UIButton,并且在viewWillAppear中添加按钮
/// 发布微博按钮
private lazy var composeBtn : UIButton = {
// let btn = UIButton.createButton("tabbar_compose_icon_add", bgImageName: "tabbar_compose_button")
let btn = UIButton(imageName: "tabbar_compose_icon_add", bgImageName: "tabbar_compose_button")
btn.center = CGPoint(x: self.tabBar.bounds.width * 0.5, y: self.tabBar.bounds.height * 0.5)
// 监听按钮的点击
// Selector("composeBtnClick")
// "composeBtnClick"
btn.addTarget(self, action: Selector("composeBtnClick"), forControlEvents: .TouchUpInside)
return btn
}()
override func viewWillAppear(animated: Bool) {
super.viewWillAppear(animated)
// 1.调整items
adjustItems()
// 2.添加`加号`按钮
tabBar.addSubview(composeBtn)
}
布局TabBar的更多相关文章
- 隐藏tabBar页面跳转后会再布局一次,
隐藏tabBar有2种方式 1,在sourceController中隐藏目的控制器的tabBar - (void)prepareForSegue:(UIStoryboardSegue *)segue ...
- 总结UIViewController的view在有navBar和tabBar影响下布局区域的问题
影响 View 布局区域的有以下三个属性: self.edgesForExtendedLayout (影响View布局区域的主要属性) self.navigationController.naviga ...
- 主程序底部TabBar功能跟登录页面布局
1:主程序底部TabBar的功能实现 效果图: 主要代码如下: - (UITabBarController*)setRootVC:(BOOL)bShowCart { //创建一个子控制器 用于显示当前 ...
- 自定义tabBar
★★★★自定义tabBar★★★★★★★ Demo下载地址:https://github.com/marlonxlj/tabBarCustom.git 前言: 有的时候需求要对tabBar进行自定义的 ...
- 微信js框架第二篇(创建完整界面布局)
接着昨天的继续谈关于微信新出的这个js框架,今天主要谈一个页面的创建到布局的详细步骤. 一.创建一个完整页面 页面你可以创建在项目的任何节点,只要你在入口文件正确引入创建该页面的路径就可使 ...
- android FragmentActivity+FragmentTabHost+Fragment框架布局
这周比较闲,计划系统的学习一下android开发,我本是一名IOS程序员,对手机开发还是有自己的一套思路的, 固这套思路用到我当前学android上了,先选择从Main页面的tabbar部分代码入手, ...
- Material Design Lite,简洁惊艳的前端工具箱 之 布局组件。
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,博客地址为http://www.cnblogs.com/jasonnode/ .网站上有对应每一 ...
- UITabBar,UINavigationBar的布局和隐藏问题
---恢复内容开始--- 1. 前言 UITabBar,UINavigationBar非常的好用,但是毕竟是系统自带的,不受自己完全掌握,对于布局和隐藏会有一些问题,现在就来谈谈我的想法和一些问题. ...
- react native 布局注意点
一.react native中很多是ES6语法. 1行.表示是js的严格模式. 'use strict';严格模式中变量必须先声明,然后赋值.定义等:还有就是this的绑定. 2行到8行.导入依赖,可 ...
随机推荐
- 【错误】NetBeans2007:Cannot find nbproject/build-impl.xml
从中国考试教育网下载的NetBeans中国考试教育版2007报错 E:\æ¡é¢\javaèè¯\JavaApplication4\build.xml:7: Cannot find nbpr ...
- electron使用动态配置文件及持久化存储
1.如何在打包之后,把动态配置文件比如[config.json]放在根目录,不被打包到asar文件中 //解决思路,electron可以拷贝静态资源,比如你把config.json放在项目的根目录下, ...
- CS5268 Typec转HDMI+VGA+PD3.0四合一扩展坞转换器方案芯片
Capstone CS5268AN是一款高性能Type-C/DP1.4至HDMI2.0b和VGA转换器,设计用于将USB Type-C源或DP1.4源连接至HDMI2.0b接收器.CS5268AN集成 ...
- 编写Java程序_输入三个整数x,y,z,请把这三个数由小到大输出,请写出实现代码。(3种方法)
要求说明: 输入三个整数x,y,z,请把这三个数由小到大输出. 实现代码: 第1种方法: import java.util.Scanner; public class xyzMaxMin{ publi ...
- 1.HTML基本结构、头部、注释
基本结构 1.HTML基本结构 <html> <head> <meta charset="utf-8"> ...
- linux系统内置函数
一.action函数 在/etc/init.d/functions中有一个系统自带的函数 source /etc/init.d/functions #启用系统函数脚本 action "输出 ...
- centos6.5搭建Apache-虚拟主机
一.配置基于域名的虚拟用户 1.创建虚拟用户的网页根目录 cd /usr/local/httpd/htdocs/ mkdir benetcom cd benetcom echo "<h ...
- k8s env、configmap、secret外部数据加载配置
K8s提供了多种外部数据注入容器的方式,今天我们主要学习环境变量.ConfigMap以及Secret的使用和配置. 环境变量 在docker项目中,对一个容器添加环境变量可以在容器创建时通过-e EN ...
- 将ymal文件内容转换成字典格式
yaml文件内容如图: 转换代码如下: import yaml def init_yaml(): with open(r"..\config.yaml", 'r', encodin ...
- linux修改配置文件关闭终端失效问题
当前shell环境为 交互式login-shell(非图形化界面环境) /etc/profile /etc/bash.bashrc ~/.profile ~/bashrc 当前环境为 交互式非logi ...