首页 > 代码库 > iOS开发项目篇—15菜单栏扩展
iOS开发项目篇—15菜单栏扩展
iOS开发项目篇—16菜单栏扩展
一、简单说明
在15中菜单栏的内在实现效果:
15中是通过Button来监听外部的点击,并做出响应。如果只是单纯的监听点击事件,去掉button,直接用View,给View添加一个手势识别器以监听。
二、在按钮的背后添加一个蒙版
自定义类中增加一个BOOL型的属性
1 // 2 // YYPopMenu.h 3 4 #import <UIKit/UIKit.h> 5 @class YYPopMenu; 6 7 @protocol YYPopMenuDelegate <NSObject> 8 9 @optional10 -(void)popMenuDidDismissed:(YYPopMenu *)popMenu;11 @end12 13 14 @interface YYPopMenu : UIView15 /**16 * 初始化方法17 */18 -(instancetype)initWithContentView:(UIView *)contentView;19 +(instancetype)popMenuWithContentView:(UIView *)contentView;20 21 /**22 * 设置菜单的背景图片23 */24 -(void)setBackground:(UIImage *)background;25 /**26 * 显示菜单27 */28 -(void)showInRect:(CGRect)rect;29 30 /**31 * 关闭菜单32 */33 -(void)dismiss;34 35 @property(nonatomic,strong)id<YYPopMenuDelegate> delegate;36 @property(nonatomic,assign,getter = isdimBackground)BOOL dimBackground;37 @end
在类的实现中重写set方法,设置蒙版
1 #pragma mark-公共方法 2 -(void)setDimBackground:(BOOL)dimBackground 3 { 4 _dimBackground=dimBackground; 5 if (self.isdimBackground) { 6 self.cover.backgroundColor=[UIColor blackColor]; 7 self.cover.alpha=0.3; 8 }else 9 {10 self.cover.backgroundColor=[UIColor clearColor];11 self.cover.alpha=1.0;12 }13 }
点击的时候在背后增加一层蒙版
1 [titleButton setImage:[UIImage imageWithName:@"navigationbar_arrow_up"] forState:UIControlStateNormal];2 3 UITableView *tableView=[[UITableView alloc]init];4 [tableView setBackgroundColor:[UIColor yellowColor]];5 YYPopMenu *menu=[YYPopMenu popMenuWithContentView:tableView];6 [menu showInRect:CGRectMake(60, 55, 200, 200)];7 menu.dimBackground=YES;8 menu.delegate=self;
实现效果:
三、设置弹出菜单的箭头的位置为左、中、右
自定义类的头文件
1 // 2 // YYPopMenu.h 3 // 08-微博弹出菜单 4 // 5 6 #import <UIKit/UIKit.h> 7 @class YYPopMenu; 8 typedef enum { 9 YYPopMenuArrowPositionCenter=0,10 YYPopMenuArrowPositionLeft=1,11 YYPopMenuArrowPositionRight=2,12 13 }YYPopMenuArrowPosition;14 15 @protocol YYPopMenuDelegate <NSObject>16 17 @optional18 -(void)popMenuDidDismissed:(YYPopMenu *)popMenu;19 @end20 21 22 @interface YYPopMenu : UIView23 /**24 * 初始化方法25 */26 -(instancetype)initWithContentView:(UIView *)contentView;27 +(instancetype)popMenuWithContentView:(UIView *)contentView;28 29 /**30 * 设置菜单的背景图片31 */32 -(void)setBackground:(UIImage *)background;33 /**34 * 显示菜单35 */36 -(void)showInRect:(CGRect)rect;37 38 /**39 * 关闭菜单40 */41 -(void)dismiss;42 43 @property(nonatomic,strong)id<YYPopMenuDelegate> delegate;44 @property(nonatomic,assign,getter = isdimBackground)BOOL dimBackground;45 @property(nonatomic,assign) YYPopMenuArrowPosition arrowPosition;46 @end
在类的实现中,重写arrowPosition的set方法
1 // 2 // YYPopMenu.m 3 // 08-微博弹出菜单 4 // 5 6 #import "YYPopMenu.h" 7 8 @interface YYPopMenu() 9 @property(nonatomic,strong)UIView *contentView; 10 /** 11 * 最底部的遮盖 :屏蔽除菜单以外控件的事件 12 */ 13 @property(nonatomic,strong)UIImageView *container; 14 /** 15 * 最底部的遮盖 :屏蔽除菜单以外控件的事件 16 */ 17 @property(nonatomic,strong)UIButton *cover; 18 @end 19 @implementation YYPopMenu 20 21 #pragma mark-初始化方法 22 //init方法会调用该方法 23 - (id)initWithFrame:(CGRect)frame 24 { 25 self = [super initWithFrame:frame]; 26 if (self) { 27 /**添加菜单内部的两个子控件*/ 28 //1.添加一个遮盖按钮 29 UIButton *cover=[[UIButton alloc]init]; 30 //清除颜色 31 cover.backgroundColor=[UIColor clearColor]; 32 [cover addTarget:self action:@selector(coverClick) forControlEvents:UIControlEventTouchUpInside]; 33 [self addSubview:cover]; 34 self.cover=cover; 35 36 //2.添加单箭头的菜单图片 37 UIImageView *container=[[UIImageView alloc]init]; 38 //设置为可交互的 39 container.userInteractionEnabled=YES; 40 container.size=CGSizeMake(200, 100); 41 container.image=[UIImage resizedImage:@"popover_background"]; 42 [self addSubview:container]; 43 self.container=container; 44 } 45 return self; 46 } 47 48 -(instancetype)initWithContentView:(UIView *)contentView 49 { 50 if (self=[super init]) { 51 self.contentView=contentView; 52 } 53 return self; 54 } 55 56 +(instancetype)popMenuWithContentView:(UIView *)contentView 57 { 58 return [[self alloc]initWithContentView:contentView]; 59 } 60 61 -(void)layoutSubviews 62 { 63 [super layoutSubviews]; 64 self.cover.frame=self.bounds; 65 } 66 #pragma mark-内部方法 67 -(void)coverClick 68 { 69 [self dismiss]; 70 } 71 72 #pragma mark-公共方法 73 -(void)setDimBackground:(BOOL)dimBackground 74 { 75 _dimBackground=dimBackground; 76 if (self.isdimBackground) { 77 self.cover.backgroundColor=[UIColor blackColor]; 78 self.cover.alpha=0.3; 79 }else 80 { 81 self.cover.backgroundColor=[UIColor clearColor]; 82 self.cover.alpha=1.0; 83 } 84 } 85 86 -(void)setArrowPosition:(YYPopMenuArrowPosition)arrowPosition 87 { 88 _arrowPosition=arrowPosition; 89 switch (_arrowPosition) { 90 case YYPopMenuArrowPositionCenter: 91 self.container.image=[UIImage resizedImage:@"popover_background"]; 92 break; 93 94 case YYPopMenuArrowPositionLeft: 95 self.container.image=[UIImage resizedImage:@"popover_background_left"]; 96 break; 97 98 case YYPopMenuArrowPositionRight: 99 self.container.image=[UIImage resizedImage:@"popover_background_right"];100 break;101 }102 }103 -(void)setBackground:(UIImage *)background104 {105 self.container.image=background;106 }107 108 -(void)showInRect:(CGRect)rect109 {110 //添加菜单到整体的窗口上111 UIWindow *window=[UIApplication sharedApplication].keyWindow;112 self.frame=window.bounds;113 [window addSubview:self];114 115 //设置容器的frame116 self.container.frame=rect;117 [self.container addSubview:self.contentView];118 119 // 设置容器里面内容的frame120 CGFloat topMargin = 12;121 CGFloat leftMargin = 5;122 CGFloat rightMargin = 5;123 CGFloat bottomMargin = 8;124 125 self.contentView.y = topMargin;126 self.contentView.x = leftMargin;127 self.contentView.width = self.container.width - leftMargin - rightMargin;128 self.contentView.height = self.container.height - topMargin - bottomMargin;129 130 }131 132 -(void)dismiss133 {134 //一旦调用了该方法,就通知代理删除菜单栏135 if ([self.delegate respondsToSelector:@selector(popMenuDidDismissed:)]) {136 [self.delegate popMenuDidDismissed:self];137 }138 [self removeFromSuperview];139 }140 @end
调用代码:
1 -(void)titleButtonClick:(UIButton *)titleButton 2 { 3 // UIImage *titleImage=[UIImage imageWithName:@"navigationbar_arrow_down"]; 4 // 5 // if (titleButton.currentImage==titleImage) { 6 //换成箭头向上 7 [titleButton setImage:[UIImage imageWithName:@"navigationbar_arrow_up"] forState:UIControlStateNormal]; 8 9 UITableView *tableView=[[UITableView alloc]init];10 [tableView setBackgroundColor:[UIColor yellowColor]];11 YYPopMenu *menu=[YYPopMenu popMenuWithContentView:tableView];12 [menu showInRect:CGRectMake(60, 55, 200, 200)];13 menu.dimBackground=YES;14 // menu.arrowPosition=YYPopMenuArrowPositionLeft;15 menu.arrowPosition=YYPopMenuArrowPositionRight;16 menu.delegate=self;17 18 // }else19 // {20 // //换成箭头向下21 // [titleButton setImage:[UIImage imageWithName:@"navigationbar_arrow_down"] forState:UIControlStateNormal];22 // }23 }
实现效果:
箭头在左边和箭头在右边:
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。