自定义导航栏的封装

系统导航栏远远不能满足实际开发需要,并且系统导航栏的控制也非常不方便,一般项目中都会采用自定义导航栏的做法,简而言之就是隐藏系统的,使用自己定制的一个view。由于本人项目中导航栏左右可以为文字,图片,或者带下划线的文字,字体颜色也不尽相同,此外,标题透明度,导航栏背景透明度动态改变等,所以我就自己封装了一个导航栏定制工具,将UI布局与导航栏的item属性定制分开,类似于系统的导航栏定制,可以动态增加item个数。

1.左右item的定制
typedef NS_ENUM(NSUInteger, LWNavigationBarItemType) {
    LWNavigationBarItemOnlyText,//只有文字
    LWNavigationBarItemOnlyImage,//只有图片
    LWNavigationBarItemTextLine,//带下划线的文字
    LWNavigationBarItemMulti//图文混合,只支持左文字右图片,不考虑超长文字的情况
};

@interface LWNavigationBarItem : UIControl
- (instancetype)initWithItemType:(LWNavigationBarItemType)itemType;
- (void)setItemTitle:(NSString *)itemTitle;
- (void)setItemImage:(UIImage *)itemImage;
- (void)setItemTitleColor:(UIColor *)itemTitleColor;
- (void)setItemTitleFont:(UIFont *)itemTitleFont;
- (void)setItemImageSize:(CGSize)itemImageSize;
- (void)setItemConentInsets:(UIEdgeInsets)itemContentInsets;
- (void)showItemLine:(BOOL)show;
- (void)setItemLineColor:(UIColor *)itemLineColor;
- (CGSize)itemSize;
@end

2.导航栏生成:

利用生成的item构建导航栏,和系统的分层类似

- (void)addItemToLeft:(LWNavigationBarItem *)item;
- (void)addItemToRight:(LWNavigationBarItem *)item;
- (void)addItemToTitle:(LWNavigationBarItem *)item;
- (void)reloadItems;

此外可以对导航栏的变化进行操作

1.改变透明度:
- (void)lw_updateNavBarWithAlpha:(CGFloat)alpha;
2.改变底部细线的透明度:
- (void)lw_updateLineAlpha:(CGFloat)alpha;
3.改变标题以及item的隐藏状态:
- (void)lw_updateTitleItemAlpha:(CGFloat)alpha;
- (void)lw_updateLeftItemAlpha:(CGFloat)alpha atIndex:(int)index;
4.更新item
- (void)lw_updateLeftItem:(LWNavigationBarItem *)item atIndex:(int)index;
- (void)lw_updateTitleItem:(LWNavigationBarItem *)item;
- (void)lw_updateRightItem:(LWNavigationBarItem *)item atIndex:(int)index;
5.增加左边或者右边的item
- (void)lw_addNewItemToLeft:(LWNavigationBarItem *)item;
- (void)lw_addNewItemToRight:(LWNavigationBarItem *)item;

上述本人写的一个小库LWNavigationBar中的实现部分,具体引入到项目中,可以进行二次封装:

此外,LWNavigationBar中还提供了动态隐藏左侧和右侧文字或者按钮的方法,具体的可以去源码中查看

截取几种情况下的图片如下:


导航栏透明.png

只有标题.png
左边图片+标题.png
左边图片+标题+右边图片.png
初始隐藏标题.png
标题渐变.png
完全显示标题.png
右侧文字带下划线.png

动态新增左边Item:


初始
新增x号item

下面截取其中一个使用方式的二次封装,目前处理的点击事件是在控制器中引入一下两个方法(也可以优化为block方式,这里不再举例):

/*左右皆为图片,中间标题为文字,图片文字皆可为空
 */
+ (LWNavigationBar *)yg_createNavigationBarWithBarStyle:(YGNavigationBarStyle)style
                                              target:(UIViewController *)target
                                              leftImage:(UIImage * _Nullable)leftImage
                                              titleText:(NSString * _Nullable )titleText
                                             rightImage:(UIImage * _Nullable )rightImage
                                              barHeight:(CGFloat)barHeight {
    
    LWNavigationBarItem *leftItem = [[LWNavigationBarItem alloc] initWithItemType:LWNavigationBarItemOnlyImage];
    [leftItem setItemImage:leftImage];
    [leftItem setItemImageSize:CGSizeMake(20 * kXX, 20 * kXX)];
    if ([target respondsToSelector:@selector(p_didClickLeftItemAction)]) {
        [leftItem addTarget:target action:@selector(p_didClickLeftItemAction) forControlEvents:UIControlEventTouchUpInside];
    }
    
    LWNavigationBarItem *rightItem = [[LWNavigationBarItem alloc] initWithItemType:LWNavigationBarItemOnlyImage];
    [rightItem setItemImage:rightImage];
    [rightItem setItemImageSize:CGSizeMake(20 * kXX, 20 * kXX)];
    if ([target respondsToSelector:@selector(p_didClickRightItemAction)]) {
        [rightItem addTarget:target action:@selector(p_didClickRightItemAction) forControlEvents:UIControlEventTouchUpInside];
    }
    
    LWNavigationBarItem *titleItem = [[LWNavigationBarItem alloc] initWithItemType:LWNavigationBarItemOnlyText];
    [titleItem setItemTitleColor:(style == YGNavigationBarStyleDefault ? [UIColor convertHexValueToColor:@"#2f2f2f"] : [UIColor whiteColor])];
    [titleItem setItemTitle:titleText];
    [titleItem setItemTitleFont:[UIFont fifteenOfSystem]];
    
    LWNavigationBar *bar = [[LWNavigationBar alloc] init];
    bar.backgroundColor = (style == YGNavigationBarStyleDefault ? [UIColor whiteColor] : [UIColor createNavigationColor]);
    [bar setBarContentInset:15 * kXX];
    [bar addItemToTitle:titleItem];
    [bar addItemToRight:rightItem];
    [bar addItemToLeft:leftItem];
    [bar setItemLineViewColor:YGViews_RGBA(182, 182, 182, 1.0)];
    bar.frame = CGRectMake(0, 0, kScreenW, barHeight);
    [bar reloadItems];
    [target.view addSubview:bar];
    return bar;
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,271评论 5 476
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,275评论 2 380
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,151评论 0 336
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,550评论 1 273
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,553评论 5 365
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,559评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,924评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,580评论 0 257
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,826评论 1 297
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,578评论 2 320
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,661评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,363评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,940评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,926评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,156评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,872评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,391评论 2 342

推荐阅读更多精彩内容

  • 1、通过CocoaPods安装项目名称项目信息 AFNetworking网络请求组件 FMDB本地数据库组件 SD...
    阳明先生x阅读 15,967评论 3 119
  • 他总是说我矫情,我总是把这个词语当做是对我很好的表扬。 是的,我是一个矫情的人,这是打娘胎里出来就注定的,尽管性别...
    贾小新阅读 578评论 2 0
  • 又是一个好久,自我感觉是如此。和以往不同,这次是在深夜里,独自一人。心并没有静下来。因为内心的欲望怎么也阻止不了,...
    9d120893404b阅读 546评论 2 0
  • 龙泉慈心种树成果汇报 为农场生态多养性完善,今年农场启动了种花种树的计划,用众筹的方式让农场家园更加美好。200元...
    韧性十足的牛皮糖阅读 372评论 0 3
  • 词|曲:白乌鸦 是否存在一种,不会言语的梦 彼此相见离散都是际会捕风 时光一场大雾,我独折返风里 在人潮缭绕中考究...
    乌鸦之白阅读 324评论 0 1