欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  移动技术

详解iOS应用中自定义UIBarButtonItem导航按钮的创建方法

程序员文章站 2023-11-30 22:48:34
ios系统导航栏中有leftbarbuttonitem和rightbarbuttonitem,我们可以根据自己的需求来自定义这两个uibarbuttonitem。 四种创...

ios系统导航栏中有leftbarbuttonitem和rightbarbuttonitem,我们可以根据自己的需求来自定义这两个uibarbuttonitem。

四种创建方法

系统提供了四种创建的方法:

复制代码 代码如下:

- (instancetype)initwithbarbuttonsystemitem:(uibarbuttonsystemitem)systemitem target:(id)target action:(sel)action;

- (instancetype)initwithimage:(uiimage *)image style:(uibarbuttonitemstyle)style target:(id)target action:(sel)action;

- (instancetype)initwithtitle:(nsstring *)title style:(uibarbuttonitemstyle)style target:(id)target action:(sel)action;

- (instancetype)initwithbarbuttonsystemitem:(uibarbuttonsystemitem)systemitem target:(id)target action:(sel)action;

- (instancetype)initwithcustomview:(uiview *)customview;


通过系统uibarbuttonsystemitem创建

自定义rightbarbuttonitem,代码如下:

复制代码 代码如下:

self.navigationitem.rightbarbuttonitem = [[uibarbuttonitem alloc] initwithbarbuttonsystemitem:uibarbuttonsystemitemdone target:self action:@selector(right:)];

uibarbuttonsystemitem有以下样式可以供选择:
复制代码 代码如下:

typedef ns_enum(nsinteger, uibarbuttonsystemitem) {
    uibarbuttonsystemitemdone,
    uibarbuttonsystemitemcancel,
    uibarbuttonsystemitemedit, 
    uibarbuttonsystemitemsave, 
    uibarbuttonsystemitemadd,
    uibarbuttonsystemitemflexiblespace,
    uibarbuttonsystemitemfixedspace,
    uibarbuttonsystemitemcompose,
    uibarbuttonsystemitemreply,
    uibarbuttonsystemitemaction,
    uibarbuttonsystemitemorganize,
    uibarbuttonsystemitembookmarks,
    uibarbuttonsystemitemsearch,
    uibarbuttonsystemitemrefresh,
    uibarbuttonsystemitemstop,
    uibarbuttonsystemitemcamera,
    uibarbuttonsystemitemtrash,
    uibarbuttonsystemitemplay,
    uibarbuttonsystemitempause,
    uibarbuttonsystemitemrewind,
    uibarbuttonsystemitemfastforward,
#if __iphone_3_0 <= __iphone_os_version_max_allowed
    uibarbuttonsystemitemundo,
    uibarbuttonsystemitemredo,
#endif
#if __iphone_4_0 <= __iphone_os_version_max_allowed
    uibarbuttonsystemitempagecurl,
#endif
};

最后别忘了实现right:方法:
复制代码 代码如下:

- (void)right:(id)sender
{
    nslog(@"rightbarbuttonitem");
}

自定义文字的uibarbuttonitem

self.navigationitem.leftbarbuttonitem = [[uibarbuttonitem alloc] initwithtitle:@"back" style:uibarbuttonitemstyleplain target:self action:@selector(back:)];
uibarbuttonitemstyle有以下三种选择:

复制代码 代码如下:

typedef ns_enum(nsinteger, uibarbuttonitemstyle) {
    uibarbuttonitemstyleplain,
    uibarbuttonitemstylebordered ns_enum_deprecated_ios(2_0, 8_0, "use uibarbuttonitemstyleplain when minimum deployment target is ios7 or later"),
    uibarbuttonitemstyledone,
};

实现back:方法:
复制代码 代码如下:

- (void)back:(id)sender
{
    [self.navigationcontroller popviewcontrolleranimated:yes];
}

自定义照片的uibarbuttonitem
复制代码 代码如下:

self.navigationitem.rightbarbuttonitem = [[uibarbuttonitem alloc] initwithimage:[uiimage imagenamed:@"test"] style:uibarbuttonitemstyleplain target:self action:@selector(right:)];

自定义uiview的uibarbuttonitem

自定义uiview,然后通过initwithcustomview:方法来创建uibarbuttonitem。

复制代码 代码如下:

uiview *testview = [[uiview alloc] initwithframe:cgrectmake(0, 0, 40, 60)];
self.navigationitem.rightbarbuttonitem = [[uibarbuttonitem alloc] initwithcustomview:testview];

看到有朋友在后台提问:

我现在即需要改那个导航原生的返回图片,也要改返回文字,应该怎么改呢,求指教。
其实,这个就可以用initwithcustomview:来解决,自定义uiview你可以放uiimageview和uilabel。可以自定义uiview,那么想怎么定义都是可以的。

下面来看一个有趣的例子:
先说一下需求:
1.做一个rightbarbuttonitem不断旋转的demo;
2.点击rightbarbuttonitem 按钮旋转或暂停;
最终效果展示:

详解iOS应用中自定义UIBarButtonItem导航按钮的创建方法

详解iOS应用中自定义UIBarButtonItem导航按钮的创建方法

就是那个音符图形的旋转。
关键代码展示(已加注释):

复制代码 代码如下:

//
// viewcontroller.m
// navigationbtn
//

#import "viewcontroller.h"
#define degrees_to_radians(angle) ((angle) / 180.0 * m_pi)

///imageview旋转状态枚举
typedef enum {
rotatestatestop,
rotatestaterunning,
}rotatestate;

@interface viewcontroller ()
{
///旋转角度
cgfloat imageviewangle;
///旋转imageview
uiimageview *imageview;
///旋转状态
rotatestate rotatestate;
}

@end


复制代码 代码如下:

@implementation viewcontroller

- (void)viewdidload
{
[super viewdidload];
self.title=@"微信公众账号:乐coding";
[self buildbarbuttonitem];
}
#pragma mark 添加 rightbarbuttonitem
-(void)buildbarbuttonitem{

imageview = [[uiimageview alloc] initwithimage:[uiimage imagenamed:@"icon"]];
imageview.autoresizingmask = uiviewautoresizingnone;
imageview.contentmode = uiviewcontentmodescaletofill;
imageview.bounds=cgrectmake(0, 0, 40, 40);
//设置视图为圆形
imageview.layer.maskstobounds=yes;
imageview.layer.cornerradius=20.f;
uibutton *button = [uibutton buttonwithtype:uibuttontypecustom];
button.frame = cgrectmake(0, 0, 40, 40);
[button addsubview:imageview];
[button addtarget:self action:@selector(animate) forcontrolevents:uicontroleventtouchupinside];
imageview.center = button.center;
//设置rightbarbuttonitem
uibarbuttonitem *baritem = [[uibarbuttonitem alloc] initwithcustomview:button];
self.navigationitem.rightbarbuttonitem = baritem;
}
#pragma mark 点击 rightbarbuttonitem
- (void)animate {
//改变imageview旋转状态
if (rotatestate==rotatestatestop) {
rotatestate=rotatestaterunning;
[self rotateanimate];
}else{
rotatestate=rotatestatestop;
}
}
#pragma mark 旋转动画
-(void)rotateanimate{
imageviewangle+=50;
//0.5秒旋转50度
[uiview animatewithduration:0.5 delay:0.0 options:uiviewanimationoptioncurvelinear animations:^{
imageview.transform = cgaffinetransformmakerotation(degrees_to_radians(imageviewangle));
} completion:^(bool finished) {
if (rotatestate==rotatestaterunning) {
[self rotateanimate];
}
}];
}

- (void)didreceivememorywarning {
[super didreceivememorywarning];
// dispose of any resources that can be recreated.
}

@end