Here i'd like to note useful ideas, links i referenced during my my month of self learning Android application development. Hope it is helpful to others as well.
User Interface (UI) in Android
User Interface (UI) in Android
An app's user interface is everything that the user can see and interact with. The response to user input is designed to be immediate and provides a fluid touch interface, often using the vibration capabilities of the device to provide haptic feedback to the user.
To design a good user interface we must:
· Focus on the user
o Know the users
o Age, skill level, culture
o What they want to do with the app
o What kinds of devices they’ll be using
o When, where, how they’ll be using the devices
· Design with a user first mentality
o Users are generally task driven
o Test on real users, early and often
· Make the right things visible
o The most common operation should be immediately visible and available
o Secondary functionality should be reserved for the menu button
· Show proper feedback
o Have at least four states(<selector>) for all interactive UI elements
o Make sure the effects of the action are clear and visible
o Show adequate yet unobtrusive progress indicators
· Be predictable
o Do what the user expects
o Properly interact with the activity stack
o Show information and action user wants to see
o Use proper affordances
o If something is clickable, make sure it looks clickable
· Be fault-tolerant
o Constraint possible operations to only those that make sense
o limit the number of irreversible actions
o Prefer undo to confirmation dialoguesThe basic unit of an Android application is an Activity. An Activity displays the user interface of the application, which may contain widgets like buttons, labels, text boxes, etc. Typically, we define the UI using an XML file (for example, the main.xml file located in the res/layout folder).
An Activity contains Views and ViewGroups. A View is a widget that has an appearance on screen. Examples of widgets are buttons, labels, text boxes, etc.
One or more Views can be grouped together into a ViewGroup. A ViewGroup (which is by itself is a special type of View) provides the layout in which you can order the appearance and sequence of views. Android supports the following ViewGroups:
· LinearLayout
o The LinearLayout arranges views in a single column or single row. Child views can either be arranged vertically or horizontally.
· AbsoluteLayout
o The AbsoluteLayout lets to specify the exact location of its children.
· TableLayout
o The TableLayout groups views into rows and columns. We use the <TableRow> element to designate a row in the table. Each row can contain one or more views. Each view you place within a row forms a cell. The width for each column is determined by the largest width of each cell in that column.
· RelativeLayout
o The RelativeLayout lets us specify how child views are positioned relative to each other.
· FrameLayout
o The FrameLayout is a placeholder on screen that we can use to display a single view. Views that is added to a FrameLayout is always anchored to the top left of the layout.
· ScrollView
o A ScrollView is a special type of FrameLayout in that it allows users to scroll through a list of views that occupy more space than the physical display.
Android UI Design Patterns
Like a software design pattern, a UI design pattern describes a general solution to a recurring problem. Patterns emerge as a natural by-product of the design process. The design patterns include:
Dashboard
A quick intro to an app, revealing capabilities and proactively highlighting new content. It is the organized way of display to arrange the functionalities of the app. It highlights what’s new and focuses on 3-8 most important choices. It should be flavorful as it is the first impression of the app.
Action Bar
It is a dedicated real estate at top of the screen to support navigation and frequently used operations. It can provide a quick link to dashboard (or other app home). It is used to bring key actions onscreen and helps to convey a sense of place. It is used consistently within the app.
It is a dedicated real estate at top of the screen to support navigation and frequently used operations. It can provide a quick link to dashboard (or other app home). It is used to bring key actions onscreen and helps to convey a sense of place. It is used consistently within the app.
Search Bar
It is a consistent pop-in search form anchored to top of the screen. It can replace action bar (if present). It is used for simple searches which provides rich suggestions.
It is an action popup triggered from distinct visual target. It is minimally disruptive to screen context. Actions are straightforward, fast and fun. It is used when items have competing internal targets. It is present for most important and obvious actions.
ListView
A Simple ListView is a view group that displays a list of scrollable items. The list items are automatically inserted to the list using an Adapter that pulls content from a source such as an array or database query and converts each item result into a view that's placed into the list.
In a custom listview, we will create custom ListView where each row item consists of the views we want, and populate its items using custom ArrayAdapter. The Adapter defines how each row is displayed (i.e the layout for each row. We will define layout for rows in ListView in a XML file and place it in res/layout. The adapter provides data to each row in ListView.
We can customize our ListView with image that is not defined in the resource folder in android by loading images from the internet.
It's a time-consume task to load bitmap from internet. Whenever we need to perform lengthy operation or any background operation we can use Asynctask which executes a task in background and publish results on the UI thread without having to manipulate threads and/or handlers. In onCreate(), we create and execute the task to load image from url. The task’s execute method invokes doInBackground() where we open a Http URL connection and create a Bitmap from InputStream and return it. Once the background computation finishes, onPostExecute() is invoked on the UI thread which sets the Bitmap on ImageView. The image should be cached in the phone in case we want to reuse it later. If the number of items to be downloaded exceeds a certain threshold(meaning more fetches and memory) we should consider reducing the fetches and also the Runtime memory consumption by caching them. We can choose to save them on Sdcard.
It's a time-consume task to load bitmap from internet. Whenever we need to perform lengthy operation or any background operation we can use Asynctask which executes a task in background and publish results on the UI thread without having to manipulate threads and/or handlers. In onCreate(), we create and execute the task to load image from url. The task’s execute method invokes doInBackground() where we open a Http URL connection and create a Bitmap from InputStream and return it. Once the background computation finishes, onPostExecute() is invoked on the UI thread which sets the Bitmap on ImageView. The image should be cached in the phone in case we want to reuse it later. If the number of items to be downloaded exceeds a certain threshold(meaning more fetches and memory) we should consider reducing the fetches and also the Runtime memory consumption by caching them. We can choose to save them on Sdcard.
- http://javatechig.com/android/pass-a-data-from-one-activity-to-another-in-android
- http://theopentutorials.com/tutorials/android/imageview/android-how-to-load-image-from-url-in-imageview/
- http://www.javacodegeeks.com/2012/10/android-listview-example-with-image-and.html
- http://java.dzone.com/articles/android-listview-optimizations-0
- http://androidexample.com/Download_Images_From_Web_And_Lazy_Load_In_ListView_-_Android_Example/index.php?view=article_discription&aid=112&aaid=134
