Swift进阶_UI(WeChat1)

开始学习UI基础部分，通过微信视觉效果开始学习，先弄下框架

1 获取素材

网上很少教程在这就不细说了
链接1
链接2

2 搭框架

• 修改app入口（由xx.storyboard进入）

• 总览（入口，登录注册就不详细介绍）

  
  
  

  主框架
• UITabbarController 这里和微信一样使用系统的tabbar

注意问题

• tabbarVC后面必须连接UINavigationController后再接各个模块的VC，这样在设置barButtonItem，self.title的时候才能正确显示出来，因为这个时候self.navigationController才是VC视图的控制器
  直接连接VC设置titile，rightBarButtonItem

        // 标题的视图
        let titleView = UIView(frame: CGRectMake(0, 0, 100, 44))
        let titleNameLabel = UILabel(frame: CGRectMake(0, 0, 100, 44))
        titleNameLabel.text = "微信(10)"
        titleNameLabel.textColor = UIColor.whiteColor()
        titleNameLabel.font = UIFont.systemFontOfSize(18)
        titleNameLabel.textAlignment = NSTextAlignment.Center
        titleView.addSubview(titleNameLabel)
        // 失败
        self.navigationItem.titleView = titleView;
        self.navigationController?.navigationItem.titleView = titleView;
        // 成功
        self.navigationController?.navigationBar.topItem?.titleView = titleView;

        // 失败
        let rigthItem = UIBarButtonItem(image: UIImage(named: "barBtnAdd")?.imageWithRenderingMode(.AlwaysOriginal), style: .Plain, target: self, action: Selector("addBtnClicked"))
        self.navigationItem.rightBarButtonItem = rigthItem

先连接UINavigationController再连接VC
设置titile，rightBarButtonItem

        // 标题的视图
        let titleView = UIView(frame: CGRectMake(0, 0, 100, 44))
        let titleNameLabel = UILabel(frame: CGRectMake(0, 0, 100, 44))
        titleNameLabel.text = "微信(10)"
        titleNameLabel.textColor = UIColor.whiteColor()
        titleNameLabel.font = UIFont.systemFontOfSize(18)
        titleNameLabel.textAlignment = NSTextAlignment.Center
        titleView.addSubview(titleNameLabel)
        self.navigationItem.titleView = titleView;
        
        // 设置导航栏颜色
        self.navigationController?.navigationBar.barTintColor = UIColor(red: 39/255, green: 39/255, blue: 44/255, alpha: 1.0)
        // 设置背景图片 隐藏导航栏
//        self.navigationController?.navigationBar.setBackgroundImage(UIImage(), forBarMetrics: .Default)
        // 设置导航栏阴影
        self.navigationController?.navigationBar.shadowImage = UIImage()

        // 成功
        let rigthItem = UIBarButtonItem(image: UIImage(named: "barBtnAdd")?.imageWithRenderingMode(.AlwaysOriginal), style: .Plain, target: self, action: Selector("addBtnClicked"))
        // 按钮向右偏移一点
        let gap = UIBarButtonItem(barButtonSystemItem: .FixedSpace, target: nil, action: nil)
        gap.width = -5.0
        self.navigationItem.rightBarButtonItems = [gap,rigthItem]

效果图