Pages

How to Draw UIButton programmatically in Swift

Drawing Labels on View Controller Programmatically :

In my previous post I showed you how to draw labels programmatically, But now I will show you how to add buttons in the ViewController programmatically. Drawing the UIButton  programmatically you will have to set the size of the view controller window that you want to display. By using CGRectMake() function you will set the size of the UIButton. And if you want to set the title of the UIButton then you should use the property setTitle(). And if you want to set custom color of the button the you will use the property of the UIButton "UIColor.<anyColor>"

Basically drawing buttons through coding a as simple as drawing labels. Let me show you:-->

1. The very first thing you do is to create a Xcode project by usual setting of Single View Application & selecting the language Swift.

2. Now add following bit of code to your viewDidLoad() method of ViewController.swift class because whenever view will load you button will be drawn automatically.

//Mark : for button 1
        var button1 = UIButton.buttonWithType(UIButtonType.System) as UIButton     
                            //setting the button type to  .System
        button1.frame = CGRectMake(100, 100, 100, 50)          
                            //Setting the frame of button with x-axis , y-axis , height & width
        button1.backgroundColor = UIColor.grayColor()                
                            //setting background color
        button1.setTitle("Button1", forState: .Normal)               
                           //setting title for state .Normal is standard
        button1.addTarget(self, action: "action:", forControlEvents: UIControlEvents.TouchUpInside)  
                           //calling the function when button is pressed
       
        //Mark : for button 2
        var button2 = UIButton.buttonWithType(UIButtonType.DetailDisclosure) as UIButton
                            //setting the button type to  .DetaileDisclosure
        button2.frame = CGRectMake(100, 250, 150, 60)       
                            //Setting the frame of button with x-axis , y-axis , height & width
        button2.backgroundColor = UIColor.redColor()         
                            //setting background color
        button2.setTitle("Button2", forState: .Normal)    
                            //setting title for state .Normal is standard
        button2.setTitle("Button2 Selected", forState: UIControlState.Highlighted)   
                           //setting title for state .Highlited is standard
        button2.addTarget(self, action: "action2:", forControlEvents: .TouchDragOutside)  
                           //calling the function when button is pressed && you dragged outside
        
        //Mark : Adding view of buttons           
        
        self.view.addSubview(button1)
        self.view.addSubview(button2)

3. Next thing to do is to add two new functions corresponding to these buttons respectively:

    func action(sender: UIButton!) {            //action related to button 1
        println("Button 1 Tapped")
    }
    
    func action2(sender: UIButton) {        //action related to button 2
        println("Button 2 Tapped")
    }

Your ViewController.Swift file now looks like:

4. Now Build & Run your app..&& your simulator will look like:




   Well again the interface is not impressive but it is pretty much for demonstration...Here the first button is of System Type. There many types of buttons I have showed only two:
1. one is System Type
2. Second is Disclosure Indicator just like table cell Button.

   Now tap any first button & see what happen in your console. It will show you the line whichever button is pressed.

   Remember the first button is of system type normal Button. When you click on it, it will print to console "Button 1 Tapped". But when you tap button 2 & drag outside in same state you will see in console "Button 2 Tapped" && just when you tap on Button 2 the title change to "Button2 Selected"

Well guys there are a lot more properties of button that you guys can play with so go ahead & play...

No comments:

Post a Comment