• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

Swift-修改导航栏“返回”按钮文字,图标

原作者: [db:作者] 来自: [db:来源] 收藏 邀请
项目中常常会使用 UINavigationController 对各个页面进行导航,导航栏左侧的返回按钮默认标题文字是上级页面的title。

但如果上级页面的标题很长,那么这个返回按钮字很多就会很丑:
      

当文字极其长时返回文字就会变成“back”: 
      

一,要修改“返回按钮”的文字,有如下两种方式:

1,在父页面中设置
将navigationItem.backBarButtonItem设为自定义的UIBarButtonItem
这种方法所有的子界面返回时都变成了我们定义的文字,同时文字前面任然保留返回箭头。
1
2
let item = UIBarButtonItem(title: "返回", style: .Plain, target: self, action: nil)
self.navigationItem.backBarButtonItem = item;
或者也可以直接把文字设为空字符串,这样就只有一个箭头了。
1
2
let item = UIBarButtonItem(title: "", style: .Plain, target: self, action: nil)
self.navigationItem.backBarButtonItem = item;

2,在子页面中设置
将navigationItem.leftBarButtonItem为自定义的UIBarButtonItem
这种方式可以给各个子页面返回按钮单独设置不同的文字,但文字前面是没有小箭头的。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
import UIKit
 
class DetailViewControllerUIViewController {
 
    override func viewDidLoad() {
        super.viewDidLoad()
         
        let leftBarBtn = UIBarButtonItem(title: "返回", style: .Plain, target: self,
            action: "backToPrevious")
        self.navigationItem.leftBarButtonItem = leftBarBtn
    }
     
    //返回按钮点击响应
    func backToPrevious(){
        self.navigationController?.popViewControllerAnimated(true)
    }
 
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }
}
 
二,修改“返回按钮”图标 
从上面最后一个例子可以看到,在子页面修改返回按钮的话只有文字没有图片。如果想要使用自定义图片,或者图片文字都需要的话可以进行如下操作:
1,如果只需要图片,不需要文字
比如我们想要用左侧这个图片([email protected])作为返回图标
               
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
import UIKit
 
class DetailViewControllerUIViewController {
     
    override func viewDidLoad() {
        super.viewDidLoad()
         
        let leftBarBtn = UIBarButtonItem(title: "", style: .Plain, target: self,
            action: "backToPrevious")
        leftBarBtn.image = UIImage(named: "back")
         
        //用于消除左边空隙,要不然按钮顶不到最前面
        let spacer = UIBarButtonItem(barButtonSystemItem: .FixedSpace, target: nil,
            action: nil)
        spacer.width = -10;
         
        self.navigationItem.leftBarButtonItems = [spacer, leftBarBtn]
    }
     
    //返回按钮点击响应
    func backToPrevious(){
        self.navigationController?.popViewControllerAnimated(true)
    }
     
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }
}

2,既需要图片也需要文字

 
这个时候就要通过创建UIButton来实现了
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
import UIKit
 
class DetailViewControllerUIViewController {
     
    override func viewDidLoad() {
         
        let button =   UIButton(type: .System)
        button.frame = CGRectMake(0, 0, 65, 30)
        button.setImage(UIImage(named:"back"), forState: .Normal)
        button.setTitle("返回", forState: .Normal)
        button.addTarget(self, action: "backToPrevious", forControlEvents: .TouchUpInside)
         
        let leftBarBtn = UIBarButtonItem(customView: button)
         
        //用于消除左边空隙,要不然按钮顶不到最前面
        let spacer = UIBarButtonItem(barButtonSystemItem: .FixedSpace, target: nil,
            action: nil)
        spacer.width = -10;
         
        self.navigationItem.leftBarButtonItems = [spacer,leftBarBtn]
    }
     
    //返回按钮点击响应
    func backToPrevious(){
        self.navigationController?.popViewControllerAnimated(true)
    }
     
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }
}

三,自定义leftBarButtonItems导致左边缘滑动返回失效问题解决
通常使用 navigationController 跳转到另一页面时,除了可以点击左上角的返回按钮,还可以通过在屏幕左侧向右滑动来返回到上一层。但如果像上面样例一样,自定义了 self.navigationItem.leftBarButtonItems 后会发现,滑动返回(swipe back)失效了。


原文出自:www.hangge.com  转载请保留原文链接:http://www.hangge.com/blog/cache/detail_957.html


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap