Pages

Showing posts with label Programmatically UI Design. Show all posts
Showing posts with label Programmatically UI Design. Show all posts

Programmatically designing Table View in Swift

Designing Table View:
      Table view displays a list of elements or basically call them cells, that can be scrolled up & down vertically. They are the objects of the UITableView Class. Table View contains a vertically scrollable list of cells. The cells are the instance of the UITableViewCell class. UITableView is a subclass of UIScrollView. TableView uses UITableViewDelegate && UITableViewDataSource  methods to balance the User Interface && the Data that the table View is displaying. If you are using storyboard && on the top of the default view you dragged && dropped the TableView the you need to manually connect the UITableViewDelegate && UITableViewDataSource to use the methods of these. But if you are using UITableViewController then you don't need to de all this these two are already connected. The below image shows the table view:

How to design the Navigation Controller programmatically without using Storyboard in Swift

Designing User Interface without using Storyboard:


       As you know that UINavigationControllers are the workhorse of organizing the ViewControllers. UINavigationControllers are stack-based.The newest viewController that has been pushed on the screen is the one to visible & the child view controller in terms of hierarchy.

        Designing user Interface using predefined Library objects is a boring task & won't let us learn anything about core part about programming & how these components works internally. So here we will designing the user Interface Programmatically. When I say word something like programmatically I means to say that drawing everything without using Storyboard that is created for us by default when you create your project. 

Presenting a ViewController Programmatically in User Interface

Designing View Controller: 
     Presenting a view programmatically in user interface is as easy as you draw Segment Controller , UIButton & UILabel. and you will get use to it as you practice. And I bet it is pretty easy & interesting task as well.To design the ViewController programmatically either you can use the XIB/NIB file or you can just create an object of the UIViewController() class && the in the AppDelegate.Swift class use the window property to set the size of the ViewController window && then use the "window" property of AppDelegate.Swift file to present the view Controller without using XIB/NIB file buw in this tutorial I will be using the 1st method to present the ViewController from XIB/NIB file. Now lets design the User Interface:

1. Now lets again as usual create a Xcode project by usual setting of Single View Application & selecting the language Swift.

How to design UISegment Control programmatically in Swift

Drawing Segment Control Programmatically :

        A segmented control is a horizontal control made of multiple segments, each segment functioning as a discrete button.  A segmented control affords a compact means to group together a number of controls.

        This definition is good to to get an idea of what is a segment control but now lets deal with the real thing means drawing the segment control programmatically. It is same as we draw buttons programmatically.

1. Now lets again as usual create a Xcode project by usual setting of Single View Application & selecting the language Swift.

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:-->

How to Programmatically Design UILabel in Swift

Drawing Labels on View Controller Programmatically :

Drawing UI by Dragging & Dropping UI Components is pretty much easy task to do but Drawing UI only through shear coding is a task that will take a lot out of you...But it is quiet an easy task when you pay attention to it && I bet you will completely forget about Dragging && Dropping objects from the Inbuilt Library the XCode is providing.

Here is an Example of how you draw a label on the screen programmatically: