How to Create own Custom Flat Button in Objective C

hello Every one Today We are leaning how to create lovely custom flat buttons..

if you are working on projects or a big apps than you have to maintain the theme of the whole application for example Application color , navigations icons buttons and many more.. how can we handle that ?? using Customization !!!

so lets create Custom Buttons For our Application like this

 

so lets start the Code

Step 1: Create new Project with single view Application and add one view Controller as root view in appDelegate

step 2: for Button class create new File and do subclass of “UIButton” and give name as “MBButton” as you can see in below screen.

step 3) in your Custom Button Class MBButton.h set enum for your button Types for example :

 

typedef NS_ENUM(NSInteger, MBButtonType) {
    ButtonDefault= 0,
    ButtonCircle
};

and your private varible for the class as below

    MBButtonType buttonType;
    NSString *buttonTitle;
    CGRect buttonFrame;

and add one methods for your Button Frame

-(id)initWithFrame:(CGRect)frame type:(MBButtonType)btnType;

now add define your Button Colors as your theme forExample

   #define Custom_Gray [UIColor colorWithRed:(210.0f/255.0f) green:(210.0f/255.0f) blue:(210.0f/255.0f) alpha:1.0f]
   #define Custom_Green [UIColor colorWithRed:(99.0f/255.0f) green:(181.0f/255.0f) blue:(76.0f/255.0f) alpha:1.0f]
   #define Custom_Green_Dark [UIColor colorWithRed:(75.0f/255.0f) green:(175.0f/255.0f) blue:(50.0f/255.0f) alpha:1.0f]

Step 4) in MBButton.m file

in MBButton.m file write code for the button frame methods

-(id)initWithFrame:(CGRect)frame type:(MBButtonType)btnType
{
    self = [super initWithFrame:frame];
    buttonFrame = frame;
    if(self ){
        buttonType  = btnType;
        [self setButtonWithType];     // set Button theme as per button type
        if(buttonType == ButtonCircle){
            // set Frame size for circle
            if(frame.size.height > frame.size.width){
                buttonFrame.size.height = frame.size.width;
            }else {
                buttonFrame.size.width = frame.size.height;
            }
       }
    }
    return  self;
}

write code for individual button Types

/* SET BUTTON */
-(void)setButtonWithType
{
    switch (buttonType) {
        case ButtonDefault:
            [self setBackgroundImage:[self createImageFromColor:Custom_Gray] forState:UIControlStateNormal];
            [self setBackgroundImage:[self createImageFromColor:Custom_Gray] forState:UIControlStateHighlighted];
            [self setTitleColor:[UIColor grayColor] forState:UIControlStateNormal];
            self.layer.borderColor = [UIColor grayColor].CGColor;
            self.layer.borderWidth = 0.0f;
            self.layer.cornerRadius = 4.0f;
            break;
            
        case ButtonCircle:
            [self setBackgroundImage:[self createImageFromColor: Custom_Green] forState:UIControlStateNormal];
            [self setBackgroundImage:[self createImageFromColor:Custom_Green_Dark] forState:UIControlStateHighlighted];
            [self setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
            self.layer.borderColor = [UIColor blackColor].CGColor;
            self.layer.borderWidth = 0.0f;
            self.layer.cornerRadius = self.frame.size.width/2;
            
            break;
        default:
            break;
    }
    
    gesture = [[UITapGestureRecognizer alloc]initWithTarget:self action:@selector(handleTap:)];
    gesture.numberOfTapsRequired =1;
    [self addGestureRecognizer:gesture];
    self.layer.masksToBounds = YES;
}

Handle The Tap of the Buttons

-(void)handleTap:(id)sender {
    
    CATransition *animation = [CATransition animation];
    [animation setDelegate:self];
    [animation setDuration:1.0f];
    [animation setTimingFunction:UIViewAnimationCurveEaseInOut];
    [animation setType:@"rippleEffect" ];
    [self.layer addAnimation:animation forKey:NULL];
}

create Image for the Colors

/* CREATE IMAGE FROM THE COLOR */
-(UIImage *)createImageFromColor:(UIColor *)color
{
    CGRect rect = CGRectMake(0.0f, 0.0f, 1.0f, 1.0f);
    UIGraphicsBeginImageContext(rect.size);
    
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextSetFillColorWithColor(context, [color CGColor]);
    CGContextFillRect(context, rect);
    
    UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    
    return image;
}

Now your custom button ready to use 🙂

just import the

 #import "MBButton.h"

in your ViewController and write bellow code

    MBButton *button = [[MBButton alloc]initWithFrame:CGRectMake(100, 100, 100, 40) type:ButtonDefault];
    [button setTitle:@"Default" forState:UIControlStateNormal];
    [button addTarget:self action:@selector(onClickDefaultButton) forControlEvents:UIControlEventTouchUpInside];

-(void)onClickDefaultButton
{
    NSLog(@"Button Click Default");
}

Yeah i Done it.!!!

 

You Can download also Code From Here

swift hello world program using ViewConoller Base (XIB )

we are learning today swift demo program using XIB  steps are as follows

-> create new project and select empty application.

-> go to new file and create swift file named with “DemoRootViewController.swift” and create new user interface name “DemoRootViewController.xib” , in xib select  “File’s owner” and set class “_TtC18DemoViewController22DomeRootViewController”  as displayed in below image

in “DemoRootViewController.swift” write bellow code

import UIKit
class DemoRootViewController:UIViewController
{
	init(nibName nibNameOrNil: String? , bundle nibBundleOrNil:NSBundle?)
	{
		super.init(nibName:nibNameOrNil , bundle: nibBundleOrNil);
	}
	override func didReceiveMemoryWarning() 
	{
		super.didReceiveMemoryWarning()
	}
	override func viewDidLoad()
	{
		super.viewDidLoad();
	}
}

in appDelegate write Code in  method

  func application(application: UIApplication, didFinishLaunchingWithOptions launchOptions: NSDictionary?) -> Bool

    var rootView :DemoRootViewController? = DemoRootViewController(nibName: "DemoRootViewController", bundle: nil)
    self.window!.rootViewController = rootView;

now your swift code working with view Controller

you can download code from here

Create TableView

Hi This is demo for Table View By – mits Bhadeshiya