iOS即时通讯(九)- 微信界面细节完善

修改TabBarController的Item

在Main.storyboard中点击导航视图NavigationController的Item->修改Title,Image,以及Selected Image,其它三个依次修改,

iOS即时通讯(九)- 微信界面细节完善_第1张图片
修改Item.png

全部修改好后,运行程效果如下,

iOS即时通讯(九)- 微信界面细节完善_第2张图片
Item修改后.png

创建NPTabarController

运行后我们发现,Item的颜色不是我们想要的颜色,那么我们需要修改Item的颜色。

  • 创建NPTabBarController
    在我们的Classes/Main/Controller目录下创建文件,
iOS即时通讯(九)- 微信界面细节完善_第3张图片
床架NPTabBarController.png
  • 修改颜色

我们要修改bar的标题颜色,以及Item的图片颜色。
- (void)viewDidLoad {
[super viewDidLoad];

    UIColor *selColor = [UIColor colorWithRed:0  /255.0
                                        green:190/255.0
                                         blue:12 /255.0
                                        alpha:1.0f];
    // 图片颜色
    for (UINavigationController *nav in self.childViewControllers) {
        [nav.tabBarItem setTitleTextAttributes:@{ NSForegroundColorAttributeName : selColor}
                                      forState:UIControlStateSelected];
    }
    // 修改字体颜色
    self.tabBar.tintColor = selColor;
}

运行程序效果图如下,

iOS即时通讯(九)- 微信界面细节完善_第4张图片
显示的效果.png

修改NavgationController

接下来我们修改导航栏的背景颜色。

  • 创建NPNavgationController

先创建NPNavgationController,然后修改颜色


iOS即时通讯(九)- 微信界面细节完善_第5张图片
创建NPNavagationController.png
  • 修改NavgationBar背景颜色

    // 设置NavgationBar背景颜色
    [self.navigationBar lt_setBackgroundColor:[UIColor colorWithRed:53/255.0
                                                              green:52/255.0
                                                               blue:58/255.0
                                                              alpha:1]];
    
  • 修改标题及左右按钮颜色

    // 设置标题颜色
    [self.navigationBar setTitleTextAttributes:@{NSForegroundColorAttributeName: [UIColor whiteColor]}];
    // 设置左右按钮字体颜色
    self.navigationBar.tintColor = [UIColor whiteColor];
    
  • 修改状态栏颜色

    // 状态栏颜色
    - (UIStatusBarStyle)preferredStatusBarStyle {
        return UIStatusBarStyleLightContent;
    }
    

运行程序,效果如下,

iOS即时通讯(九)- 微信界面细节完善_第6张图片
效果图.png

你可能感兴趣的:(iOS即时通讯(九)- 微信界面细节完善)