首頁設(shè)計(jì)初稿如圖挺身,暫時(shí)沒有切圖自己先搭建一個(gè)框架啡浊,項(xiàng)目使用swift開發(fā)
界面分析
-
搭建TabBar使用第三方框架ESTabbarController
如果我們不開發(fā)iPadOS多窗口APP卿嘲,SceneDelegate窗口管理我們可以不需要直接刪掉就好了刪除info.plist文件中的選項(xiàng)
func setupTabBarStyle(delegate: UITabBarControllerDelegate?) -> ESTabBarController { let tabBarController = ESTabBarController() tabBarController.delegate = delegate tabBarController.title = "Irregularity" tabBarController.tabBar.shadowImage = UIImage(named: "TabBar_card") let home = HomeViewController() let train = TrainingViewController() let message = MessageViewController() let mine = MineViewController() home.tabBarItem = ESTabBarItem.init(LFNormalTabbarView(), title: "首頁", image: UIImage(named: "home_icon"), selectedImage: UIImage(named: "home_icon_Selection")) train.tabBarItem = ESTabBarItem.init(LFNormalTabbarView(), title: "培訓(xùn)", image: UIImage(named: "news_icon"), selectedImage: UIImage(named: "news_icon_Selection")) message.tabBarItem = ESTabBarItem.init(LFNormalTabbarView(), title: "消息", image: UIImage(named: "msg_icon"), selectedImage: UIImage(named: "msg_icon_Selection")) mine.tabBarItem = ESTabBarItem.init(LFNormalTabbarView(), title: "我的", image: UIImage(named: "mine_icon"), selectedImage: UIImage(named: "mine_icon_Selection")) let homeNav = LFNavigationController.init(rootViewController: home) let trainNav = LFNavigationController.init(rootViewController: train) let messageNav = LFNavigationController.init(rootViewController: message) let mineNav = LFNavigationController.init(rootViewController: mine) home.title = "首頁" train.title = "培訓(xùn)" message.title = "消息" mine.title = "我的" tabBarController.viewControllers = [homeNav, trainNav, messageNav, mineNav] return tabBarController }
界面部分
自定義下拉選擇框 http://www.reibang.com/p/da2acd523305
自定義搜索框 http://www.reibang.com/p/c05d8a8a93b1
自定義格子視圖 http://www.reibang.com/p/20fb682ed680
自定義瀑布流布局http://www.reibang.com/p/a6eb24b87124圖片輪播依然使用SDCycleScrollView
實(shí)現(xiàn)瀑布流布局
//設(shè)置瀑布流
func setupCollectionView() {
let waterFallLayout = LFWaterFallLayout.init()
waterFallLayout.delegate = self
let collectionView = UICollectionView.init(frame:CGRect.init(x: 0, y: 0, width: kScreenWidth, height: kScreenHeigth-tabBarHeight-navigationBarHeight-250), collectionViewLayout: waterFallLayout)
collectionView.dataSource = self
collectionView.backgroundColor = AppColor.white
collectionView.register(nibWithCellClass: PXSWaterFallCell.self)
self.tableView.tableFooterView = collectionView
}
實(shí)現(xiàn)代理方法
extension HomeViewController {
func numberOfSections(in collectionView: UICollectionView) -> Int {
return 1
}
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
return 10
}
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
let cell = collectionView.dequeueReusableCell(withClass: PXSWaterFallCell.self, for: indexPath)
return cell
}
func heightForItemAtIndexPath(indexPath: Int, itemWidth: CGFloat, waterFallLayout: LFWaterFallLayout) -> CGFloat {
let y = arc4random() % UInt32(200) + UInt32(60)
return CGFloat(y)
}
func rowMarginInWaterFallLayout(waterFallLayout: LFWaterFallLayout) -> CGFloat {
return 20
}
func columnCountInWaterFallLayout(waterFallLayout: LFWaterFallLayout) -> Int {
return 2
}
}
到這首頁差不多界面搭建完畢了