iOS框架搭建(MVC,自定义TabBar)--微博搭建为例
项目搭建
1.新建一个微博的项目,去掉屏幕旋转
2.设置屏幕方向-->只有竖向
3.使用代码构建UI,不使用storyboard
4.配置图标AppIcon和LaunchImage
将微博资料的相关素材拉到AppIcon和LaunchImage中,并将除了AppIcon和LaunchImage其它图片也全部拉到images.xcassets中。
项目布局
1、项目分层。为了让在Finder中显示跟Xcode中显示都是分层效果,首先在Finder中建文件目录,再拉到xcode中。
2.添加导航及控制器
思路:
(1)创建一个集成UITabBarController的类作为window的rootViewController
(2)由于中间有一个特殊的+加按钮,需要重写(KVC)导航控制器类来重新布局
AppDelegate.m
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{ //1.创建窗口
self.window=[[UIWindow alloc] init];
self.window.frame=[UIScreen mainScreen].bounds; //2.设置根控制器
self.window.rootViewController=[[UYTabBarViewController alloc] init]; //显示窗口
[self.window makeKeyAndVisible];
return YES;
}
Weibo-Prefix.pch :为了下面方便测试,我们在全局宏命令中定义随机色及RGB颜色
// RGB颜色
#define HWColor(r, g, b) [UIColor colorWithRed:(r)/255.0 green:(g)/255.0 blue:(b)/255.0 alpha:1.0] // 随机色
#define HWRandomColor HWColor(arc4random_uniform(256), arc4random_uniform(256), arc4random_uniform(256))
UYTabBarViewController:
#import "UYTabBarViewController.h"
#import "UYHomeViewController.h"
#import "UYMessageCenterViewController.h"
#import "UYProfileViewController.h"
#import "UYDiscoverViewController.h"
#import "UYTabBar.h" @interface UYTabBarViewController () @end @implementation UYTabBarViewController - (void)viewDidLoad
{
[super viewDidLoad]; // 1.初始化子控制器
UYHomeViewController *home = [[UYHomeViewController alloc] init];
[self addChildVc:home title:@"首页" image:@"tabbar_home" selectedImage:@"tabbar_home_selected"]; UYMessageCenterViewController *messageCenter = [[UYMessageCenterViewController alloc] init];
[self addChildVc:messageCenter title:@"消息" image:@"tabbar_message_center" selectedImage:@"tabbar_message_center_selected"]; UYDiscoverViewController *discover = [[UYDiscoverViewController alloc] init];
[self addChildVc:discover title:@"发现" image:@"tabbar_discover" selectedImage:@"tabbar_discover_selected"]; UYProfileViewController *profile = [[UYProfileViewController alloc] init];
[self addChildVc:profile title:@"我" image:@"tabbar_profile" selectedImage:@"tabbar_profile_selected"]; // 2.更换系统自带的tabbar,由于tabbar是realonly,因此使用KVC来重写。如果没有特殊的导航布局,去掉这下面这部分代码即可。
// UYTabBar *tabBar = [[UYTabBar alloc] init];
// tabBar.delegate = self;
// [self setValue:tabBar forKeyPath:@"tabBar"];
} /**
* 添加一个子控制器
*
* @param childVc 子控制器
* @param title 标题
* @param image 图片
* @param selectedImage 选中的图片
*/
- (void)addChildVc:(UIViewController *)childVc title:(NSString *)title image:(NSString *)image selectedImage:(NSString *)selectedImage
{
// 设置子控制器的文字
childVc.title = title; // 同时设置tabbar和navigationBar的文字 // 设置子控制器的图片
childVc.tabBarItem.image = [UIImage imageNamed:image];
childVc.tabBarItem.selectedImage = [[UIImage imageNamed:selectedImage]imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]; // 设置文字的样式
NSMutableDictionary *textAttrs = [NSMutableDictionary dictionary];
textAttrs[NSForegroundColorAttributeName] = HWColor(123, 123, 123);
NSMutableDictionary *selectTextAttrs = [NSMutableDictionary dictionary];
selectTextAttrs[NSForegroundColorAttributeName] = [UIColor orangeColor];
[childVc.tabBarItem setTitleTextAttributes:textAttrs forState:UIControlStateNormal];
[childVc.tabBarItem setTitleTextAttributes:selectTextAttrs forState:UIControlStateSelected]; // 先给外面传进来的小控制器 包装 一个导航控制器
//HWNavigationController *nav = [[HWNavigationController alloc] initWithRootViewController:childVc];
// 添加为子控制器
[self addChildViewController:childVc];
} @end
运行后,效果如下:
从上面的效果可以看到,我们还需要设置顶部导航控制器:
思路:
- 每个tab的controller上包装了一个UINavigationController.
- 进入非NavigationController的rootViewController的时候,隐藏底部的TabBar
- 重写pushViewController方法,当push的时候隐藏TabBar #mark:此方法可以作用与所有的非rootViewController,非常好用
1.创建一个集成UIBarButtonItem的分类,用来创建使用UIButton作为按钮图标的item
#import "UIBarButtonItem+Extension.h" @implementation UIBarButtonItem (Extension) + (instancetype) itemWithImage:(NSString *) imageName hightlightedImage:(NSString *) highlightedImageName target:(id)target selector:(SEL)selector {
UIBarButtonItem *item = [[self alloc] init]; // 创建按钮
UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
UIImage *image = [UIImage imageNamed:imageName];
[button setImage:image forState:UIControlStateNormal];
[button setImage:[UIImage imageNamed:highlightedImageName] forState:UIControlStateHighlighted]; // 一定要设置frame,才能显示
button.frame = CGRectMake(0, 0, image.size.width, image.size.height); // 设置事件
[button addTarget:target action:selector forControlEvents:UIControlEventTouchUpInside]; item.customView = button;
return item;
} @end
#import "UYNavigationController.h" @interface UYNavigationController () @end @implementation UYNavigationController + (void)initialize
{
// 设置整个项目所有item的主题样式
UIBarButtonItem *item = [UIBarButtonItem appearance]; // 设置普通状态
// key:NS****AttributeName
NSMutableDictionary *textAttrs = [NSMutableDictionary dictionary];
textAttrs[NSForegroundColorAttributeName] = [UIColor orangeColor];
textAttrs[NSFontAttributeName] = [UIFont systemFontOfSize:13];
[item setTitleTextAttributes:textAttrs forState:UIControlStateNormal]; // 设置不可用状态
NSMutableDictionary *disableTextAttrs = [NSMutableDictionary dictionary];
disableTextAttrs[NSForegroundColorAttributeName] = [UIColor colorWithRed:0.6 green:0.6 blue:0.6 alpha:0.7];
disableTextAttrs[NSFontAttributeName] = [UIFont systemFontOfSize:13];
[item setTitleTextAttributes:disableTextAttrs forState:UIControlStateDisabled];
} - (void)viewDidLoad
{
[super viewDidLoad];
// Do any additional setup after loading the view.
} /**
* 重写这个方法目的:能够拦截所有push进来的控制器
*
* @param viewController 即将push进来的控制器
*/
- (void)pushViewController:(UIViewController *)viewController animated:(BOOL)animated
{
if (self.viewControllers.count > 0) { // 这时push进来的控制器viewController,不是第一个子控制器(不是根控制器)
/* 自动显示和隐藏tabbar */
viewController.hidesBottomBarWhenPushed = YES;
//左边
self.navigationItem.leftBarButtonItem = [HVWBarButtonItem itemWithImage:@"navigationbar_friendsearch" hightlightedImage:@"navigationbar_friendsearch_highlighted" target:self selector:@selector(searchFriend)];
// 右边按钮
self.navigationItem.rightBarButtonItem = [HVWBarButtonItem itemWithImage:@"navigationbar_pop" hightlightedImage:@"navigationbar_pop_highlighted" target:self selector:@selector(pop)];
}
[super pushViewController:viewController animated:animated]; } - (void)back {
#warning 这里要用self,不是self.navigationController
// 因为self本来就是一个导航控制器,self.navigationController这里是nil的
[self popViewControllerAnimated:YES];
} - (void)more {
[self popToRootViewControllerAnimated:YES];
} @end
效果如下:
自定义TabBar,把特殊+按钮添加上来
需要反注释掉UYTabBarViewController部分代码:
// 2.更换系统自带的tabbar,由于tabbar是realonly,因此使用KVC来重写。如果没有特殊的导航布局,去掉这下面这部分代码即可。
UYTabBar *tabBar = [[UYTabBar alloc] init];
tabBar.delegate = self;
[self setValue:tabBar forKeyPath:@"tabBar"];
UYTabBar 中,在layoutSubviews重新对四个底部TabBar进行位置调整,并给+号按钮增加点击事件:
UYTabBar.h
#import <UIKit/UIKit.h>
@class UYTabBar; #warning 因为UYTabBar继承自UITabBar,所以称为UYTabBar的代理,也必须实现UITabBar的代理协议
@protocol UYTabBarDelegate <UITabBarDelegate>
@optional
- (void)tabBarDidClickPlusButton:(UYTabBar *)tabBar;
@end @interface UYTabBar : UITabBar
@property (nonatomic, weak) id<UYTabBarDelegate> delegate;
@end
UYTabBar.m
#import "UYTabBar.h" @interface UYTabBar()
@property(nonatomic,weak) UIButton *plusBtn;
@end @implementation UYTabBar - (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
// 添加一个+号按钮 到tabbar中
UIButton *plusBtn = [[UIButton alloc] init];
//设置背影
[plusBtn setBackgroundImage:[UIImage imageNamed:@"tabbar_compose_button"] forState:UIControlStateNormal];
[plusBtn setBackgroundImage:[UIImage imageNamed:@"tabbar_compose_button_highlighted"] forState:UIControlStateHighlighted];
//增加+号图片
[plusBtn setImage:[UIImage imageNamed:@"tabbar_compose_icon_add"] forState:UIControlStateNormal];
[plusBtn setImage:[UIImage imageNamed:@"tabbar_compose_icon_add_highlighted"] forState:UIControlStateHighlighted];
plusBtn.size = plusBtn.currentBackgroundImage.size;
[plusBtn addTarget:self action:@selector(plusClick) forControlEvents:UIControlEventTouchUpInside];
[self addSubview:plusBtn];
self.plusBtn = plusBtn;
}
return self;
} /**
* 加号按钮点击
*/
- (void)plusClick
{
// 通知代理
if ([self.delegate respondsToSelector:@selector(tabBarDidClickPlusButton:)]) {
[self.delegate tabBarDidClickPlusButton:self];
}
} - (void)layoutSubviews
{
#warning [super layoutSubviews] 一定要调用
[super layoutSubviews]; // 1.设置加号按钮的位置
self.plusBtn.centerX = self.width * 0.5;
self.plusBtn.centerY = self.height * 0.5; // 2.设置其他tabbarButton的位置和尺寸
CGFloat tabbarButtonW = self.width / 5;
CGFloat tabbarButtonIndex = 0;
for (UIView *child in self.subviews) {
Class class = NSClassFromString(@"UITabBarButton");
if ([child isKindOfClass:class]) {
// 设置宽度
child.width = tabbarButtonW;
// 设置x
child.x = tabbarButtonIndex * tabbarButtonW; // 增加索引
tabbarButtonIndex++;
if (tabbarButtonIndex == 2) {
tabbarButtonIndex++;
}
}
}
} @end
效果如下:
添加导航栏按钮
@interface UIBarButtonItem (Extension)
+ (UIBarButtonItem *)itemWithTarget:(id)target action:(SEL)action image:(NSString *)image highImage:(NSString *)highImage;
@end
UIBarButtonItem.m
@implementation UIBarButtonItem (Extension)
/**
* 创建一个item
*
* @param target 点击item后调用哪个对象的方法
* @param action 点击item后调用target的哪个方法
* @param image 图片
* @param highImage 高亮的图片
*
* @return 创建完的item
*/
+ (UIBarButtonItem *)itemWithTarget:(id)target action:(SEL)action image:(NSString *)image highImage:(NSString *)highImage
{
UIButton *btn = [UIButton buttonWithType:UIButtonTypeCustom];
[btn addTarget:target action:action forControlEvents:UIControlEventTouchUpInside];
// 设置图片
[btn setBackgroundImage:[UIImage imageNamed:image] forState:UIControlStateNormal];
[btn setBackgroundImage:[UIImage imageNamed:highImage] forState:UIControlStateHighlighted];
// 设置尺寸
btn.size = btn.currentBackgroundImage.size;
return [[UIBarButtonItem alloc] initWithCustomView:btn];
}
@end
在HWNavigationController.m方法pushViewController下,增加
/**
* 重写这个方法目的:能够拦截所有push进来的控制器
*
* @param viewController 即将push进来的控制器
*/
- (void)pushViewController:(UIViewController *)viewController animated:(BOOL)animated
{
if (self.viewControllers.count > 0) { // 这时push进来的控制器viewController,不是第一个子控制器(不是根控制器)
/* 自动显示和隐藏tabbar */
viewController.hidesBottomBarWhenPushed = YES; /* 设置导航栏上面的内容 */
// 设置左边的返回按钮
viewController.navigationItem.leftBarButtonItem = [UIBarButtonItem itemWithTarget:self action:@selector(back) image:@"navigationbar_back" highImage:@"navigationbar_back_highlighted"]; // 设置右边的更多按钮
viewController.navigationItem.rightBarButtonItem = [UIBarButtonItem itemWithTarget:self action:@selector(more) image:@"navigationbar_more" highImage:@"navigationbar_more_highlighted"];
} [super pushViewController:viewController animated:animated];
}
新建一个测试页UYTest1ViewController
首页UYHomeViewController.m
- (void)viewDidLoad
{
[super viewDidLoad]; /* 设置导航栏上面的内容 */
self.navigationItem.leftBarButtonItem = [UIBarButtonItem itemWithTarget:self action:@selector(friendSearch) image:@"navigationbar_friendsearch" highImage:@"navigationbar_friendsearch_highlighted"]; self.navigationItem.rightBarButtonItem = [UIBarButtonItem itemWithTarget:self action:@selector(pop) image:@"navigationbar_pop" highImage:@"navigationbar_pop_highlighted"];
} - (void)friendSearch
{
NSLog(@"friendSearch");
} - (void)pop
{
//NSLog(@"pop");
UYTest1ViewController *test1 = [[UYTest1ViewController alloc] init];
test1.title = @"测试1控制器";
[self.navigationController pushViewController:test1 animated:YES]; }
效果:
添加自定义日志输出
日志输出,如果直接使用NSLog,在发布程序后,会比较耗性能。因此,我们只在调试的时候,才需要日志输出。
在pch文件里添加debug模式下的log函数
// 测试用log
#ifdef DEBUG
#define UYLog(...) NSLog(__VA_ARGS__)
#else
#define UYLog(...)
#endif
使用宏定义的log函数,只有在debug模式下才会转化成为NSLog,release的时候会转为空
/** 寻找朋友按钮事件 */
- (void) searchFriend {
UYLog(@"searchFriend");
}
这里可以修改运行模式:
发布的程序,是Archive模式,是Release
iOS框架搭建(MVC,自定义TabBar)--微博搭建为例的更多相关文章
- weex 项目开发(四)项目框架搭建 及 自定义 TabBar 组件
1.安装 路由模块 及 状态管理模块 npm install vue-router --save npm install vuex --save 2.自定义 TabBar 组件 src / ...
- iOS开发笔记_4自定义TabBar
新博客:http://www.liuchendi.com 好多APP都使用的是自定义的TabBar,那这个功能应该如何实现呢?首先应该解决的问题就是,加载NavigationController的时候 ...
- [angularjs] MVC + Web API + AngularJs 搭建简单的 CURD 框架
MVC + Web API + AngularJs 搭建简单的 CURD 框架 GitHub 地址:https://github.com/liqingwen2015/Wen.MvcSinglePage ...
- 基于Gin+Gorm框架搭建MVC模式的Go语言后端系统
文/朱季谦 环境准备:安装Gin与Gorm 本文搭建准备环境:Gin+Gorm+MySql. Gin是Go语言的一套WEB框架,在学习一种陌生语言的陌生框架,最好的方式,就是用我们熟悉的思维去学.作为 ...
- 如何搭建MVC + EF 框架
1.搭建MVC框架 1.1 VS2010:需要安装WPI 安装 ASP.NET MVC 4 和Visual Studio 2010 系统必备组件 如果上述链接无法打开,请访问:http://www.a ...
- VS2017创建一个 ASP.NET Core2.0 应用,并搭建 MVC 框架
https://testerhome.com/topics/11747 1.使用最新版本的VS2017,并安装.NET Core2.0中相关开发工具 2.打开VS2017,点击文件-新建-项目,选 ...
- 【ASP.NET Core】- 搭建MVC框架
1.使用最新版本的VS2017,并安装.NET Core2.0中相关开发工具 2.打开VS2017,点击文件-新建-项目,选择.NET Core中的ASP.NET Core Web 应用程序 ...
- [iOS微博项目 - 1.6] - 自定义TabBar
A.自定义TabBar 1.需求 控制TabBar内的item的文本颜色(普通状态.被选中状态要和图标一致).背景(普通状态.被选中状态均为透明) 重新设置TabBar内的item位置,为下一步在Ta ...
- AJ学IOS 之微博项目实战(4)微博自定义tabBar中间的添加按钮
AJ分享,必须精品 一:效果图 自定义tabBar实现最下面中间的添加按钮 二:思路 首先在自己的tabBarController中把系统的tabBar设置成自己的tabBar(NYTabBar),这 ...
随机推荐
- 关于iOS GangSDK的使用,为App快速集成社群公会模块
手上有一个自己开发的小游戏,想加一个家族系统活跃下游戏的氛围,想到这块儿可能会有大量的工作需要自己做,就偷了个懒去网上搜罗了一波,结果惊奇的发现居然真的有类似的服务,并且还是免费的,所以决定入坑尝试一 ...
- jenkins学习之自动打包构建nodejs应用
上一节记录了下jenkins在centos下的安装,这节继续,说下怎么使用jenkins和nodejs进行自动打包更新服务. 创建任务 创建任务比较简单,这里我们创建自由风格项目: General信息 ...
- Python:多线程编程
1.IO编程 IO(input/output).凡是用到数据交换的地方,都会涉及io编程,例如磁盘,网络的数据传输.在IO编程中,stream(流)是一种重要的概念,分为输入流(input strea ...
- android studio 的自动更新问题
地址背墙了 没办法... 只有另寻他法了: 在Android Studio安装目录/bin/studio(对应版本, x86, x64).vmoptions文件中追加以下几行 -Djava.net.p ...
- 02-线性结构3 Reversing Linked List
题目 Sample Input: 00100 6 4 00000 4 99999 00100 1 12309 68237 6 -1 33218 3 00000 99999 5 68237 12309 ...
- css选择器的优先级问题
当我们写页面的时候,不知道你会不会产生这样的问题,为什么我给他添加的这条样式分明已经选择到我要给的元素了,但是他的样式并没有生效,那是为什么呢? 定义的属性有冲突时,浏览器会选择用那一套样式呢,下面来 ...
- 【Java疑难杂症】利用Java核心库实现简单的AOP
Spring是一个十分火热开源框架,而AOP(面向切面编程)则是Spring最重要的概念之一,为了更好的理解和学习AOP的思想,使用核心库来实现一次不失为一个好方法. 首先介绍一下AOP的概念,AOP ...
- viewer.js的简单练习
html <!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8& ...
- 一道JS 连续赋值运算的问题
原文链接:https://www.cnblogs.com/joesbell/p/6229423.html <script> var a = {n:1}; var b = a; a.x = ...
- java 事件处理
Java事件处理机制:EventObject类作为描述事件信息的事件信息类的基类,由EventListener接口派生新的接口或类来作为事件接收方的类,再定义事件源类. 事件信息类的构造方法必须含有事 ...