@(iOS 項目實戰(zhàn))[項目實戰(zhàn)]
- 作者: Liwx
- 郵箱:1032282633@qq.com
目錄
- 1.項目環(huán)境搭建
- 工程項目配置
- 2.項目框架
- 項目總體框架圖,效果圖
- 3.自定義TabBar
- 自定義TabBar的原因
- 自定義TabBar步驟
- 4.自定義TabBarController
- 設(shè)置UIWindow的根控制器
- 自定義TabBarController步驟
1.項目環(huán)境搭建
工程項目配置
-
工程項目環(huán)境配置
- 設(shè)置Boundle Identifier
- 配置部署環(huán)境,運行在ios7及以上版本
- 設(shè)置設(shè)備支持方向
- 啟動桌面隱藏狀態(tài)欄
- 設(shè)置桌面圖標和啟動圖片
工程項目配置圖
工程項目配置圖
2.項目框架
項目總體框架圖,效果圖
-
項目框架圖
項目框架圖 -
初步運行效果圖
不得姐效果圖.gif
3.自定義TabBar
自定義TabBar的原因
需在TabBar中間添加按鈕,系統(tǒng)的UITabBar不能滿足需求.所以使用自定義TabBar
-
分析: 系統(tǒng)TabBar為什么顯示不了加號按鈕
- 判斷下發(fā)布圖片和其他圖片區(qū)別(尺寸不一樣)
- 發(fā)布圖片太大,導(dǎo)致顯示不出來
- 1.改圖片尺寸不符合需求
- 系統(tǒng)的UITabBarButton不能滿足需求
-
解決方案
- 1.直接往tabBar中間添加一個發(fā)布按鈕(1.多了一個控制器不安全,有可能系統(tǒng)UITabBarButton把你的按鈕覆蓋)
- 2.自定義TabBar控件 (重寫layoutSubviews,懶加載加號按鈕,并在布局子控件的時候添加到自定義TabBar中間
注意
: 系統(tǒng)是在viewWillAppear:方法中把所有的UITabBarButton添加到UITabBar
中.
自定義TabBar步驟
- 1.懶加載加號按鈕(加號按鈕只需加載一次)
#pragma =======================================================================
#pragma mark - 懶加載
// ----------------------------------------------------------------------------
// 加號按鈕
- (UIButton *)plusButton
{
if (_plusButton == nil) {
UIButton *plusButton = [[UIButton alloc] init];
[plusButton setImage:[UIImage imageNamed:@"tabBar_publish_icon"] forState:UIControlStateNormal];
[plusButton setImage:[UIImage imageNamed:@"tabBar_publish_click_icon"] forState:UIControlStateHighlighted];
// 設(shè)置尺寸
[plusButton sizeToFit];
_plusButton = plusButton;
[self addSubview:plusButton];
}
return _plusButton;
}
- 2.重新布局tabBar子控件
- tabBar的子控件不止只有UITabBarButton,所以需過濾UITabBarButton,可以使用以下兩種方法過濾.
- 1.
[view isKindOfClass:NSClassFromString(@"UITabBarButton")]
- 2.
[@"UITabBarButton" isEqualToString:NSStringFromClass([view class])]
#pragma =======================================================================
#pragma mark - 布局子控件
// ----------------------------------------------------------------------------
// 重新布局tabBar子控件
- (void)layoutSubviews
{
[super layoutSubviews];
// 1.定義frame屬性
NSInteger count = self.items.count;
CGFloat itemX = 0;
CGFloat itemY = 0;
CGFloat itemW = self.wx_width / (count + 1);
CGFloat itemH = self.wx_height;
// 2.遍歷子控件(過濾UITabBarButton), UITabBarButton是私有屬性
NSInteger index = 0;
for (UIView *view in self.subviews) {
// 2.1 過濾UITabBarButton
// 可以用兩張方式判斷
// 1.[view isKindOfClass:NSClassFromString(@"UITabBarButton")]
// 2.[@"UITabBarButton" isEqualToString:NSStringFromClass([view class])]
if ([view isKindOfClass:NSClassFromString(@"UITabBarButton")]) {
// 2.2 計算x值,并設(shè)置frame
itemX = index * itemW;
view.frame = CGRectMake(itemX, itemY, itemW, itemH);
index++;
// 判斷如果是是第二個batBarButton,空一格
if (index == 2) {
index++;
}
}
}
// 3.設(shè)置加號按鈕
self.plusButton.center = CGPointMake(self.wx_width * 0.5, self.wx_height * 0.5);
}
4.自定義TabBarController
設(shè)置UIWindow的根控制器
- 在AppDelegate.m中設(shè)置UIWindow的根控制器為自定義TabBarController
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
// 1.創(chuàng)建window
self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
// 2.設(shè)置window的根控制器
self.window.rootViewController = [[WXTabBarController alloc] init];
// 3.讓window成為主窗口,并顯示
[self.window makeKeyAndVisible];
return YES;
}
自定義TabBarController步驟
- 1.添加所有子控制器
// ----------------------------------------------------------------------------
// 添加所有子控制器
- (void)setupAllChildViewController
{
// 精華
[self setupOneChildViewController:[[WXEssenceViewController alloc] init]];
// 新帖
[self setupOneChildViewController:[[WXNewViewController alloc] init]];
// 發(fā)布
// [self setupOneChildViewController:[[WXPublishViewController alloc] init]];
// 關(guān)注
[self setupOneChildViewController:[[WXFriendTrendViewController alloc] init]];
// 我
[self setupOneChildViewController:[[WXMeViewController alloc] init]];
}
// ----------------------------------------------------------------------------
// 添加一個子控制器
- (void)setupOneChildViewController:(UIViewController *)viewController
{
// 1.包裝導(dǎo)航控制器
UINavigationController *nav = [[UINavigationController alloc] initWithRootViewController:viewController];
[self addChildViewController:nav];
}
- 2.設(shè)置所有tabBarButton
- 設(shè)置圖片不被渲染兩種方式
- 方法一: 在Assets.xcassets直接設(shè)置
圖片Render As為Original Image
,記得1x,2x,3x都要選中
. - 方法二: 使用
imageWithRenderingMode:方法
抽取生成不被渲染圖片的分類.
// ----------------------------------------------------------------------------
// 設(shè)置所有tabBarButton
- (void)setupAllTabBarButton
{
// 精華tabBarItem設(shè)置
[self setupOneTabBarButtonVcIndex:0 titile:@"精華" imageName:@"tabBar_essence_icon" selectedImageName:@"tabBar_essence_click_icon"];
// 新帖tabBarItem設(shè)置
[self setupOneTabBarButtonVcIndex:1 titile:@"新帖" imageName:@"tabBar_new_icon" selectedImageName:@"tabBar_new_click_icon"];
// 關(guān)注tabBarItem設(shè)置
[self setupOneTabBarButtonVcIndex:2 titile:@"關(guān)注" imageName:@"tabBar_friendTrends_icon" selectedImageName:@"tabBar_friendTrends_click_icon"];
// 我tabBarItem設(shè)置
[self setupOneTabBarButtonVcIndex:3 titile:@"我" imageName:@"tabBar_me_icon" selectedImageName:@"tabBar_me_click_icon"];
}
// ----------------------------------------------------------------------------
// 設(shè)置一個tabBarButton信息
- (void)setupOneTabBarButtonVcIndex:(NSInteger)vcIndex titile:(NSString *)title imageName:(NSString *)imageName selectedImageName:(NSString *)selectedImageName
{
// 1.獲取子控制器(UINavigationController),并設(shè)置標題和圖片
WXNavigationController *nav = self.childViewControllers[vcIndex];
nav.tabBarItem.title = title;
nav.tabBarItem.image = [UIImage imageNamed:imageName];
nav.tabBarItem.selectedImage = [UIImage imageWithOriginalRender:selectedImageName];
}
- 3.設(shè)置自定義tabBar
- 將系統(tǒng)的tabBar換成自定義tabBar,
系統(tǒng)的tabBar是readOnly,用KVC設(shè)置
- 將系統(tǒng)的tabBar換成自定義tabBar,
// ----------------------------------------------------------------------------
// 設(shè)置自定義tabBar
- (void)setupTabBar
{
WXTabBar *tabBar = [[WXTabBar alloc] init];
// 1.將系統(tǒng)的tabBar換成自定義tabBar,系統(tǒng)的tabBar是readOnly,用KVC設(shè)置
[self setValue:tabBar forKey:@"tabBar"];
}
- 4.統(tǒng)一設(shè)置
TabBarItem的文字屬性
-
1.iOS7之前(在
UIStringDrawing.h
中可以找到)- 比如UITextAttributeFont\UITextAttributeTextColor
- 規(guī)律:
UITextAttributeXXX
-
2.iOS7開始(在
NSAttributedString.h
中可以找到)- 比如NSFontAttributeName\NSForegroundColorAttributeName
- 規(guī)律:
NSXXXAttributeName
-
initialize方法在第一次使用當(dāng)前類或者它的子類的時候調(diào)用
,在initialize方法統(tǒng)一設(shè)置必須判斷是不是當(dāng)前類
,如果在initialize方法統(tǒng)一設(shè)置時,沒判斷是否是當(dāng)前類,其子類的TabBarItem也會被統(tǒng)一設(shè)置
.建議在load方法中統(tǒng)一設(shè)置
,之后會對使用load方法設(shè)置進行解析.
-
-
// ----------------------------------------------------------------------------
// 第一次使用當(dāng)前類或者它的子類的時候調(diào)用
+ (void)initialize
{
// 一次性設(shè)置設(shè)置tabBarItem字體顏色
// 1.判斷是否是WXTabBarController
if (self == [WXTabBarController class]) {
// 1.1 獲取item
UITabBarItem *item = [UITabBarItem appearanceWhenContainedIn:self, nil];
NSDictionary *attrNormal = @{NSForegroundColorAttributeName : [UIColor redColor]};
[item setTitleTextAttributes:attrNormal forState:UIControlStateSelected];
NSDictionary *attrHigh = @{NSForegroundColorAttributeName : [UIColor grayColor]};
[item setTitleTextAttributes:attrHigh forState:UIControlStateNormal];
}
}