Layout Tricks: Creating Reusable UI Components

The Android platform offers a wide variety of UI widgets, small visual construction blocks that you can glue together to present users with complex and useful interfaces. However applications often need higher-level visual components. To meet that need, and to do so efficiently, you can combine multiple standard widgets into a single, reusable component.

For example, you could create a reusable component that contains a progress bar and a cancel button, a panel containing two buttons (positive and negative actions), a panel with an icon, a title and a description, and so on. You can create UI components easily by writing a custom View, but you can do it even more easily using only XML.

In Android XML layout files, each tag is mapped to an actual class instance (the class is always a subclass of View, The UI toolkit lets you also use three special tags that are not mapped to a View instance: <requestFocus />, <merge /> and <include />. This article shows how to use <include /> to create pure XML visual components.

The <include /> element does exactly what its name suggests; it includes another XML layout. Using this tag is straightforward as shown in the following example:


<com.android.launcher.Workspace
android:id="@+id/workspace"
android:layout_width="fill_parent"
android:layout_height="fill_parent"

launcher:defaultScreen="1">

<include android:id="@+id/cell1" layout="@layout/workspace_screen" />
<include android:id="@+id/cell2" layout="@layout/workspace_screen" />
<include android:id="@+id/cell3" layout="@layout/workspace_screen" />

</com.android.launcher.Workspace>


In the <include /> only the layout attribute is required. This attribute, without the android namespace prefix, is a reference to the layout file you wish to include. In this example, the same layout is included three times in a row. This tag also lets you override a few attributes of the included layout. The above example shows that you can use android:id to specify the id of the root view of the included layout; it will also override the id of the included layout if one is defined. Similarly, you can override all the layout parameters. This means that any android:layout_* attribute can be used with the <include /> tag. Here is an example:



<include android:layout_width="fill_parent" layout="@layout/image_holder" />
<include android:layout_width="256dip" layout="@layout/image_holder" />



Getting started with Android Development using Eclipse

The Google Android platform offers a easy and quick way to develop applications for the mobile device. First of all, lets start with the tools we will need to start developing our own Android applications.

The best IDE (Integrated development environment) t to develop Android is Eclipse.



The Android SDK

We will need another tool to work with Android. This tool is called the SDK (Software Development Kit), we have download it from here and place in somewhere handy on your computer (C:/Android/SDK if we are on Windows, for example, or ./home/YOURUSERNAME/Android/SDK if we use a *nix system).

It doesn't really matter where you put it, just don't forget where, because in next steps we will have to enter the path to the SDK into the Eclipse environment.


Eclipse

Once we have downloaded the SDK we will need the Android plugin for Eclipse. There are a couple of different ways of doing this, depending of the version of Eclipse you are using:

For Eclipse Ganymede :

* Start Eclipse.
* In the Menu, select "Help" and then "Software Updates".
* In the new pop-up window, push the button "Add site ... " and enter the following address and click Ok:

https://dl-ssl.google.com/android/eclipse/

*
* Once this is done, you have to go back to the Updates and Add ons menu. The location we have entered before should appear, click on it, check the "Developer Tools" and click Install.
* Follow the steps to install the plugin.

For Eclipse Europa version

* Start Eclipse
* In the Menu, select "Help" , "Software Updates" and then "Find and Install".
* Click on New Remote Site
* In the new pop-up window, paste 'https://dl-ssl.google.com/android/eclipse/', and click Ok:

* One this is done, the new site should appear in the Add ons list. Click on it and check both “Android Developer Tools” and “Android Editor”.
* Follow the steps to install the plugin.

Hint: If the https://dl-ssl.google.com/android/eclipse/ doest work try "http" instead of "https".

Once we have installed the Eclipse plugin we have to restart the IDE. Now, its time to point to the plugin where the SDK is in our system.

In the Menu, “Window”, select “Preferences”. Select Android from the left panel, click the “Browse” button and locate the SDK directory in your computer, then click OK.

Now we are able to create Android applications on our Eclipse IDE.

How to Install .Apk Apps on you Google Android Phones

1. Install and open the Apps Installer application from the "Android Market".

2. This opens a view showing *.apk application names in the sdcard root directory.(note, if no AppNames are listed you have no .apk files in the root directory of the SDCard)

3. Touch the app name to initiate installation of the app.

4. The app is now installed

How to Non-Market .Apk Application on your Google Android Phones

1. Download and install Google Android SDK. The tool you need is adb.exe.

2. Now type adb in a command shell will display all the options, adb.exe is SDK tool used to install applications and interface with the device.

3. Now Connect Your Android Phone to your computer using USB cable. You need to install Drivers for this. Download Android USB drivers from here. This driver is required for adb to interface with an android phone using USB cable.

4. Go to Android Settings/SD card & phone storage and disable Use for USB storage. You can enable it again later after you installed your third-party application.

5. Go to Settings/Application settings and enable Unknown sources.

6. Connect the G1 to your computer using the USB cable and install the driver you downloaded in step 3. After installing the driver you should see ADB Inteface in Windows Device Manager.

7. If you made it this far, download the APK file to a local folder on your computer, something like C:\MyAPKs will work fine and install it using ADB. The command would be adb install c:\myapks\ and that’s about it.

Anyway, the apk files refers to the Android Package files; and there are numbers of freeware you can try.

The difference between @+id and @android:id

Sometimes you see references in your layout files like:

<listview id="@+id/android:list">

and

<listview id="@android:id/list">

What's the difference?
.. I'm glad you asked ☺

@+id/foo means you are creating an id named foo in the namespace of your application.
You can refer to it using @id/foo.
@android:id/foo means you are referring to an id defined in the android namespace.

The '+' means to create the symbol if it doesn't already exist. You don't need it (and shouldn't use it) when referencing android: symbols, because those are already defined for you by the platform and you can't make your own in that namespace anyway.

This namespace is the namespace of the framework.
for example, you need to use @android:id/list because this the id the framework expects to find.. (the framework knows only about the ids in the android namespace.)

Android Activities

An activity presents a visual user interface for one focused endeavor the user can undertake.

For example, an activity might present a list of menu items users can choose from or it might display photographs along with their captions. A text messaging application might have one activity that shows a list of contacts to send messages to, a second activity to write the message to the chosen contact, and other activities to review old messages or change settings.

Though they work together to form a cohesive user interface, each activity is independent of the others. Each one is implemented as a subclass of the Activity base class.

An application might consist of just one activity or, like the text messaging application just mentioned, it may contain several. What the activities are, and how many there are depends, of course, on the application and its design.

Typically, one of the activities is marked as the first one that should be presented to the user when the application is launched. Moving from one activity to another is accomplished by having the current activity start the next one.

Each activity is given a default window to draw in. Typically, the window fills the screen, but it might be smaller than the screen and float on top of other windows.

An activity can also make use of additional windows — for example, a pop-up dialog that calls for a user response in the midst of the activity, or a window that presents users with vital information when they select a particular item on-screen.

The visual content of the window is provided by a hierarchy of views — objects derived from the base View class. Each view controls a particular rectangular space within the window. Parent views contain and organize the layout of their children. Leaf views (those at the bottom of the hierarchy) draw in the rectangles they control and respond to user actions directed at that space. Views are, therefore, where the activity's interaction with the user takes place.

For example, a view might display a small image and initiate an action when the user taps that image. Android has a number of ready-made views that you can use — including buttons, text fields, scroll bars, menu items, check boxes, and more.

A view hierarchy is placed within an activity's window by the Activity.setContentView() method. The content view is the View object at the root of the hierarchy.