Design appearance programmatically or graphically, which one is better? - ios

I'm learning many features of ios programming, but since I'm a beginner I don't know if it's better to design my appearance programmatically or graphically.
For example, should I make a view in code or should I drag it to my storyboard?
Should I set its size and position programmatically or graphically?
Which one is actually used in projects?
Specially considering the new Auto Layout and Size Classes feature in Xcode6

For auto layout and layout constraints it is best you use graphical tools because it is definitely future proof. You can do the same thing with code but it takes a whole lot of time to do things when compared to the graphical way of doing it. At the end of the day it all comes to the developer's comfort zone and the app's requirements.
A Small Point About Universal Apps:
Universal app building is very comfortable when you choose graphical storyboarding and have separate stuff for iPhone and iPad (also there are bigger screen iPhones and iPads coming). If you choose to do all the UI stuff with code for an universal app you would end up writing a lot of if-else statements, like below
if ([[UIDevice currentDevice] userInterfaceIdiom] == UIUserInterfaceIdiomPhone) {
//Do iPhone stuff.
} else {
//Do iPad stuff.
}
Help from Interface Builder for Autolayouting
The easiest way to add, edit, or remove constraints is to use the
visual layout tools in Interface Builder. Creating a constraint is as
simple as Control-dragging between two views, or to add multiple
constraints at once, you simply use the various pop-up windows.
Quote from -https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/AutolayoutPG/WorkingwithConstraints/WorkingwithConstraints.html
You always have tools to save you even when you have messed up a lot with the constraints.
Some real good stuff,
http://carpeaqua.com/2014/05/09/why-you-should-use-interface-builder-with-auto-layout/
http://www.raywenderlich.com/51992/storyboards-vs-nibs-vs-code-the-great-debate

If you're looking into iOS development as a bit of a hobby then I'd recommend sticking to the graphical tools. These are faster to learn and will let you build your app in a shorter time if you are just beginning.
If you want to work on a large project in a professional environment or in a large team, then a 100% code project is usually desired.
If you pull apart some of the largest apps on the AppStore from huge companies, you'll see they don't use interface builder (IB) files. Take a look at Facebook, Spotify, Dropbox etc etc.
Some reasons include (but not limited to):
Ease of flow: A complicated app UI in interface builder can seem like a blackbox sometimes, whereas code is usually easier to follow
Simpler merging: If you have multiple developers working on the same UI file, merges can be a nightmare and more difficult compared to a source file
Finding problems: If a problem exists in a pure code project then the problem is right there in the code. Locating problems in an IB file can be tough, depending on how buried it is. Also Xcode's 'find' tool doesn't search through IB files
Code runs faster: You probably wont notice the speed but it is an advantage
Some boast the speed of coding using the graphical tools, and it's true that initially it will take you much longer than the code you're not yet familiar with. If you stick with it then you'll be able to write apps just as fast.

Related

Is it a bad thing to create views programmatically? [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 7 years ago.
Improve this question
So I'm new to iOS development and I found it easier to write the views all programmatically. So my views have UIViews, ScrollViews, UIButton, UILabel all created and positioned programmatically. (So I never used AutoLayouts).
I've now pretty much finished my app and want to make the iPad views, and realized maybe it was a bad idea to do it like this.
Is this bad practice or should I really be using auto layouts as much as I can?
If it's ok to do it how I'm doing it right now, what is the correct way to add different views for iOS and iPad? I've seen this answer below on how to find the device, is a simple if else statement sufficient? - iOS: How to determine the current iPhone/device model in Swift?
I am using programatic views in a live app and its awesome. A bunch of people I know us this as well.
Here is a little algorithm I use to choose between the two methods:
Are you building a fast app for a client or a hobby? Use storyboard with autolayout.
Are you building an open source project that will be used by many people? Use programatic UI
Are you building an app for the long run? (1+ year) Use programatic UI
Its also harder to make an app thats supposed to be rotated without autolayout. Because doing that with code takes much more work than autolayout. Most good apps dont use this feature anyways so I don't see much problem.
A good tip is never to use constants while writing programatic UI.
If you are going to make a button thats 100px in width, do not type in 100px anywhere in the code. Instead figure out the screen sizes and place the main views according to screen sizes. Then place the subviews or secondary views according to the position of the main views. If you do this correctly you will have more powerful multidevice layout support than autolayout.
Here is a little library I wrote, please inspect and play with the code on how I place the view: https://github.com/goktugyil/CozyLoadingActivity/blob/master/CozyLoadingActivity.swift
Also here is a good article I like about this:
http://www.toptal.com/ios/ios-user-interfaces-storyboards-vs-nibs-vs-custom-code
This is only fine, If you have enough time, patience, good skill on calculations and relationship configurations between different UI elements.
However, using Auto Layout is pretty useful and low time consuming than manual calculations.
We can easily create a dynamic and versatile interface that responds appropriately to changes in screen size, device orientation, and localization with minimal effort.
Read Adopting Auto Layout,to implement the Auto Layout in your existing application
TL;DR
It depends
Longer version
Clearly one size does not fit all. AutoLayout is pretty powerful both in Interface Builder and code (be it visual language format, or simple constraint setting), but sometimes it just seems like you're "rubbing your right ear with your left hand" - that's when adding views programmatically comes in. But beware of not having it different in each view controller - you don't want to introduce too much complexity in your project, right?
I personally like using AutoLayout as much as I can and whenever I can't use it anymore, or the StoryBoard View would get too messed up with millions of constraints, I try to separate views into containers - have the container be resized by AutoLayout and have the subviews handled by code.
Example would be a custom Media Player - maybe I want to have two stripes below and above the video - I could have the video and two UIView extended stripes handled by the AutoLayout. But the subviews (controls) in the stripes themselves would be added by code. It gives me the control over my code but still it doesn't introduce too much complexity.
First of all - if you want to develop for iOS you have to learn Autolayout. There are already a lot of different devices with different resolutions and maybe will be even more in future.
Secondary - if you want to work effectively with IB you have to read guide / watch tutorial videos and have some practice. It could be difficult to start but then you will realize that IB is powerful, fast and often the best way to develop GUI. Often, but not always!
Code advantages:
Easy to copy-paste and reuse GUI. It could be critical if you have
several similar views or want to reuse some old code.
Easy to resolve merge conflicts and check commits.
Easier to make styles - like the same font for all labels depending on the country.
More powerful (there are things that could not be done with IB) so you have to use it sometimes.
IB advantages:
You can see your GUI during development for different resolutions/localizations so you do not have to compile and run a project on different devices/simulators to check is GUI ok or not. Also IB will show you warnings if you forget some Autolayout constraints or there are conflicts. Saves a lot of time if you have a complex GUI with non-trivial Autolayout constraints.
It is much easier to understand someones else code if it is developed in IB. Especially important for complex GUI - not so easy to find a required label or button in a few hundreds lines of code.
Small bonus - if you want to use a custom control developed via code you can make it IBInspectable and use it without problems in IB
Just to summarize - if you do not need IB benefits (for example GUI is quite simple and does not use Autolayout) developing GUI via code could be easier and faster. But in case you have to support different resolutions and/or you have hundreds lines of GUI code in each view controller I strongly recommend to try IB.

iOS - UI design in coding and not in XIB or Storyboard is Feasible or not?

My doubt is very simple.
I want to develop one big iOS (iPhone) app of say 30 screens.
One my friend advice me to develop whole UI in coding only and do not use XIB's or storyboard.
I want to ask that, is it feasible for me to develop whole UI in coding instead using XIB and story board?
Will that affect my iOS app processing?
Will that affect my iOS app execution speed or not?
Please suggest me the proper way weather I use XIB and Storyboard of develop UI by Coding only ..... !!!!
Thank you.
Firstly, tell your friend not to give you advices again.(Just kidding! :)) You can develop the whole app programmatically but it's just a pain in the gut. Apple introduced the storyboards to ease the waste of having multiple xib files in your product.
For my personal opinion, use xibs in case of having lots of teammates working with you because of the pain of conflicts. If you're working solo, then storyboards would be the best fit.
Yes, there is no silver bullet that will solve all of your problems, every project is specific and your ability on predicting project requirements will enable you to decide. Here are some pros and cons of both approaches to help in making a decisions:
Storyboards/XIB pros: Very visual, Beginner friendly, Easy autolayout, MVC separation is straightforward on view side
Storyboards/XIB cons: SCM conflict are almost always unresolvable, not all parameters are configurable from IB so you still need to know how to do some stuff in code
Pure Code approach pros: Full control over entire presentation in code, conflicts resolvable easy as it can get
Pure Code approach cons: Might need more experience to master
My judgment would be:
Using storyboards/XIB is better solution for small to medium projects that consist of basic/stock UI elements.
Introducing visually complex solutions and non standard transitions will require that you start writing layout code more and more and stuff becomes easier without XIBs in your way.
From my experience if you are part of the bigger dev team, Storyboards and XIBs are a big NO..
I prefer not using IB at all even for smaller projects as pressing CMD+R after writing bunch of code, and seeing it come alive is very pleasing.. :-)
To answer your question literally: yes, you can make an app without any storyboards or xibs. I think with iPhone 6/6+ you have to have at least one because they check it to see if you support the bigger screens, but that's it.
In fact, my first app in 2013 had almost no Xib UI design. It was iPhone portrait only, I coded with frames and was happy with the precise results I got-- I also think I learned a lot. I think with Auto Layout, especially if you learned Visual Format Language (albeit that's not a easy thing to do) creating a robust interface entirely in code is doable.
That said, not using interface builder is not doing things "the Apple way." And not doing things the Apple way is usually -- not always, but usually -- going to be more difficult. On one level, WWDC videos, guides and sample code all assume you are using IB. Creating every label, subview and view controller in code is going to take several more lines, each, than using xibs or storyboard. You will be swimming against the current.
It's worth noting IB can be immensely frustrating at times. But generally it's worth it, and you learning how to relate it to the code is learning iOS programming. Also about IB , the files it generates are just XML files, it won't have any significant effect on size or performance- I'd be wary of advice from someone who told you that.
An all-code app is doable and would be a challenging way to learn, but this is not advice I would give anyone or second.

Monotouch, Monotouch.Dialog, the iPad and customization

I'm in the process of developing an iPad-only survey-app using MonoTouch. With monotouch.dialog (mt.d) I found that building these interfaces can come quickly, which is awesome.
However... I also found that mt.d only does about 80% of what I want. Makes me wonder: should I invest in extending mt.d to my needs or should I choose something differently over mt.d?
Some of my requirements:
Radiogroups without transitions: I like the options to be
presented right away (there's more than enough space on the iPad
screen)
A rating UI control, such as
http://www.cocoacontrols.com/platforms/ios/controls/dyrateview
Mixed radiogroups: like 3 predefined elements and a fourth which
allows for manually added content
What are your thoughts on this? Can this be done easily (I'm a trained programmer, but quite new to both C# and iOS development)? Do you guys know of any online repositories of custom UI components with C#/MonoTouch bindings?
Thanks a lot!
This is of course a subjective opinion, but my take on it is that if you believe you can do your UI in UITableView (which MonoTouch.Dialog is based on), then you should go for MonoTouch.Dialog. If UITableView will not fit your needs, you should look for a different approach. MonoTouch.Dialog is quite flexible, and open-source, so if you need anything to be different you can just use the source code and modify it at will.

How do i design an iOS universal application for differing 'view' schemes?

I'm working on building a universal iOS configuration application for the iPhone/iPad. But the layouts ('views') for the iPad are considerably different from that of the iPhone. Considering that only the appearance of the application ('views') change w.r.t the device, what is the most efficient design approach i could follow?
Things I've already looked at
I've looked at one strategy where different View controllers are loaded depending on the device in use. But this might be an overkill considering that the 'controls' are the same across devices and only the appearance of the application changes.
The use of functions to resize the view frames to layout views as needed automatically. This does not help me much because there is a need to not only change the size of the views but load different views altogether depending on the device.
To keep the viewController unchanged but configure the views inside the viewController differently. Right now this seems like the best way to do it, but the application is kinda heavy and it might become very messy in the long run. Or is there a very efficient way to do this?
Is there a design strategy for this?
Or is there any way i can accomplish this efficiently while optimizing effort?
The standard approach is to have different XIB files for iPhone and iPad, which the platform will select automatically if you name them right, e.g. myview~iPhone.xib and myview~iPad.xib.
You are concerned about inefficiency: I wouldn't worry about the file size as compiled XIB is quite compact.
In my apps I mostly use this approach, with some fragments of code to add or remove buttons for each platform. Simple views can just be set up to resize automatically using the standard struts-and-glue techniques.

Best practices for iOS / monotouch programmatic UI layout

New to iOS, coming from the Java / Swing world, where I'm used to creating UIs programmatically, letting components size themselves and using various clever layout managers to arrange things.
It already seems clear that the iOS way is to make heavy use of Interface Builder, with a lot of fixed sizing and positioning. I'm not sure IB is ever going to come naturally, but I guess fixed layouts make sense given that you're working with limited space and a fixed window size.
It still seems like I'm writing a lot of boilerplate, though, and violating DRY, and so on.
Can somebody point me to a good primer on laying out iOS UIs, particularly programmatic UIs?
You don't really need to use IB to write MonoTouch apps. I almost never do. The CocoaTouch API is fairly simple and straightforward to develop on.
I haven't really found any writeup on UI development other than the apple documentation (which is really good, by the way, worthy reading), so here goes a couple of tips, based on my experience:
Inheritance is key to maintaining the code clean. You can inherit from basically any class in the API, like buttons, controllers, views, etc. Inherit and add your customizations in those classes. Don't shove everything in the AppDelegate like many examples show. You'll thank me later on.
Have I mentioned inheritance already?
The one thing iOS doesn't have is a layout manager, so if you're used to Java like you mentioned, this will sound a little strange. Different from what Java people think, this is not a big deal. UITableViews help tremendously with this (vide next point).
A lot of iphone apps are built on top of the UITableViewController, even apps that don't look like tables. It's a great framework to do anything related to scrolling. Learn to use it well. Almost anything that scrolls vertically is a UITVC. Follow the guidelines that define when you create and when you dispose cells and objects.
Be careful every time you add a Frame location in your control. Instead of setting hardcoded values, try using offsets from other locations (x+40, for example) whenever possible.
Make sure you add your views to the proper container as necessary. For example, if you're adding a global "Loading" view, add it to the Window object, while if you're adding a image on the left side of a table cell, use the ContentView. iOS changes those special views automatically all the time (resizing screen to fit "on call" bar at top, or rotating phone).
Miguel de Icaza has created a great framework for managing forms and tables, called MonoTouch Dialog. Take a look, and enjoy.

Resources