Professional Documents
Culture Documents
Interface Design
Activity 2A:
1. Select File > New > Android Application Project
2. Next a dialog box Application Name is appearing. Set the value as below
3. Click Next
7. Open activity_hello.xml file (located in the res/layout folder). Modify the code as below
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/
android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="com.example.helloactivity.HelloActivity" >
<TextView
android:id="@+id/textViewDisplay"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="23dp"
android:layout_marginTop="30dp"
android:text="Name: " />
<Button
android:id="@+id/buttonDisplay"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/textViewDisplay"
android:layout_marginTop="44dp"
android:layout_toRightOf="@+id/textViewDisplay"
android:text="Display" />
<EditText
android:id="@+id/editTextName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignTop="@+id/textViewDisplay"
android:ems="10" />
</RelativeLayout>
8. The output should be as follow (Click the Graphical Layout tab to view the output)
Id: textViewDisplay
Id: editTextName
Id: btnDisplay
9. Open the HelloActivity.java file and modify the code as below
package com.example.helloactivity;
import
import
import
import
import
import
import
android.app.Activity;
android.os.Bundle;
android.view.View;
android.view.View.OnClickListener;
android.widget.Button;
android.widget.EditText;
android.widget.TextView;
Activity 2B:
Use Button, EditText, CheckBox, ToggleButton, RadioButton, and RadioGroup Views.
1. Select File > New > Android Application Project
2. Next a dialog box Application Name is appearing. Set the value as below
3. Click Next
7. Open main.xml file (located in the res/layout folder). Modify the code as below
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/
android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="com.example.basicview.BasicView" >
<Button
android:id="@+id/btnSave"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginTop="15dp"
android:text="Save" />
<RadioGroup
android:id="@+id/rdbGp1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="@+id/btnSave"
android:layout_below="@+id/btnSave"
android:layout_marginLeft="18dp"
android:layout_marginTop="18dp" >
<RadioButton
android:id="@+id/rdb1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:checked="true"
android:text="Male" />
<RadioButton
android:id="@+id/rdb2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Female" />
</RadioGroup>
<CheckBox
android:id="@+id/chkAutoSave"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="@+id/rdbGp1"
android:layout_below="@+id/rdbGp1"
android:layout_marginTop="36dp"
android:text="Auto save" />
<ToggleButton
android:id="@+id/toggle1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignRight="@+id/chkAutoSave"
android:layout_below="@+id/chkAutoSave"
android:layout_marginTop="17dp"
android:text="ToggleButton" />
</RelativeLayout>
8. The output should be as follow (Click the Graphical Layout tab to view the output)
android.app.Activity;
android.os.Bundle;
android.view.View;
android.widget.Button;
android.widget.CheckBox;
android.widget.RadioButton;
android.widget.RadioGroup;
10
import android.widget.RadioGroup.OnCheckedChangeListener;
import android.widget.Toast;
import android.widget.ToggleButton;
public class BasicView extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
// ---Button view--Button btnSave = (Button) findViewById(R.id.btnSave);
btnSave.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
DisplayToast("You have clicked the Save
button");
}
});
// ---RadioButton--RadioGroup radioGroup = (RadioGroup)
findViewById(R.id.rdbGp1);
radioGroup.setOnCheckedChangeListener(new
OnCheckedChangeListener() {
public void onCheckedChanged(RadioGroup group, int
checkedId) {
RadioButton rb1 = (RadioButton)
findViewById(R.id.rdb1);
if (rb1.isChecked()) {
DisplayToast("Male checked!");
} else {
DisplayToast("Female checked!");
}
}
});
// ---CheckBox--CheckBox checkBox = (CheckBox)
findViewById(R.id.chkAutoSave);
checkBox.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
if (((CheckBox) v).isChecked())
DisplayToast("CheckBox is checked");
else
DisplayToast("CheckBox is unchecked");
}
});
// ---ToggleButton--ToggleButton toggleButton = (ToggleButton)
findViewById(R.id.toggle1);
toggleButton.setOnClickListener(new
View.OnClickListener() {
public void onClick(View v) {
if (((ToggleButton) v).isChecked())
DisplayToast("Toggle button is On");
else
DisplayToast("Toggle button is Off");
11
}
});
}// end onCreate
private void DisplayToast(String msg) {
Toast.makeText(getBaseContext(), msg,
Toast.LENGTH_SHORT).show();
}
}
12