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

若覺得框架自帶的菜單樣式不夠好看，或者布局不是自己想要的效果，那么，你可以自定義菜單選項的cell,自己給每個菜單選項cell添加子控件，自己對其進行任意樣式的布局。這篇博客將介紹如何自定義菜單選項cell。

先來看下效果圖

仿QQ下拉菜單自定義菜單樣式.gif

仿QQ下拉菜單自定義菜單樣式.png

框架自帶的菜單選項樣式是左邊是圖標，右邊是標題，上面的效果圖是左邊標題，右邊圖標。你也可以自定義任何樣式，添加更多的控件。

<a id="Installation"></a> Installation【安裝】

From CocoaPods【使用CocoaPods】

pod  FFDropDownMenu

Manually【手動導(dǎo)入】

• Drag all source files under floder FFDropDownMenu to 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

【開始使用】

先導(dǎo)入頭文件

//若使用CocoaPods
#import <FFDropDownMenuView.h>

//若使用手動導(dǎo)入
#import "FFDropDownMenuView.h"

自定義繼承于FFDropDownMenuBasedCell類的菜單cell

自定義菜單cell 的.h文件

#import <FFDropDownMenuBasedCell.h>

@interface FFDropDownMenuCustomCell : FFDropDownMenuBasedCell

@end

自定義菜單cell 的.m文件

#import "FFDropDownMenuCustomCell.h"

//model
#import "FFDropDownMenuModel.h"

@interface FFDropDownMenuCustomCell ()

/** 圖片 */
@property (weak, nonatomic) UIImageView *customImageView;

/** 標題 */
@property (weak, nonatomic) UILabel *customTitleLabel;

/** 底部分割線 */
@property (nonatomic, weak) UIView *separaterView;
@end

@implementation FFDropDownMenuCustomCell

- (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier {
    if (self = [super initWithStyle:style reuseIdentifier:reuseIdentifier]) {
        //初始化子控件
        UIImageView *customImageView = [[UIImageView alloc] init];
        customImageView.contentMode = UIViewContentModeScaleToFill;
        [self addSubview:customImageView];
        self.customImageView = customImageView;
        
        UILabel *customTitleLabel = [[UILabel alloc] init];
        customTitleLabel.font = [UIFont systemFontOfSize:15];
        [self addSubview:customTitleLabel];
        self.customTitleLabel = customTitleLabel;
        
        UIView *separaterView = [[UIView alloc] init];
        separaterView.backgroundColor = [UIColor colorWithRed:25 / 255.0 green:168 / 255.0 blue:243 / 255.0 alpha:0.3];
        [self addSubview:separaterView];
        self.separaterView = separaterView;
    }
    return self;
}

- (void)layoutSubviews { //這個方法的主要任務(wù)是進行子控件frame的賦值
    [super layoutSubviews];
    //frame的賦值
    CGFloat separaterHeight = 1; //底部分割線高度
    
    //圖片 customImageView
    CGFloat imageViewMargin = 3;
    CGFloat imageViewH = self.frame.size.height - 2 * imageViewMargin;
    self.customImageView.frame = CGRectMake(10, imageViewMargin, imageViewH, imageViewH);
    
    //標題
    CGFloat labelX = CGRectGetMaxX(self.customImageView.frame) + 10;
    self.customTitleLabel.frame = CGRectMake(labelX, 0, self.frame.size.width - labelX, self.frame.size.height - separaterHeight);
    
    //分割線
    self.separaterView.frame = CGRectMake(0, self.frame.size.height - separaterHeight, self.frame.size.width, separaterHeight);
}

/** 重寫setMenuModel---對控件進行賦值 */
- (void)setMenuModel:(id)menuModel {
    _menuModel = menuModel;
    
    FFDropDownMenuModel *realMenuModel = (FFDropDownMenuModel *)menuModel;
    self.customTitleLabel.text = realMenuModel.menuItemTitle;
    //給imageView賦值
    self.customImageView.image = [UIImage imageNamed:realMenuModel.menuItemIconName];
}

@end

若自定義了cell,框架自帶的模型FFDropDownMenuModel里面的屬性不夠用，可以自定義一個繼承于FFDropDownMenuBasedModel的模型，自己添加屬性。本篇博客的例子用框架自帶的模型FFDropDownMenuModel是夠用的，所以不自定義菜單模型。自定義菜單模型在這篇博客中有介紹http://www.lxweimin.com/p/6a42a35ae2db

到此為止，自定義菜單樣式就已經(jīng)完成，接下來就是如何創(chuàng)建菜單了。

獲取下拉菜單模型數(shù)組

/** 獲取下拉菜單模型數(shù)組 */
- (NSArray *)getDropDownMenuModelsArray {
    __weak typeof(self)weakSelf = self;
    
    
    //若 模型FFDropDownMenuModel里面的屬性不夠用，可以自定義繼承于FFDropDownMenuBasedModel的模型
    
    //菜單模型0
    FFDropDownMenuModel *menuModel0 = [FFDropDownMenuModel new];
    menuModel0.menuItemTitle = @"Twitter";
    menuModel0.menuItemIconName = @"menu0";
    menuModel0.menuBlock = ^ {
        UIViewController *vc = [UIViewController new];
        [weakSelf.navigationController pushViewController:vc animated:YES];
    };
    
    //菜單模型1
    FFDropDownMenuModel *menuModel1 = [FFDropDownMenuModel new];
    menuModel1.menuItemTitle = @"Line";
    menuModel1.menuItemIconName = @"menu1";
    menuModel1.menuBlock = ^ {
        //do something
    };
    
    //菜單模型2
    FFDropDownMenuModel *menuModel2 = [FFDropDownMenuModel new];
    menuModel2.menuItemTitle = @"QQ";
    menuModel2.menuItemIconName = @"menu2";
    menuModel2.menuBlock = ^ {
        //do something
    };
    
    NSArray *menuModelArr = @[menuModel0, menuModel1, menuModel2....];
    
    return menuModelArr;
}

創(chuàng)建下拉菜單

- (void)createDropdownMenu {
    NSArray *menuModelsArr = [self getDropDownMenuModelsArray];
    
    self.dropDownMenu = [FFDropDownMenuView new];
    self.dropDownMenu.menuModelsArray = menuModelsArr;
    self.dropDownMenu.cellClassName = @"FFDropDownMenuCustomCell";
    self.dropDownMenu.menuItemBackgroundColor = FFColor(255, 255, 255, 0.7);
    self.dropDownMenu.triangleColor = FFColor(255, 255, 255, 0.7);
    [self.dropDownMenu setup];
}

顯示下拉菜單

[self.dropDownMenu showMenu];

期待

• 如果在使用過程中遇到BUG，希望你能在 簡書私信我，或者在我簡書專題的博客進行評論。謝謝（或者嘗試下載最新的框架代碼看看BUG修復(fù)沒有）
• 如果在使用過程中發(fā)現(xiàn)功能不夠用，希望你能在 簡書私信我，或者在我簡書專題的博客進行評論。我非常想為這個框架增加更多好用的功能，謝謝
• 如果你想和我一起完善FFDropDownMenu，請Pull Requests我

我

http://www.lxweimin.com/users/80fadb71940d/latest_articles