Skip to content
The elegant dropdown menu, written in Swift, appears underneath navigation bar to display a list of related items when a user click on the navigation title.
Branch: master
Clone or download
Latest commit 9244bde Nov 25, 2018
Type Name Latest commit message Commit time
Failed to load latest commit information.
Assets Update Demo.gif Jul 24, 2015
BTNavigationDropdownMenu.xcodeproj Carthage support Oct 26, 2018
Demo Update recommended xcodeproj setting Sep 18, 2018
Source Carthage support Oct 26, 2018
.travis.yml Update .travis.yml Apr 17, 2016
BTNavigationDropdownMenu.podspec Update Apr 17, 2016
LICENSE Rollback Jul 7, 2015 Update Nov 25, 2018

Support Xcode 10 and Swift 4.2 now.

alt tag

Pod Version License: MIT Language


This elegant Swift dropdown menu appears underneath the navigation bar to display a list of related items when a user clicks on the navigation title.

alt tag



BTNavigationDropdownMenu is available through CocoaPods. To install it, simply add the following line to your Podfile:

pod 'BTNavigationDropdownMenu'

Go ahead and import BTNavigationDropdownMenu into your own Swift files

import BTNavigationDropdownMenu


Carthage is a decentralized dependency manager that builds your dependencies and provides you with binary frameworks.

You can install Carthage with Homebrew using the following command:

$ brew update
$ brew install carthage

To integrate BTNavigationDropdownMenu into your Xcode project using Carthage, specify it in your Cartfile:

github "PhamBaTho/BTNavigationDropdownMenu" ~> 0.5

Run carthage update to build the framework and drag the built BTNavigationDropdownMenu.framework into your Xcode project.



Start by creating an Array that contains strings as elements of a dropdown list:

let items = ["Most Popular", "Latest", "Trending", "Nearest", "Top Picks"]

Create a new instance of BTNavigationDropdownMenu:

let menuView = BTNavigationDropdownMenu(navigationController: self.navigationController, containerView: self.navigationController!.view, title: BTTitle.title("Dropdown Menu"), items: items)

or like this:

let menuView = BTNavigationDropdownMenu(title: BTTitle.index(1), items: items)

BTTitle is an enum. We can set BTTitle.title(string) or BTTitle.index(Int) (Note: BTTitle.index is the index of defined items array).

By default, navigationController is the topmost navigation controller and containerView is keyWindow.

(keyWindow is recommended for containerView so that the black overlay can cover the whole screen. In some cases, keyWindow doesn't work properly, like using with side menu, (e.g. SWRevealViewController), the dropdown menu doesn't move along with the parent view or navigation controller. To workaround this issue, you can use self.navigationController!.view.)

Set title of navigation bar as menuView:

self.navigationItem.titleView = menuView

Call BTNavigationDropdownMenu closure to get the index of selected cell:

menuView.didSelectItemAtIndexHandler = {[weak self] (indexPath: Int) -> () in
            print("Did select item at index: \(indexPath)")
            self.selectedCellLabel.text = items[indexPath]
} or menuView.hide() to show or hide dropdown menu manually.

menuView.toggle() to toogle dropdown menu shown/hide.

menuView.isShown (Boolean type) property to check showing state of dropdown menu.

menuView.updateItems(items: [AnyObject]) to update items in dropdown menu.


First, assign the items and frame for the dropdown menu. Then, customize the look and feel of the menu by overriding these properties:

cellHeight - Cell height Default is 50

cellBackgroundColor - Cell background color Default is whiteColor()

cellSeparatorColor - Cell separator color Default is darkGrayColor()

cellTextLabelColor - Text color inside of the cell Default is darkGrayColor()

cellTextLabelFont - Font inside the cell Default is HelveticaNeue-Bold, size 17

navigationBarTitleFont - Navigation bar title font Default is HelveticaNeue-Bold, size 17

cellTextLabelAlignment - Text alignment inside of the cell Default is .Left

cellSelectionColor - Selected color of the cell Default is lightGrayColor()

checkMarkImage - Checkmark icon for the cell.

animationDuration - Animation duration for showing/hiding of the menu Default is 0.5s

arrowImage - Arrow next to the navigation title

arrowPadding - Padding between the navigation title and arrow. Default is 15

maskBackgroundColor - Mask layer color Default is blackColor()

maskBackgroundOpacity - Opacity of the mask layer Default is 0.3

menuTitleColor - Title color displayed in the menu. Default is lightGrayColor()

shouldKeepSelectedCellColor - Selected cell color visibility when menu is shown Default is false

shouldChangeTitleText - Ability to change the selected title text Default is true

selectedCellTextLabelColor - Selected cell text label color Default is darkGrayColor()

arrowTintColor - Tint color of the arrow. Default is whiteColor()


  • iOS 8.0+ (CocoaPods with Swift support will only work on iOS 8.0+. Alternatively, you will have to import library manually to your project)
  • Xcode 8.0+, Swift 3.0+


See the CHANGELOG for details


BTNavigationDropdownMenu is available under the MIT License. See the LICENSE for details.

You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.