不水,全是操作步骤。喜欢的双击666
从创建开始
1. Create a new Xcode project
2. Single View App
3. Language swift
在创建AppDelegate同级目录下自定义的UITabBarController,这里命名MyUITabBarController
1. 在AppDelegate的application方法里面设置代码在下面
window = UIWindow(frame: UIScreen.main.bounds)
window?.rootViewController = MyTabBarController()
window?.makeKeyAndVisible()
这里需要在Deployment Info 里面把Main InterFace里面的Main删除
在创建AppDelegate同级目录下自定义UINavigationController,这里命名为MyUINavigationController
1. 接下来我们在MyUITabBarController自定义一个方法setChildViewController它的作用是用来设置底部导航
title:String 设置底部导航文字
imageName:String 设置默认图片
selectedImageName:String 设置选中图片
func setChildViewController(_ childController: UIViewController,title:String,imageName:String,selectedImageName:String){
childController.tabBarItem.image = UIImage(named: imageName)
childController.tabBarItem.selectedImage = UIImage(named: selectedImageName)
childController.tabBarItem.title = title
childController.title = title
let navVc = MyNavigationController(rootViewController:childController)
addChild(navVc)
}
在创建AppDelegate同级目录下自定义四个UIViewController,名称分别为HomeViewController,VideoViewController,HuoshanViewController,MineViewController
然后我们在MyTabBarController文件viewDidLoad方法里面设置添加一个自定义方法addChildViewControllers代码如下
func addChildViewControllers () {
setChildViewController(HomeViewController(), title: "首页", imageName: "home_tabbar_32x32_", selectedImageName: "home_tabbar_press_32x32_")
setChildViewController(VideoViewController(), title: "视频", imageName: "video_tabbar_32x32_", selectedImageName: "video_tabbar_press_32x32_")
setChildViewController(HuoshanViewController(), title: "小视频", imageName: "huoshan_tabbar_32x32_", selectedImageName: "huoshan_tabbar_press_32x32_")
setChildViewController(MineViewController(), title: "我的", imageName: "mine_tabbar_32x32_", selectedImageName: "mine_tabbar_press_32x32_")
}
然后我们运行项目可以看到底部会出现导航,如果你的导航图标还是蓝色,这里需要配置Assets.xcassets,拖住选中图片在右边选择使用Render As为Original Image
接下来我们要实现底部四个导航,中间一个加号的导航
所以我们在这里需要自定义一个UITabBar,名称为MyTabBar,以下为全部代码
class MyTabBar: UITabBar {
override init(frame: CGRect) {
super.init(frame:frame)
addSubview(publishButton) //添加SubView
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
private lazy var publishButton :UIButton = {
let publishButton = UIButton(type: .custom) //新建一个UIButton
publishButton.setBackgroundImage(UIImage(named: "feed_publish_44x44_"), for: .normal) //设置一个背景图片
publishButton.setBackgroundImage(UIImage(named: "feed_publish_press_44x44_"), for: .selected) //设置一个选中背景图片
publishButton.sizeToFit() // 按钮宽高和图片
return publishButton
}()
override func layoutSubviews() {
super.layoutSubviews()
let width = frame.width
let height = frame.height
publishButton.center = CGPoint(x: width*0.5, y: height * 0.5 - 12)
let buttonW:CGFloat = width * 0.2
let buttonH:CGFloat = height
let buttonY:CGFloat = 0
var index = 0
for button in subviews {
if !button.isKind(of: NSClassFromString("UITabBarButton")!){continue}
let buttonX = buttonW * (index>1 ? CGFloat(index+1):CGFloat(index))
button.frame = CGRect(x: buttonX, y: buttonY, width: buttonW, height: buttonH) //摆放每个Button位置
index+=1
}
}
}
然后我们需要在MyTabBarController的addChildViewControllers方法的最后一行添加
setValue(MyTabBar(), forKey: "tabBar")
再次运行,就会得到我们想要的结果,写这篇博客,资源文件导入的过程有点省略。在这里主要配置Assets.xcassets
接下来我们来配置在项目的根目录下 有.xcodeproj后缀文件下
其实就是两个命令
第一步 Pod init
第二步 Pod install
在目录下面你们可以看到.xcworkspace后缀文件和Pods文件夹,这里你们可以打开.xcworkspace后缀文件
基本上结束了
用MVC改造项目,我们在Assets.xcassets同级目录下建一个Classes文件夹,在Classes目录下可以建立对应你的HomeViewController的文件夹Home,在下面建立三个文件夹Controller,View,Model,然后把HomeViewController放入Controller文件夹里面
我们用代码生成布局,这时候我们的Main.storyboard就可以删掉了。