One of the most basic steps you have to take when developing an Android Application is the design and the specifications of the main Activity (and any activity) of your App. Android API gives all the basic tools to make that action fairly easy. The basic layout of an Activity is described in a Layout XML file. In this XML file we can specify and customize the basic UI components like Buttons, EditText components, Icons etc… While programming your Android App you will notice that you keep using the same Strings or the same values for certain parameters throughout the Application.
In order to better organize your resources that you are going to use, you can create an Resource XML file, like res/values/strings.xml to create string resources for instance, that you can use in many places an in many ways in your Application. Then, you have to tell your Activity to use the layout XML file you’ve created as its Layout description. Finally you can further customize your UI by creating several Event Listeners to capture an handle several UI Events.
In short, to create a basic UI for your applications you have to:
- Create an XML layout file. Most of the times the creation of a new Activity is followed by the automatic creation of a new layout file
- Specify the resources you want. In out case we create several String resources in
res/values/strings.xmlfile - Use
setContentViewto tell your Activity to use your Layout XML file as its Layout description - Create event Listeners in your Activity to handle UI Events
package com.javacodegeeks.android.apps.moviesearchapp;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.View.OnFocusChangeListener;
import android.widget.Button;
import android.widget.EditText;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import android.widget.TextView;
import android.widget.Toast;
public class MovieSearchAppActivity extends Activity {
private static final String EMPTY_STRING = "";
private EditText searchEditText;
private RadioButton moviesSearchRadioButton;
private RadioButton peopleSearchRadioButton;
private RadioGroup searchRadioGroup;
private TextView searchTypeTextView;
private Button searchButton;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
this.findAllViewsById();
moviesSearchRadioButton.setOnClickListener(radioButtonListener);
peopleSearchRadioButton.setOnClickListener(radioButtonListener);
searchButton.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
String query = searchEditText.getText().toString();
if (moviesSearchRadioButton.isChecked()) {
longToast(moviesSearchRadioButton.getText() + " " + query);
}
else if (peopleSearchRadioButton.isChecked()) {
longToast(peopleSearchRadioButton.getText() + " " + query);
}
}
});
searchEditText.setOnFocusChangeListener(new DftTextOnFocusListener(getString(R.string.search)));
int id = searchRadioGroup.getCheckedRadioButtonId();
RadioButton radioButton = (RadioButton) findViewById(id);
searchTypeTextView.setText(radioButton.getText());
}
private void findAllViewsById() {
searchEditText = (EditText) findViewById(R.id.search_edit_text);
moviesSearchRadioButton = (RadioButton) findViewById(R.id.movie_search_radio_button);
peopleSearchRadioButton = (RadioButton) findViewById(R.id.people_search_radio_button);
searchRadioGroup = (RadioGroup) findViewById(R.id.search_radio_group);
searchTypeTextView = (TextView) findViewById(R.id.search_type_text_view);
searchButton = (Button) findViewById(R.id.search_button);
}
public void longToast(CharSequence message) {
Toast.makeText(this, message, Toast.LENGTH_LONG).show();
}
private OnClickListener radioButtonListener = new OnClickListener() {
public void onClick(View v) {
RadioButton radioButton = (RadioButton) v;
searchTypeTextView.setText(radioButton.getText());
}
};
private class DftTextOnFocusListener implements OnFocusChangeListener {
private String defaultText;
public DftTextOnFocusListener(String defaultText) {
this.defaultText = defaultText;
}
public void onFocusChange(View v, boolean hasFocus) {
if (v instanceof EditText) {
EditText focusedEditText = (EditText) v;
// handle obtaining focus
if (hasFocus) {
if (focusedEditText.getText().toString().equals(defaultText)) {
focusedEditText.setText(EMPTY_STRING);
}
}
// handle losing focus
else {
if (focusedEditText.getText().toString().equals(EMPTY_STRING)) {
focusedEditText.setText(defaultText);
}
}
}
}
}
}<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<EditText android:id="@+id/search_edit_text"
android:text="@string/search"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
<RadioGroup
android:id="@+id/search_radio_group"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<RadioButton
android:id="@+id/movie_search_radio_button"
android:checked="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/movies" />
<RadioButton
android:id="@+id/people_search_radio_button"
android:checked="false"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/people" />
</RadioGroup>
<TextView
android:id="@+id/search_type_text_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#ffffff"
/>
<Button
android:id="@+id/search_button"
android:text="@string/search"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout><?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="hello">Hello World, MovieSearchAppActivity!</string>
<string name="app_name">MovieSearchApp</string>
<string name="search">Search</string>
<string name="movies">Movies</string>
<string name="people">People</string>
</resources>
This was an Example on how to Create a basic User Interface for your Android Activities.
Related Article:
