詳解iOS應用中自訂UIBarButtonItem導覽按鈕的建立方法_IOS

來源:互聯網
上載者:User

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 按鈕旋轉或暫停;
最終效果展示:

就是那個音符圖形的旋轉。
關鍵代碼展示(已加註釋):

複製代碼 代碼如下:

//
// 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


相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.