Drop Down Menu in iPhone

Introduction

In this article I will create a Single View application to implement a DropDown menu. In this article I will use a label, 4 buttons and a view. When we click on the Down arrow button it will show a menu for the view where we set the button with their title name. Now we select any color button from the menu. After selection it shows its title on the label and the corresponding color on the view.

To understand it we use the following.

Step 1

Open XCode by double-clicking on it.

Step 2

Create a New XCode Project by clicking on it.

Step 3

Now select Single View Application and click on Next.

Step 4

Now provide your Product Name and Company Identifier.

Step 5

Select the location where you want to save your project and click on Create.

Step 6

Now here we write the code.

ViewController.h

#import <UIKit/UIKit.h>
@interface ViewController : UIViewController
@property (nonatomic, strong) IBOutlet UILabel *ddText;
@property (nonatomic, strong) IBOutlet UIView *ddMenu;
@property (nonatomic, strong) IBOutlet UIButton *ddMenuShowButton;
- (IBAction)ddMenuShow:(UIButton *)sender;
- (IBAction)ddMenuSelectionMade:(UIButton *)sender;
@end

ViewController.m

#import "ViewController.h"
@interface ViewController ()
@end
@implementation ViewController
@synthesize ddMenu, ddText;
@synthesize ddMenuShowButton;
-(void)viewDidLoad
{
self.ddMenu.hidden = YES;
}
- (IBAction)ddMenuShow:(UIButton *)sender
{
if (sender.tag == 0) {
sender.tag = 1;
self.ddMenu.hidden = NO;
[sender setTitle:@"â–²" forState:UIControlStateNormal];
} else {
sender.tag = 0;
self.ddMenu.hidden = YES;
[sender setTitle:@"â–¼" forState:UIControlStateNormal];
}
}
- (IBAction)ddMenuSelectionMade:(UIButton *)sender
{
self.ddText.text = sender.titleLabel.text;
[self.ddMenuShowButton setTitle:@"â–¼" forState:UIControlStateNormal];
self.ddMenuShowButton.tag = 0;
self.ddMenu.hidden = YES;
switch (sender.tag) {
case 1:
self.view.backgroundColor = [UIColor redColor];
break;
case 2:
self.view.backgroundColor = [UIColor blueColor];
break;
case 3:
self.view.backgroundColor = [UIColor greenColor];
break;
default:
break;
}
}
@end

ViewController.Xib

Xib-file-in-iphone.png


Step 7

Now here we set the tag of the button like this:

set-button-tag-1-in-iphone.png

Step 8

Finally we click on the Run button to show the output.

Step 9

Output1 in iPhone:

Output1-in-iphone.png

Output2 in iPhone:

Output2-in-iphone.png

Output3 in iPhone:

Output3-in-iphone.png

Output4 in iPhone:

Output4-in-iphone.png

Output5 in iPhone:

Output5-in-iphone.png