Radio Button is a very common component of any application. It allows us to choose only one option among a set of options. So in this Xcode Radio Button Example we will be learning how to use Radio Button while creating iOS Apps using Swift.
Xcode Radio Button Example
Creating a new Xcode Project
- As always we do we will create a new Xcode Project. I am creating a new Single View Application.
Adding DLRadio Buttons to the Project
- The problem is Xcode does not have any inbuilt option for creating Radio Buttons. So I am going to use this DLRadio Button Library I found in GitHub.
- So Open Terminal and navigate to your Project Directory.
- Now run the following command.
pod init
- Now this will create a file named podfile in your project directory.
- Open the file with any code editor (I am using Sublime) and replace the whole code of the file with the following.
# Uncomment the next line to define a global platform for your project # platform :ios, '9.0' target 'RadioButtonExample' do pod 'DLRadioButton', '~> 1.4' end
- Now save the file and again come inside terminal and run the following command.
pod install
- And you will see the following results.
- Now close Xcode and open YourProjectName.xcworkspace. You will find it inside your project directory.
- If you are confused about these steps then see Xcode Firebase Tutorial where I explained using CocoaPods in very detail.
Creating Radio Buttons
- Now to create Radio Buttons we will create UIButton.
- But first we will Drag Drop a View to our Storyboard. This is to group our Radio Buttons.
- Now Drag two Buttons inside the View. And also drag a Label.
- Change the Button type to Custom in Attribute Inspector.
- Now come to Identity Inspector and change the custom class to DLRadioButton.
- So by now you will see the following screen in your storyboard.
- Now you can test your Radio Buttons. But right now it will not behave as a Radio Button. If you will be able to select both options as shown in the image.
- Now secondary click on your first radio button. And inside Outlet Collections drag otherButtons to the second Radio button (Female). If you have more radio button then you have to do the same for every button.
- Now if you will run the application in Simulator you will see only one button is selecting.
Handling Radio Button Clicks
- This process is same as we learnt in Xcode Button Tutorial. Just connect your Views to your Swift code. And then you can handle Option Selection as I did in the following code.
// // ViewController.swift // RadioButtonExample // // Created by Belal Khan on 19/01/17. // Copyright © 2017 Belal Khan. All rights reserved. // import UIKit import DLRadioButton class ViewController: UIViewController { @IBOutlet weak var label: UILabel! override func viewDidLoad() { super.viewDidLoad() // Do any additional setup after loading the view, typically from a nib. } override func didReceiveMemoryWarning() { super.didReceiveMemoryWarning() // Dispose of any resources that can be recreated. } @IBAction func radioMale(sender: AnyObject) { label.text = "Gender is Male" } @IBAction func radioFemale(sender: AnyObject) { label.text = "Gender is Female" } }
- Now run your application and you will see the following output.
- Bingo! Its working absolutely fine. Now if you need you can get my source code from the below link.
[sociallocker] Xcode Radio Button Tutorial (990 downloads) [/sociallocker]
So thats all for this Xcode Radio Button Example friends. Feel free to leave your comments if having any confusions. Thank You 🙂
Dipti says
my question is why other button option is not showing in my view controller when I drag button after pressing Ctl key to view controller?
Tom G says
Hi,
Thanks for developing this tutorial. It works well but I would like to add some calculation functionality to it.
I developed a project with two radio button groups, with each radio button within each group labeled with an integer value. Since only one button from each group can be selected at a time, I want to total the values of the selected buttons into a separate label. Any idea on how to write code to accomplish this ? Here is a simple wireframe of what I have in mind.
Radio Button Group 1
0
* 1
2
Radio Button Group 2
0
1
* 2
Press Here to Calculate
3 Total of selected button from each group