最近寫了這個框架: FFDropDownMenu,類似手機QQ下拉菜單。
github地址:
https://github.com/chenfanfang/FFDropDownMenu
更多的使用方法的demo地址:
https://github.com/chenfanfang/CollectionsOfExample
更多的使用方法的博客地址:
http://www.itdecent.cn/notebooks/5552428/latest
先瀏覽下效果圖:

仿手機QQ下拉菜單.gif

仿手機QQ下拉菜單.png
<a id="Installation"></a> Installation【安裝】
From CocoaPods【使用CocoaPods】
pod FFDropDownMenu
Manually【手動導入】
Drag all source files under floder
FFDropDownMenuto your project.【將FFDropDownMenu文件夾中的所有源代碼拽入項目中】FFDropDownMenu文件夾里面的文件有
FFDropDownMenuBasedCell.h FFDropDownMenuBasedCell.m
FFDropDownMenuBasedModel.h FFDropDownMenuBasedModel.m
FFDropDownMenuCell.h FFDropDownMenuCell.m
FFDropDownMenuModel.h FFDropDownMenuModel.m
FFDropDownMenuTriangleView.h FFDropDownMenuTriangleView.m
FFDropDownMenuView.h FFDropDownMenuView.m
<a id="Examples"></a>Basic Usage 【基本的使用】
先導入頭文件
//若使用CocoaPods
#import <FFDropDownMenuView.h>
//若使用手動導入
#import "FFDropDownMenuView.h"
創(chuàng)建一個strong的下拉菜單屬性
/** 下拉菜單 */
@property (nonatomic, strong) FFDropDownMenuView *dropDownMenu;
創(chuàng)建菜單模型數(shù)組
//FFDropDownMenuModel.h
/**
* 快速實例化一個下拉菜單模型
*
* @param menuItemTitle 菜單選項的標題
* @param menuItemIconName 菜單選項的圖標名稱
* @param menuBlock 點擊的回調(diào)block
*
* @return 實例化的菜單模型
*/
+ (instancetype)ff_DropDownMenuModelWithMenuItemTitle:(NSString *)menuItemTitle menuItemIconName:(NSString *)menuItemIconName menuBlock:(FFMenuBlock)menuBlock;
/** 獲取下拉菜單模型數(shù)組 */
- (NSArray *)getDropDownMenuModelsArray {
__weak typeof(self)weakSelf = self;
//菜單模型0
FFDropDownMenuModel *menuModel0 = [FFDropDownMenuModel ff_DropDownMenuModelWithMenuItemTitle:@"Twitter" menuItemIconName:@"menu0" menuBlock:^{
UIViewController *vc = [UIViewController new];
[weakSelf.navigationController pushViewController:vc animated:YES];
}];
//菜單模型1
FFDropDownMenuModel *menuModel1 = [FFDropDownMenuModel ff_DropDownMenuModelWithMenuItemTitle:@"Line" menuItemIconName:@"menu1" menuBlock:^{
//Do Something
}];
//菜單模型2
FFDropDownMenuModel *menuModel2 = [FFDropDownMenuModel ff_DropDownMenuModelWithMenuItemTitle:@"QQ" menuItemIconName:@"menu2" menuBlock:^{
//Do Something
}];
//菜單模型3
FFDropDownMenuModel *menuModel3 = [FFDropDownMenuModel ff_DropDownMenuModelWithMenuItemTitle:@"QZone" menuItemIconName:@"menu3" menuBlock:^{
//Do Something
}];
//菜單模型4
//...................
NSArray *menuModelArr = @[menuModel0, menuModel1, menuModel2, menuModel3......];
return menuModelArr;
}
創(chuàng)建下拉菜單方式1
/** 創(chuàng)建下拉菜單方式1 */
- (void)createDropdownMenuMethodOne {
//若使用默認CGFloat值 請使用 FFDefaultFloat
//若使用默認CGSize值 請使用 FFDefaultSize
//若使用默認Cell值 請使用 FFDefaultCell
//若使用默認Color值 請使用 FFDefaultColor
//若使用默認ScaleType值 請使用 FFDefaultMenuScaleType
NSArray *menuModelsArr = [self getDropDownMenuModelsArray];
self.dropDownMenu = [FFDropDownMenuView ff_DefaultStyleDropDownMenuWithMenuModelsArray:menuModelsArr menuWidth:145 eachItemHeight:40 menuRightMargin:10 triangleRightMargin:20];
//若還需要對別的屬性進行賦值,則可以再對別的屬性進行賦值,最后一定要調(diào)用setup方法。如下
/*
self.dropDownMenu.menuScaleType = FFDropDownMenuViewScaleType_TopRight;
self.dropDownMenu...... = ......;
[self.dropDownMenu setup];
*/
}
創(chuàng)建下拉菜單方式2
/** 創(chuàng)建下拉菜單方式2 */
- (void)createDropdownMenuMethodTwo {
NSArray *menuModelsArr = [self getDropDownMenuModelsArray];
self.dropDownMenu = [FFDropDownMenuView new];
//進行屬性的賦值
//若使用默認CGFloat值 請使用 FFDefaultFloat 、或者無需進行賦值
//若使用默認CGSize值 請使用 FFDefaultSize 、或者無需進行賦值
//若使用默認Cell值 請使用 FFDefaultCell 、或者無需進行賦值
//若使用默認Color值 請使用 FFDefaultColor 、或者無需進行賦值
//若使用默認ScaleType值 請使用 FFDefaultMenuScaleType 、或者無需進行賦值
/** 下拉菜單模型數(shù)組 */
self.dropDownMenu.menuModelsArray = menuModelsArr;
/** cell的類名 */
self.dropDownMenu.cellClassName = FFDefaultCell;
/** 菜單的寬度(若不設(shè)置,默認為 150) */
self.dropDownMenu.menuWidth = 145;
/** 菜單的圓角半徑(若不設(shè)置,默認為5) */
self.dropDownMenu.menuCornerRadius = FFDefaultFloat;
/** 每一個選項的高度(若不設(shè)置,默認為40) */
self.dropDownMenu.eachMenuItemHeight = 40;
/** 菜單條離屏幕右邊的間距(若不設(shè)置,默認為10) */
self.dropDownMenu.menuRightMargin = 10;
/** 三角形顏色(若不設(shè)置,默認為白色) */
self.dropDownMenu.triangleColor = [UIColor whiteColor];
/** 三角形相對于keyWindow的y值,也就是相對于屏幕頂部的y值(若不設(shè)置,默認為64) */
self.dropDownMenu.triangleY = FFDefaultFloat;
/** 三角形距離屏幕右邊的間距(若不設(shè)置,默認為20) */
self.dropDownMenu.triangleRightMargin = FFDefaultFloat;
/** 三角形的size size.width:代表三角形底部邊長,size.Height:代表三角形的高度(若不設(shè)置,默認為CGSizeMake(15, 10)) */
self.dropDownMenu.triangleSize = FFDefaultSize;
/** 背景顏色開始時的透明度(還沒展示menu的透明度)(若不設(shè)置,默認為0.02) */
self.dropDownMenu.bgColorbeginAlpha = 0;
/** 背景顏色結(jié)束的的透明度(menu完全展示的透明度)(若不設(shè)置,默認為0.2) */
self.dropDownMenu.bgColorEndAlpha = 0.4;
/** 動畫效果時間(若不設(shè)置,默認為0.2) */
self.dropDownMenu.animateDuration = FFDefaultFloat;
/** 菜單的伸縮類型 */
self.dropDownMenu.menuScaleType = FFDefaultMenuScaleType;
//所有屬性賦值完 一定要調(diào)用 setup
[self.dropDownMenu setup];
}
顯示菜單
[self.dropDownMenu showMenu];
期待
- 如果在使用過程中遇到BUG,希望你能在 簡書私信我,或者在我簡書專題的博客進行評論。謝謝(或者嘗試下載最新的框架代碼看看BUG修復沒有)
- 如果在使用過程中發(fā)現(xiàn)功能不夠用,希望你能在 簡書私信我,或者在我簡書專題的博客進行評論。我非常想為這個框架增加更多好用的功能,謝謝
- 如果你想和我一起完善FFDropDownMenu,請Pull Requests我