iOS仿微信、支付宝首页下拉菜单选择视图

心之所向.jpg

效果图展示、自动优化位置（上拉、下拉、左偏、右偏）

ZWPullMenu.gif

下拉菜单组件化封装的需求

项目开发初期、需求并不明确、没有统一的下拉菜单样式。多人协作开发、封装了多个组件模板且没有与具体业务隔离。下拉菜单位置不定，导致需要左偏、右偏、下拉、上拉多种显示模式出现。

显示模式多样性、类似微信、支付宝首页下拉更多菜单页面。除此之外，允许根据参数自定义样式。
调用方式简单方便、支持多样式调用方法。自动判断文字、图标文字等显示内容模板。
自动优化显示区域、根据入参锚点、自动判断偏移半区、自动计算上拉/下拉显示模式。支持TableViewCell中滚动点击显示位置依赖不偏移。

ZWPullMenuView自动优化位置显示、箭头指向

ZWPullMenuView初始化仅提供anchorView或者anchorPoint参数来确定PullMenu的箭头指向位置。
上半区：箭头指示点所属上半区、PullMenuView下拉菜单显示。
下半区：箭头指示点所属下半区、PullMenuView上拉菜单显示。
左半区：箭头指示点所属左半区、PullMenuView右偏移、自动规避围栏越界。
右半区：箭头指示点所属右半区、PullMenuView左偏移、自动规避围栏越界。

ZWPullMenuView初始化方法

根据点击事件视图anchorView自动计算最优的菜单显示位置。推荐初始化方法
- anchorView：箭头指向视图、一般以点击按钮视图作为参数。
- titleArray：文字显示数组。
- imageArray：icon图标name数组、仅支持本地图片。
- menuArray：ZWPullMenuModel图文数组Model。

/**
 *  anchorView：下拉依赖视图[推荐初始化]
 *  箭头指向依赖视图
 *  titleArray:文字
 *  imageArray:icon
 *  menuArray:图文Model
 */
+ (instancetype)pullMenuAnchorView:(UIView *)anchorView;
+ (instancetype)pullMenuAnchorView:(UIView *)anchorView titleArray:(NSArray *)titleArray;
+ (instancetype)pullMenuAnchorView:(UIView *)anchorView titleArray:(NSArray *)titleArray imageArray:(NSArray *)imageArray;
+ (instancetype)pullMenuAnchorView:(UIView *)anchorView menuArray:(NSArray<ZWPullMenuModel *> *)menuArray;

根据自定义箭头依赖点anchorPoint初始化、自动计算最优菜单显示位置。
- anchorPoint：自定义箭头依赖点位置。
- titleArray：文字显示数组。
- imageArray：icon图标name数组、仅支持本地图片。
- menuArray：ZWPullMenuModel图文数组Model。

/**
 *  anchorView：下拉依赖绝对坐标
 *  指定坐标下拉
 *  箭头指向点
 *  titleArray:文字
 *  imageArray:icon
 *  menuArray:图文Model
 */
+ (instancetype)pullMenuAnchorPoint:(CGPoint)anchorPoint;
+ (instancetype)pullMenuAnchorPoint:(CGPoint)anchorPoint titleArray:(NSArray *)titleArray;
+ (instancetype)pullMenuAnchorPoint:(CGPoint)anchorPoint titleArray:(NSArray *)titleArray imageArray:(NSArray *)imageArray;
+ (instancetype)pullMenuAnchorPoint:(CGPoint)anchorPoint menuArray:(NSArray<ZWPullMenuModel *> *)menuArray;

ZWPullMenuView自定义参数设置

核心参数zwPullMenuStyle设置

typedef NS_ENUM(NSInteger, ZWPullMenuStyle) {
    PullMenuDarkStyle = 0,  //类微信、黑底白字
    PullMenuLightStyle      //类支付宝、白底黑字
};

/** 
 *  pullMenu样式
 */
@property (nonatomic, assign) ZWPullMenuStyle zwPullMenuStyle;

/**
 *  相关配置
 */
@property (nonatomic, strong) ZWPullMenuConfig *zw_menuConfg;

可配置的其他相关参数

#define MenuContentMargin       15          //默认文本图片边距
#define MenuImageWidth          30          //默认图片最小尺寸
#define MenuBorderMinMargin     10          //默认下拉框边界围栏
#define MenuTitleFontSize       15          //默认文本字体大小

@interface ZWPullMenuConfig : NSObject
//文本图片边距
@property (nonatomic, assign) CGFloat zw_menuContentMargin;
//图片最小尺寸
@property (nonatomic, assign) CGFloat zw_menuImageWidth;
//下拉框边界围栏
@property (nonatomic, assign) CGFloat zw_menuBorderMinMargin;
//文本字体大小
@property (nonatomic, assign) CGFloat zw_menuTitleFontSize;

其他参数自定义样式
- coverBgColor ：自定义蒙层视图背景色。
- menuBgColor ：自定义Menu视图背景色。
- menuCellHeight ：自定义Menu行高。
- triangleHeight ：自定义指示小箭头高度。
- menuMaxHeight : 自定义Menu最大展示高度。
- lineColor: 自定义分割线颜色

Menu点击事件

Block实现点击事件、参数menuRow

/**
 *  click
 */
@property (nonatomic, copy) BlockSelectedMenu blockSelectedMenu;

selected.png

ZWPullMenuView调用方法

基本用法.png

如何使用SDK

强烈建议您使用pod导入，节省导入依赖的时间。

使用cocoaPods导入(搜索不到请更新本地仓库)

pod 'ZWPullMenuView'

直接将文件ZWPullMenuView拖入工程中

#import "ZWPullMenuView.h"

源码

源码放在GitHub上，欢迎指正，记得star哦！