Android Widgets
Android Widgets
There are given a lot of android widgets with simplified examples such as Button,
EditText, AutoCompleteTextView, ToggleButton, DatePicker, TimePicker, ProgressBar etc.
Android widgets are easy to learn. The widely used android widgets with examples are given
below:
Android Button
Android Toast
Custom Toast
We are able to customize the toast, such as we can display image on the toast
ToggleButton
CheckBox
AlertDialog
AlertDialog displays a alert dialog containing the message with OK and Cancel buttons.
Spinner
Spinner displays the multiple options, but only one can be selected at a time.
AutoCompleteTextView
RatingBar
RatingBar displays the rating bar.
DatePicker
Datepicker displays the datepicker dialog that can be used to pick the date.
TimePicker
TimePicker displays the timepicker dialog that can be used to pick the time.
ProgressBar
Here, we are going to create two textfields and one button for sum of two numbers. If user
clicks button, sum of two input values is displayed on the Toast.
Drag the component or write the code for UI in activity_main.xml
First of all, drag 2 textfields from the Text Fields palette and one button from the Form
Widgets palette as shown in the following figure.
File: activity_main.xml
1. <RelativeLayout xmlns:androclass="http://schemas.android.com/apk/res/android"
2. xmlns:tools="http://schemas.android.com/tools"
3. android:layout_width="match_parent"
4. android:layout_height="match_parent"
5. tools:context=".MainActivity" >
6.
7. <EditText
8. android:id="@+id/editText1"
9. android:layout_width="wrap_content"
10. android:layout_height="wrap_content"
11. android:layout_alignParentTop="true"
12. android:layout_centerHorizontal="true"
13. android:layout_marginTop="24dp"
14. android:ems="10" />
15.
16. <EditText
17. android:id="@+id/editText2"
18. android:layout_width="wrap_content"
19. android:layout_height="wrap_content"
20. android:layout_alignLeft="@+id/editText1"
21. android:layout_below="@+id/editText1"
22. android:layout_marginTop="34dp"
23. android:ems="10" >
24.
25. <requestFocus />
26. </EditText>
27.
28. <Button
29. android:id="@+id/button1"
30. android:layout_width="wrap_content"
31. android:layout_height="wrap_content"
32. android:layout_centerHorizontal="true"
33. android:layout_centerVertical="true"
34. android:text="@string/Button" />
35.
36. </RelativeLayout>
Activity class
Now write the code to display the sum of two numbers.
File: MainActivity.java
1. package com.example.sumof2numbers;
2.
3. import android.os.Bundle;
4. import android.app.Activity;
5. import android.view.Menu;
6. import android.view.View;
7. import android.view.View.OnClickListener;
8. import android.widget.Button;
9. import android.widget.EditText;
10. import android.widget.Toast;
11.
12. public class MainActivity extends Activity {
13. private EditText edittext1,edittext2;
14. private Button buttonSum;
15. @Override
16. protected void onCreate(Bundle savedInstanceState) {
17. super.onCreate(savedInstanceState);
18. setContentView(R.layout.activity_main);
19.
20. addListenerOnButton();
21.
22. }
23. public void addListenerOnButton(){
24. edittext1=(EditText)findViewById(R.id.editText1);
25. edittext2=(EditText)findViewById(R.id.editText2);
26. buttonSum=(Button)findViewById(R.id.button1);
27.
28. buttonSum.setOnClickListener(new OnClickListener(){
29.
30. @Override
31. public void onClick(View view) {
32. String value1=edittext1.getText().toString();
33. String value2=edittext2.getText().toString();
34. int a=Integer.parseInt(value1);
35. int b=Integer.parseInt(value2);
36. int sum=a+b;
37. Toa
st.makeText(getApplicationContext(),String.valueOf(sum),Toast.LENGTH_LONG).show();
38. }
39.
40. });
41.
42. }
43. @Override
44. public boolean onCreateOptionsMenu(Menu menu) {
45. // Inflate the menu; this adds items to the action bar if it is present.
46. getMenuInflater().inflate(R.menu.activity_main, menu);
47. return true;
48. }
49.
50. }
It is developed by adt bundle on android 4.2 using minimum sdk 8 and target sdk 16.
Output:
Android Toast Example
Andorid Toast can be used to display information for the short period of time. A toast
contains message to be displayed quickly and disappears after sometime.
You can also create custom toast as well for example toast displaying image. You can visit
next page to see the code for custom toast.
Toast class
Toast class is used to show notification for a particular interval of time. After sometime it
disappears. It doesn't block the user interaction.
Constant Description
public static final int LENGTH_LONG displays view for the long duration of time.
public static final int LENGTH_SHORT displays view for the short duration of time.
Method Description
public static Toast makeText(Context context, CharSequence makes the toast containing text a
text, int duration) duration.
public void setMargin (float horizontalMargin, float changes the horizontal and vertica
verticalMargin) difference.
File: MainActivity.java
1. package com.example.toast;
2. import android.os.Bundle;
3. import android.app.Activity;
4. import android.view.Menu;
5. import android.view.View;
6. import android.widget.Toast;
7.
8. public class MainActivity extends Activity {
9. @Override
10. public void onCreate(Bundle savedInstanceState) {
11. super.onCreate(savedInstanceState);
12. setContentView(R.layout.activity_main);
13.
14. //Displaying Toast with Hello Javatpoint message
15. Toast.makeText(getApplicationContext(),"Hello Javatpoint",Toast.LENGTH_SH
ORT).show();
16. }
17.
18. @Override
19. public boolean onCreateOptionsMenu(Menu menu) {
20. getMenuInflater().inflate(R.menu.activity_main, menu);
21. return true;
22. }
23.
24. }
Output:
activity_main.xml
Drag the component that you want to display on the main activity.
File: activity_main.xml
1. <RelativeLayout xmlns:androclass="http://schemas.android.com/apk/res/android"
2. xmlns:tools="http://schemas.android.com/tools"
3. android:layout_width="match_parent"
4. android:layout_height="match_parent"
5. tools:context=".MainActivity" >
6.
7. <TextView
8. android:layout_width="wrap_content"
9. android:layout_height="wrap_content"
10. android:layout_centerHorizontal="true"
11. android:layout_centerVertical="true"
12. android:text="@string/hello_world" />
13.
14. </RelativeLayout>
customtoast.xml
Create another xml file inside the layout directory. Here we are having ImageView and
TextView in this xml file.
File: customtoast.xml
Activity class
Now write the code to display the custom toast.
File: MainActivity.java
1. package com.example.customtoast2;
2. import android.os.Bundle;
3. import android.app.Activity;
4. import android.view.Gravity;
5. import android.view.LayoutInflater;
6. import android.view.Menu;
7. import android.view.View;
8. import android.view.ViewGroup;
9. import android.widget.Toast;
10.
11. public class MainActivity extends Activity {
12. @Override
13. public void onCreate(Bundle savedInstanceState) {
14. super.onCreate(savedInstanceState);
15. setContentView(R.layout.activity_main);
16.
17. //Creating the LayoutInflater instance
18. LayoutInflater li = getLayoutInflater();
19. //Getting the View object as defined in the customtoast.xml file
20. View layout = li.inflate(R.layout.customtoast,
21. (ViewGroup) findViewById(R.id.custom_toast_layout));
22.
23. //Creating the Toast object
24. Toast toast = new Toast(getApplicationContext());
25. toast.setDuration(Toast.LENGTH_SHORT);
26. toast.setGravity(Gravity.CENTER_VERTICAL, 0, 0);
27. toast.setView(layout);//setting the view of custom toast layout
28. toast.show();
29. }
30. @Override
31. public boolean onCreateOptionsMenu(Menu menu) {
32. getMenuInflater().inflate(R.menu.activity_main, menu);
33. return true;
34. }
35.
36. }
Android Toggle Button can be used to display checked/unchecked (On/Off) state on the
button.
It is beneficial if user have to change the setting between two states. It can be used to
On/Off Sound, Wifi, Bluetooth etc.
Since Android 4.0, there is another type of toggle button called switch that provides slider
control.
Android ToggleButton and Switch both are the subclasses of CompoundButton class.
Method Description
CharSequence getTextOff() Returns the text when button is not in the checked state.
CharSequence getTextOn() Returns the text for when button is in the checked state.
File: activity_main.xml
1. <RelativeLayout xmlns:androclass="http://schemas.android.com/apk/res/android"
2. xmlns:tools="http://schemas.android.com/tools"
3. android:layout_width="match_parent"
4. android:layout_height="match_parent"
5. tools:context=".MainActivity" >
6.
7. <ToggleButton
8. android:id="@+id/toggleButton1"
9. android:layout_width="wrap_content"
10. android:layout_height="wrap_content"
11. android:layout_alignParentLeft="true"
12. android:layout_alignParentTop="true"
13. android:layout_marginLeft="60dp"
14. android:layout_marginTop="18dp"
15. android:text="ToggleButton1"
16. android:textOff="Off"
17. android:textOn="On" />
18.
19. <ToggleButton
20. android:id="@+id/toggleButton2"
21. android:layout_width="wrap_content"
22. android:layout_height="wrap_content"
23. android:layout_alignBaseline="@+id/toggleButton1"
24. android:layout_alignBottom="@+id/toggleButton1"
25. android:layout_marginLeft="44dp"
26. android:layout_toRightOf="@+id/toggleButton1"
27. android:text="ToggleButton2"
28. android:textOff="Off"
29. android:textOn="On" />
30.
31. <Button
32. android:id="@+id/button1"
33. android:layout_width="wrap_content"
34. android:layout_height="wrap_content"
35. android:layout_below="@+id/toggleButton2"
36. android:layout_marginTop="82dp"
37. android:layout_toRightOf="@+id/toggleButton1"
38. android:text="submit" />
39.
40. </RelativeLayout>
Activity class
Let's write the code to check which toggle button is ON/OFF.
File: MainActivity.java
1. package com.example.togglebutton;
2.
3. import android.os.Bundle;
4. import android.app.Activity;
5. import android.view.Menu;
6. import android.view.View;
7. import android.view.View.OnClickListener;
8. import android.widget.Button;
9. import android.widget.Toast;
10. import android.widget.ToggleButton;
11.
12. public class MainActivity extends Activity {
13. private ToggleButton toggleButton1, toggleButton2;
14. private Button buttonSubmit;
15. @Override
16. protected void onCreate(Bundle savedInstanceState) {
17. super.onCreate(savedInstanceState);
18. setContentView(R.layout.activity_main);
19.
20. addListenerOnButtonClick();
21. }
22. public void addListenerOnButtonClick(){
23. //Getting the ToggleButton and Button instance from the layout xml file
24. toggleButton1=(ToggleButton)findViewById(R.id.toggleButton1);
25. toggleButton2=(ToggleButton)findViewById(R.id.toggleButton2);
26. buttonSubmit=(Button)findViewById(R.id.button1);
27.
28. //Performing action on button click
29. buttonSubmit.setOnClickListener(new OnClickListener(){
30.
31. @Override
32. public void onClick(View view) {
33. StringBuilder result = new StringBuilder();
34. result.append("ToggleButton1 : ").append(toggleButton1.getText());
35. result.append("\nToggleButton2 : ").append(toggleButton2.getText());
36. //Displaying the message in toast
37. Toast.makeText(getApplicationContext(), result.toString(),Toast.LENGTH_
LONG).show();
38. }
39.
40. });
41.
42. }
43. @Override
44. public boolean onCreateOptionsMenu(Menu menu) {
45. // Inflate the menu; this adds items to the action bar if it is present.
46. getMenuInflater().inflate(R.menu.activity_main, menu);
47. return true;
48. }
49.
50. }
Output:
There can be a lot of usage of checkboxes. For example, it can be used to know the hobby
of the user, activate/deactivate the specific action etc.
Method Description
activity_main.xml
Drag the three checkboxes and one button for the layout. Now the activity_main.xml file will
look like this:
File: activity_main.xml
1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
2. xmlns:tools="http://schemas.android.com/tools"
3. android:layout_width="match_parent"
4. android:layout_height="match_parent"
5. tools:context=".MainActivity" >
6.
7. <CheckBox
8. android:id="@+id/checkBox1"
9. android:layout_width="wrap_content"
10. android:layout_height="wrap_content"
11. android:layout_alignParentLeft="true"
12. android:layout_alignParentTop="true"
13. android:text="Pizza" />
14.
15. <CheckBox
16. android:id="@+id/checkBox2"
17. android:layout_width="wrap_content"
18. android:layout_height="wrap_content"
19. android:layout_alignParentTop="true"
20. android:layout_toRightOf="@+id/checkBox1"
21. android:text="Coffe" />
22.
23. <CheckBox
24. android:id="@+id/checkBox3"
25. android:layout_width="wrap_content"
26. android:layout_height="wrap_content"
27. android:layout_alignParentTop="true"
28. android:layout_toRightOf="@+id/checkBox2"
29. android:text="Burger" />
30.
31. <Button
32. android:id="@+id/button1"
33. android:layout_width="wrap_content"
34. android:layout_height="wrap_content"
35. android:layout_below="@+id/checkBox2"
36. android:layout_marginTop="32dp"
37. android:layout_toLeftOf="@+id/checkBox3"
38. android:text="Order" />
39.
40. </RelativeLayout>
Activity class
Let's write the code to check which toggle button is ON/OFF.
File: MainActivity.java
1. package com.example.checkbox;
2.
3. import android.os.Bundle;
4. import android.app.Activity;
5. import android.view.Menu;
6. import android.view.View;
7. import android.view.View.OnClickListener;
8. import android.widget.*;
9.
10. public class MainActivity extends Activity {
11. CheckBox pizza,coffe,burger;
12. Button buttonOrder;
13. @Override
14. protected void onCreate(Bundle savedInstanceState) {
15. super.onCreate(savedInstanceState);
16. setContentView(R.layout.activity_main);
17. addListenerOnButtonClick();
18. }
19. public void addListenerOnButtonClick(){
20. //Getting instance of CheckBoxes and Button from the activty_main.xml file
21. pizza=(CheckBox)findViewById(R.id.checkBox1);
22. coffe=(CheckBox)findViewById(R.id.checkBox2);
23. burger=(CheckBox)findViewById(R.id.checkBox3);
24. buttonOrder=(Button)findViewById(R.id.button1);
25.
26. //Applying the Listener on the Button click
27. buttonOrder.setOnClickListener(new OnClickListener(){
28.
29. @Override
30. public void onClick(View view) {
31. int totalamount=0;
32. StringBuilder result=new StringBuilder();
33. result.append("Selected Items:");
34. if(pizza.isChecked()){
35. result.append("\nPizza 100Rs");
36. totalamount+=100;
37. }
38. if(coffe.isChecked()){
39. result.append("\nCoffe 50Rs");
40. totalamount+=50;
41. }
42. if(burger.isChecked()){
43. result.append("\nBurger 120Rs");
44. totalamount+=120;
45. }
46. result.append("\nTotal: "+totalamount+"Rs");
47. //Displaying the message on the toast
48. Toast.makeText(getApplicationContext(), result.toString(), Toast.LENGTH_LO
NG).show();
49. }
50.
51. });
52. }
53. @Override
54. public boolean onCreateOptionsMenu(Menu menu) {
55. // Inflate the menu; this adds items to the action bar if it is present.
56. getMenuInflater().inflate(R.menu.activity_main, menu);
57. return true;
58. }
59.
60. }
Android AlertDialog can be used to display the dialog message with OK and Cancel
buttons. It can be used to interrupt and ask the user about his/her choice to continue or
discontinue.
Android AlertDialog is composed of three regions: title, content area and action buttons.
activity_main.xml
You can have multiple components, here we are having only a textview.
File: activity_main.xml
1. <RelativeLayout xmlns:androclass="http://schemas.android.com/apk/res/android"
2. xmlns:tools="http://schemas.android.com/tools"
3. android:layout_width="match_parent"
4. android:layout_height="match_parent"
5. tools:context=".MainActivity" >
6.
7. <TextView
8. android:layout_width="wrap_content"
9. android:layout_height="wrap_content"
10. android:layout_centerHorizontal="true"
11. android:layout_centerVertical="true"
12. android:text="@string/hello_world" />
13.
14. </RelativeLayout>
strings.xml
Optionally, you can store the dialog message and title in the strings.xml file.
File: strings.xml
Activity class
Let's write the code to create and show the AlertDialog.
File: MainActivity.java
1. package com.example.alertdialog;
2.
3. import android.os.Bundle;
4. import android.app.Activity;
5. import android.app.AlertDialog;
6. import android.content.DialogInterface;
7. import android.view.Menu;
8.
9. public class MainActivity extends Activity {
10.
11. @Override
12. protected void onCreate(Bundle savedInstanceState) {
13. super.onCreate(savedInstanceState);
14.
15. AlertDialog.Builder builder = new AlertDialog.Builder(this);
16. //Uncomment the below code to Set the message and title from the strings.xml
file
17. //builder.setMessage(R.string.dialog_message) .setTitle(R.string.dialog_title);
18.
19. //Setting message manually and performing action on button click
20. builder.setMessage("Do you want to close this application ?")
21. .setCancelable(false)
22. .setPositiveButton("Yes", new DialogInterface.OnClickListener() {
23. public void onClick(DialogInterface dialog, int id) {
24. finish();
25. }
26. })
27. .setNegativeButton("No", new DialogInterface.OnClickListener() {
28. public void onClick(DialogInterface dialog, int id) {
29. // Action for 'NO' Button
30. dialog.cancel();
31. }
32. });
33.
34. //Creating dialog box
35. AlertDialog alert = builder.create();
36. //Setting the title manually
37. alert.setTitle("AlertDialogExample");
38. alert.show();
39. setContentView(R.layout.activity_main);
40. }
41.
42. @Override
43. public boolean onCreateOptionsMenu(Menu menu) {
44. // Inflate the menu; this adds items to the action bar if it is present.
45. getMenuInflater().inflate(R.menu.activity_main, menu);
46. return true;
47. }
48.
49. }
Android spinner is like the drop down menu with multiple values from which the end user
can select only one value.
Android spinner is associated with AdapterView. So you need to use one of the adapter
classes with spinner.
activity_main.xml
Drag the Spinner from the pallete, now the activity_main.xml file will like this:
File: activity_main.xml
1. <RelativeLayout xmlns:androclass="http://schemas.android.com/apk/res/android"
2. xmlns:tools="http://schemas.android.com/tools"
3. android:layout_width="match_parent"
4. android:layout_height="match_parent"
5. tools:context=".MainActivity" >
6.
7. <Spinner
8. android:id="@+id/spinner1"
9. android:layout_width="wrap_content"
10. android:layout_height="wrap_content"
11. android:layout_alignParentTop="true"
12. android:layout_centerHorizontal="true"
13. android:layout_marginTop="83dp" />
14.
15. </RelativeLayout>
Activity class
Let's write the code to display item on the spinner and perform event handling.
File: MainActivity.java
1. package com.example.spinner;
2. import android.app.Activity;
3. import android.os.Bundle;
4. import android.view.Menu;
5. import android.view.View;
6. import android.widget.AdapterView;
7. import android.widget.ArrayAdapter;
8. import android.widget.Spinner;
9. import android.widget.TextView;
10. import android.widget.Toast;
11.
12. public class MainActivity extends Activity implements
13. AdapterView.OnItemSelectedListener {
14.
15. String[] country = { "India", "USA", "China", "Japan", "Other", };
16.
17. @Override
18. protected void onCreate(Bundle savedInstanceState) {
19. super.onCreate(savedInstanceState);
20. setContentView(R.layout.activity_main);
21. //Getting the instance of Spinner and applying OnItemSelectedListener on it
22. Spinner spin = (Spinner) findViewById(R.id.spinner1);
23. spin.setOnItemSelectedListener(this);
24.
25. //Creating the ArrayAdapter instance having the country list
26. ArrayAdapter aa = new ArrayAdapter(this,android.R.layout.simple_spinner_ite
m,country);
27. aa.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_ite
m);
28. //Setting the ArrayAdapter data on the Spinner
29. spin.setAdapter(aa);
30. }
31.
32.
33. //Performing action onItemSelected and onNothing selected
34. @Override
35. public void onItemSelected(AdapterView<?> arg0, View arg1, int position,long i
d) {
36. Toast.makeText(getApplicationContext(),country[position] ,Toast.LENGTH_LON
G).show();
37. }
38.
39. @Override
40. public void onNothingSelected(AdapterView<?> arg0) {
41. // TODO Auto-generated method stub
42.
43. }
44.
45. @Override
46. public boolean onCreateOptionsMenu(Menu menu) {
47. // Inflate the menu; this adds items to the action bar if it is present.
48. getMenuInflater().inflate(R.menu.activity_main, menu);
49. return true;
50. }
51. }
activity_main.xml
Drag the AutoCompleteTextView and TextView from the pallete, now the activity_main.xml
file will like this:
File: activity_main.xml
1. <RelativeLayout xmlns:androclass="http://schemas.android.com/apk/res/android"
2. xmlns:tools="http://schemas.android.com/tools"
3. android:layout_width="match_parent"
4. android:layout_height="match_parent"
5. tools:context=".MainActivity" >
6.
7. <TextView
8. android:id="@+id/textView1"
9. android:layout_width="wrap_content"
10. android:layout_height="wrap_content"
11. android:layout_alignParentLeft="true"
12. android:layout_alignParentTop="true"
13. android:layout_marginTop="15dp"
14. android:text="@string/what_is_your_favourite_programming_language_" />
15.
16. <AutoCompleteTextView
17. android:id="@+id/autoCompleteTextView1"
18. android:layout_width="wrap_content"
19. android:layout_height="wrap_content"
20. android:layout_alignParentLeft="true"
21. android:layout_below="@+id/textView1"
22. android:layout_marginLeft="36dp"
23. android:layout_marginTop="17dp"
24. android:ems="10"
25. android:text="">
26.
27. <requestFocus />
28. </AutoCompleteTextView>
29.
30. </RelativeLayout>
Activity class
Let's write the code of AutoCompleteTextView.
File: MainActivity.java
1. package com.example.autocompletetextview;
2.
3. import android.os.Bundle;
4. import android.app.Activity;
5. import android.graphics.Color;
6. import android.view.Menu;
7. import android.widget.ArrayAdapter;
8. import android.widget.AutoCompleteTextView;
9.
10. public class MainActivity extends Activity {
11. String[] language ={"C","C+
+","Java",".NET","iPhone","Android","ASP.NET","PHP"};
12. @Override
13. protected void onCreate(Bundle savedInstanceState) {
14. super.onCreate(savedInstanceState);
15. setContentView(R.layout.activity_main);
16.
17. //Creating the instance of ArrayAdapter containing list of language names
18. ArrayAdapter<String> adapter = new ArrayAdapter<String>
19. (this,android.R.layout.select_dialog_item,language);
20. //Getting the instance of AutoCompleteTextView
21. AutoCompleteTextView actv= (AutoCompleteTextView)findViewById(R.id.auto
CompleteTextView1);
22. actv.setThreshold(1);//will start working from first character
23. actv.setAdapter(adapter);//setting the adapter data into the AutoCompleteTe
xtView
24. actv.setTextColor(Color.RED);
25.
26. }
27.
28. @Override
29. public boolean onCreateOptionsMenu(Menu menu) {
30. // Inflate the menu; this adds items to the action bar if it is present.
31. getMenuInflater().inflate(R.menu.activity_main, menu);
32. return true;
33. }
34.
35. }
Android RatingBar displays the rating in stars. Android RatingBar is the subclass of
AbsSeekBar class.
The getRating() method of android RatingBar class returns the rating number.
activity_main.xml
Drag the RatingBar and Button from the pallete, now the activity_main.xml file will like this:
File: activity_main.xml
1. <RelativeLayout xmlns:androclass="http://schemas.android.com/apk/res/android"
2. xmlns:tools="http://schemas.android.com/tools"
3. android:layout_width="match_parent"
4. android:layout_height="match_parent"
5. tools:context=".MainActivity" >
6.
7. <RatingBar
8. android:id="@+id/ratingBar1"
9. android:layout_width="wrap_content"
10. android:layout_height="wrap_content"
11. android:layout_alignParentTop="true"
12. android:layout_centerHorizontal="true"
13. android:layout_marginTop="44dp" />
14.
15. <Button
16. android:id="@+id/button1"
17. android:layout_width="wrap_content"
18. android:layout_height="wrap_content"
19. android:layout_alignLeft="@+id/ratingBar1"
20. android:layout_below="@+id/ratingBar1"
21. android:layout_marginLeft="92dp"
22. android:layout_marginTop="66dp"
23. android:text="submit" />
24.
25. </RelativeLayout>
Activity class
Let's write the code to display the rating of the user.
File: MainActivity.java
1. package com.example.rating;
2.
3. import android.os.Bundle;
4. import android.app.Activity;
5. import android.view.Menu;
6. import android.view.View;
7. import android.view.View.OnClickListener;
8. import android.widget.Button;
9. import android.widget.RatingBar;
10. import android.widget.Toast;
11.
12. public class MainActivity extends Activity {
13. RatingBar ratingbar1;
14. Button button;
15. @Override
16. protected void onCreate(Bundle savedInstanceState) {
17. super.onCreate(savedInstanceState);
18. setContentView(R.layout.activity_main);
19. addListenerOnButtonClick();
20. }
21.
22. public void addListenerOnButtonClick(){
23. ratingbar1=(RatingBar)findViewById(R.id.ratingBar1);
24. button=(Button)findViewById(R.id.button1);
25. //Performing action on Button Click
26. button.setOnClickListener(new OnClickListener(){
27.
28. @Override
29. public void onClick(View arg0) {
30. //Getting the rating and displaying it on the toast
31. String rating=String.valueOf(ratingbar1.getRating());
32. Toast.makeText(getApplicationContext(), rating, Toast.LENGTH_LONG).sh
ow();
33. }
34.
35. });
36. }
37. @Override
38. public boolean onCreateOptionsMenu(Menu menu) {
39. // Inflate the menu; this adds items to the action bar if it is present.
40. getMenuInflater().inflate(R.menu.activity_main, menu);
41. return true;
42. }
43.
44. }
Android WebView is used to display web page in android. The web page can be loaded
from same application or URL. It is used to display online content in android activity.
Let's see the simple code to display javatpoint.com web page using web view.
activity_main.xml
File: activity_main.xml
1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
2. xmlns:tools="http://schemas.android.com/tools"
3. android:layout_width="match_parent"
4. android:layout_height="match_parent"
5. tools:context=".MainActivity" >
6.
7. <WebView
8. android:id="@+id/webView1"
9. android:layout_width="match_parent"
10. android:layout_height="match_parent"
11. android:layout_alignParentTop="true"
12. android:layout_centerHorizontal="true"
13. android:layout_marginTop="42dp" />
14.
15. </RelativeLayout>
Activity class
File: MainActivity.java
1. package com.example.webview;
2.
3. import android.os.Bundle;
4. import android.app.Activity;
5. import android.view.Menu;
6. import android.webkit.WebView;
7.
8. public class MainActivity extends Activity {
9.
10. @Override
11. protected void onCreate(Bundle savedInstanceState) {
12. super.onCreate(savedInstanceState);
13. setContentView(R.layout.activity_main);
14.
15. WebView mywebview = (WebView) findViewById(R.id.webView1);
16. //mywebview.loadUrl("http://www.javatpoint.com/");
17.
18. /*String data = "<html><body><h1>Hello, Javatpoint!
</h1></body></html>";
19. mywebview.loadData(data, "text/html", "UTF-8"); */
20.
21. mywebview.loadUrl("file:///android_asset/myresource.html");
22. }
23.
24. @Override
25. public boolean onCreateOptionsMenu(Menu menu) {
26. // Inflate the menu; this adds items to the action bar if it is present.
27. getMenuInflater().inflate(R.menu.activity_main, menu);
28. return true;
29. }
30.
31. }
Output:
Android SeekBar is a kind of ProgressBar with draggable thumb. The end user can drag
the thum left and right to move the progress of song, file download etc.
The SeekBar.OnSeekBarChangeListener interface provides methods to perform even
handling for seek bar.
Android SeekBar and RatingBar classes are the sub classes of AbsSeekBar.
activity_main.xml
Drag the seek bar from the pallete, now activity_main.xml will look like this:
File: activity_main.xml
1. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
2. xmlns:tools="http://schemas.android.com/tools"
3. android:layout_width="match_parent"
4. android:layout_height="match_parent"
5. android:paddingBottom="@dimen/activity_vertical_margin"
6. android:paddingLeft="@dimen/activity_horizontal_margin"
7. android:paddingRight="@dimen/activity_horizontal_margin"
8. android:paddingTop="@dimen/activity_vertical_margin"
9. tools:context=".MainActivity" >
10.
11. <SeekBar
12. android:id="@+id/seekBar1"
13. android:layout_width="match_parent"
14. android:layout_height="wrap_content"
15. android:layout_alignParentTop="true"
16. android:layout_centerHorizontal="true"
17. android:layout_marginTop="39dp" />
18.
19. </RelativeLayout>
Activity class
Let's see the Activity class displaying seek bar and performing event handling.
File: MainActivity.java
1. package com.example.seekbar;
2. import android.os.Bundle;
3. import android.app.Activity;
4. import android.view.Menu;
5. import android.widget.SeekBar;
6. import android.widget.SeekBar.OnSeekBarChangeListener;
7. import android.widget.Toast;
8. public class MainActivity extends Activity implements OnSeekBarChangeListener{
9. SeekBar seekBar1;
10. @Override
11. protected void onCreate(Bundle savedInstanceState) {
12. super.onCreate(savedInstanceState);
13. setContentView(R.layout.activity_main);
14.
15. seekBar1=(SeekBar)findViewById(R.id.seekBar1);
16. seekBar1.setOnSeekBarChangeListener(this);
17. }
18. @Override
19. public void onProgressChanged(SeekBar seekBar, int progress,
20. boolean fromUser) {
21. Toast.makeText(getApplicationContext(),"seekbar progress: "+progress, Toast.L
ENGTH_SHORT).show();
22. }
23. @Override
24. public void onStartTrackingTouch(SeekBar seekBar) {
25. Toast.makeText(getApplicationContext(),"seekbar touch started!", Toast.LENGT
H_SHORT).show();
26. }
27. @Override
28. public void onStopTrackingTouch(SeekBar seekBar) {
29. Toast.makeText(getApplicationContext(),"seekbar touch stopped!", Toast.LENGT
H_SHORT).show();
30. }
31. @Override
32. public boolean onCreateOptionsMenu(Menu menu) {
33. // Inflate the menu; this adds items to the action bar if it is present.
34. getMenuInflater().inflate(R.menu.main, menu);
35. return true;
36. }
37. }
Output:
Android DatePicker Example
Android DatePicker is a widget to select date. It allows you to select date by day, month and
year. Like DatePicker, android also provides TimePicker to select time.
The android.widget.DatePicker is the subclass of FrameLayout class.
activity_main.xml
File: activity_main.xml
1. <RelativeLayout xmlns:androclass="http://schemas.android.com/apk/res/android"
2. xmlns:tools="http://schemas.android.com/tools"
3. android:layout_width="match_parent"
4. android:layout_height="match_parent"
5. tools:context=".MainActivity" >
6.
7. <TextView
8. android:id="@+id/textView1"
9. android:layout_width="wrap_content"
10. android:layout_height="wrap_content"
11. android:layout_alignParentLeft="true"
12. android:layout_alignParentTop="true"
13. android:layout_marginLeft="50dp"
14. android:layout_marginTop="36dp"
15. android:text="Current Date:" />
16.
17. <Button
18. android:id="@+id/button1"
19. android:layout_width="wrap_content"
20. android:layout_height="wrap_content"
21. android:layout_alignParentBottom="true"
22. android:layout_centerHorizontal="true"
23. android:layout_marginBottom="140dp"
24. android:text="Change Date" />
25.
26. <DatePicker
27. android:id="@+id/datePicker1"
28. android:layout_width="wrap_content"
29. android:layout_height="wrap_content"
30. android:layout_above="@+id/button1"
31. android:layout_centerHorizontal="true"
32. android:layout_marginBottom="30dp" />
33.
34. </RelativeLayout>
Activity class
File: MainActivity.java
1. package com.example.datepicker2;
2.
3. import android.os.Bundle;
4. import android.app.Activity;
5. import android.view.Menu;
6. import android.view.View;
7. import android.view.View.OnClickListener;
8. import android.widget.Button;
9. import android.widget.DatePicker;
10. import android.widget.TextView;
11. import android.widget.Toast;
12.
13. public class MainActivity extends Activity {
14. DatePicker picker;
15. Button displayDate;
16. TextView textview1;
17. @Override
18. protected void onCreate(Bundle savedInstanceState) {
19. super.onCreate(savedInstanceState);
20. setContentView(R.layout.activity_main);
21.
22. textview1=(TextView)findViewById(R.id.textView1);
23. picker=(DatePicker)findViewById(R.id.datePicker1);
24. displayDate=(Button)findViewById(R.id.button1);
25.
26. textview1.setText(getCurrentDate());
27.
28. displayDate.setOnClickListener(new OnClickListener(){
29. @Override
30. public void onClick(View view) {
31. textview1.setText(getCurrentDate());
32. }
33.
34. });
35. }
36. public String getCurrentDate(){
37. StringBuilder builder=new StringBuilder();
38. builder.append("Current Date: ");
39. builder.append((picker.getMonth() + 1)+"/");//month is 0 based
40. builder.append(picker.getDayOfMonth()+"/");
41. builder.append(picker.getYear());
42. return builder.toString();
43. }
44. @Override
45. public boolean onCreateOptionsMenu(Menu menu) {
46. // Inflate the menu; this adds items to the action bar if it is present.
47. getMenuInflater().inflate(R.menu.activity_main, menu);
48. return true;
49. }
50.
51. }
Android TimePicker Example
Android TimePicker widget is used to select date. It allows you to select time by hour and
minute. You cannot select time by seconds.
activity_main.xml
File: activity_main.xml
1. <RelativeLayout xmlns:androclass="http://schemas.android.com/apk/res/android"
2. xmlns:tools="http://schemas.android.com/tools"
3. android:layout_width="match_parent"
4. android:layout_height="match_parent"
5. tools:context=".MainActivity" >
6.
7. <TimePicker
8. android:id="@+id/timePicker1"
9. android:layout_width="wrap_content"
10. android:layout_height="wrap_content"
11. android:layout_alignParentTop="true"
12. android:layout_centerHorizontal="true"
13. android:layout_marginTop="86dp" />
14.
15. <TextView
16. android:id="@+id/textView1"
17. android:layout_width="wrap_content"
18. android:layout_height="wrap_content"
19. android:layout_alignLeft="@+id/timePicker1"
20. android:layout_alignParentTop="true"
21. android:layout_marginTop="17dp"
22. android:text="Current Time:" />
23.
24. <Button
25. android:id="@+id/button1"
26. android:layout_width="wrap_content"
27. android:layout_height="wrap_content"
28. android:layout_alignLeft="@+id/timePicker1"
29. android:layout_below="@+id/timePicker1"
30. android:layout_marginLeft="37dp"
31. android:layout_marginTop="55dp"
32. android:text="Change Time" />
33.
34. </RelativeLayout>
Activity class
File: MainActivity.java
1. package com.example.timepicker1;
2.
3. import android.os.Bundle;
4. import android.app.Activity;
5. import android.view.Menu;
6. import android.view.View;
7. import android.view.View.OnClickListener;
8. import android.widget.Button;
9. import android.widget.TextView;
10. import android.widget.TimePicker;
11. import android.widget.Toast;
12.
13. public class MainActivity extends Activity {
14. TextView textview1;
15. TimePicker timepicker1;
16. Button changetime;
17.
18. @Override
19. protected void onCreate(Bundle savedInstanceState) {
20. super.onCreate(savedInstanceState);
21. setContentView(R.layout.activity_main);
22.
23. textview1=(TextView)findViewById(R.id.textView1);
24. timepicker1=(TimePicker)findViewById(R.id.timePicker1);
25. //Uncomment the below line of code for 24 hour view
26. timepicker1.setIs24HourView(true);
27. changetime=(Button)findViewById(R.id.button1);
28.
29. textview1.setText(getCurrentTime());
30.
31. changetime.setOnClickListener(new OnClickListener(){
32. @Override
33. public void onClick(View view) {
34. textview1.setText(getCurrentTime());
35. }
36. });
37.
38. }
39.
40. public String getCurrentTime(){
41. String currentTime="Current Time: "+timepicker1.getCurrentHour()
+":"+timepicker1.getCurrentMinute();
42. return currentTime;
43. }
44. @Override
45. public boolean onCreateOptionsMenu(Menu menu) {
46. // Inflate the menu; this adds items to the action bar if it is present.
47. getMenuInflater().inflate(R.menu.activity_main, menu);
48. return true;
49. }
50.
51. }
Android analog and digital clocks are used to show time in android application.
Android DigitalClock is the subclass of TextView class. Since Android API level 17, it
is deprecated. You are recommended to use TextClock Instead.
Note: Analog and Digital clocks cannot be used to change the time of the device. To do so,
you need to use DatePicker and TimePicker.
In android, you need to drag analog and digital clocks from the pallet to display analog
and digital clocks. It represents the timing of the current device.
activity_main.xml
Now, drag the analog and digital clocks, now the xml file will look like this.
File: activity_main.xml
1. <RelativeLayout xmlns:androclass="http://schemas.android.com/apk/res/android"
2. xmlns:tools="http://schemas.android.com/tools"
3. android:layout_width="match_parent"
4. android:layout_height="match_parent"
5. tools:context=".MainActivity" >
6.
7. <AnalogClock
8. android:id="@+id/analogClock1"
9. android:layout_width="wrap_content"
10. android:layout_height="wrap_content"
11. android:layout_alignParentTop="true"
12. android:layout_centerHorizontal="true"
13. android:layout_marginTop="22dp" />
14.
15. <DigitalClock
16. android:id="@+id/digitalClock1"
17. android:layout_width="wrap_content"
18. android:layout_height="wrap_content"
19. android:layout_below="@+id/analogClock1"
20. android:layout_centerHorizontal="true"
21. android:layout_marginTop="81dp"
22. android:text="DigitalClock" />
23.
24. </RelativeLayout>
Activity class
We have not write any code here.
File: MainActivity.java
1. package com.example.analogdigital;
2.
3. import android.os.Bundle;
4. import android.app.Activity;
5. import android.view.Menu;
6.
7. public class MainActivity extends Activity {
8.
9. @Override
10. protected void onCreate(Bundle savedInstanceState) {
11. super.onCreate(savedInstanceState);
12. setContentView(R.layout.activity_main);
13. }
14.
15. @Override
16. public boolean onCreateOptionsMenu(Menu menu) {
17. // Inflate the menu; this adds items to the action bar if it is present.
18. getMenuInflater().inflate(R.menu.activity_main, menu);
19. return true;
20. }
21. }
Output:
In this example, we are displaying the progress dialog for dummy file download operation.
Here we are using android.app.ProgressDialog class to show the progress bar. Android
ProgressDialog is the subclass of AlertDialog class.
The ProgressDialog class provides methods to work on progress bar like setProgress(),
setMessage(), setProgressStyle(), setMax(), show() etc. The progress range of Progress
Dialog is 0 to 10000.
activity_main.xml
Drag one button from the pallete, now the activity_main.xml file will look like this:
File: activity_main.xml
1. <RelativeLayout xmlns:androclass="http://schemas.android.com/apk/res/android"
2. xmlns:tools="http://schemas.android.com/tools"
3. android:layout_width="match_parent"
4. android:layout_height="match_parent"
5. tools:context=".MainActivity" >
6.
7. <Button
8. android:id="@+id/button1"
9. android:layout_width="wrap_content"
10. android:layout_height="wrap_content"
11. android:layout_alignParentTop="true"
12. android:layout_centerHorizontal="true"
13. android:layout_marginTop="116dp"
14. android:text="download file" />
15.
16. </RelativeLayout>
Activity class
Let's write the code to display the progress bar dialog box.
File: MainActivity.java
1. package com.example.progressbar1;
2. import android.app.Activity;
3. import android.app.ProgressDialog;
4. import android.os.Bundle;
5. import android.os.Handler;
6. import android.widget.Button;
7. import android.view.Menu;
8. import android.view.View;
9. import android.view.View.OnClickListener;
10. public class MainActivity extends Activity {
11. Button btnStartProgress;
12. ProgressDialog progressBar;
13. private int progressBarStatus = 0;
14. private Handler progressBarHandler = new Handler();
15. private long fileSize = 0;
16. @Override
17. protected void onCreate(Bundle savedInstanceState) {
18. super.onCreate(savedInstanceState);
19. setContentView(R.layout.activity_main);
20. addListenerOnButtonClick();
21. }
22. public void addListenerOnButtonClick() {
23. btnStartProgress = (Button) findViewById(R.id.button1);
24. btnStartProgress.setOnClickListener(new OnClickListener(){
25.
26. @Override
27. public void onClick(View v) {
28. // creating progress bar dialog
29. progressBar = new ProgressDialog(v.getContext());
30. progressBar.setCancelable(true);
31. progressBar.setMessage("File downloading ...");
32. progressBar.setProgressStyle(ProgressDialog.STYLE_HORIZONTAL);
33. progressBar.setProgress(0);
34. progressBar.setMax(100);
35. progressBar.show();
36. //reset progress bar and filesize status
37. progressBarStatus = 0;
38. fileSize = 0;
39.
40. new Thread(new Runnable() {
41. public void run() {
42. while (progressBarStatus < 100) {
43. // performing operation
44. progressBarStatus = doOperation();
45. try {Thread.sleep(1000);} catch (InterruptedException e) {e.printStack
Trace();}
46. // Updating the progress bar
47. progressBarHandler.post(new Runnable() {
48. public void run() {
49. progressBar.setProgress(progressBarStatus);
50. }
51. });
52. }
53. // performing operation if file is downloaded,
54. if (progressBarStatus >= 100) {
55. // sleeping for 1 second after operation completed
56. try {Thread.sleep(1000);} catch (InterruptedException e) {e.printSta
ckTrace();}
57. // close the progress bar dialog
58. progressBar.dismiss();
59. }
60. }
61. }).start();
62. }//end of onClick method
63. });
64. }
65. // checking how much file is downloaded and updating the filesize
66. public int doOperation() {
67. //The range of ProgressDialog starts from 0 to 10000
68. while (fileSize <= 10000) {
69. fileSize++;
70. if (fileSize == 1000) {
71. return 10;
72. } else if (fileSize == 2000) {
73. return 20;
74. } else if (fileSize == 3000) {
75. return 30;
76. } else if (fileSize == 4000) {
77. return 40;//you can add more else if
78. } else{
79. return 100;
80. }
81. }//end of while
82. return 100;
83. }//end of doOperation
84.
85. @Override
86. public boolean onCreateOptionsMenu(Menu menu) {
87. // Inflate the menu; this adds items to the action bar if it is present.
88. getMenuInflater().inflate(R.menu.main, menu);
89. return true;
90. }
91. }
download this android example
Output:
1) What is Android?
Android is an open-source, linux-based operating system that is used in mobiles, tablets,
televisions etc.
2. Blender
3. Cupcake
4. Donut
5. Eclair
6. Froyo
7. Gingerbread
8. Honycomb
11. Kitkat
Supports various technologies: It supports camera, bluetooth, wifi, speech, EDGE etc.
technologies.
Highly optimized Virtual Machine: Android uses highly optimized virtual machine for
mobile devices, called DVM (Dalvik Virtual Machine).
Activity
View
Intent
Service
Content Provider
Fragment etc.
7) What is activity?
Activity is like a frame or window in java that represents GUI. It represents one screen of
android.
1. onCreate()
2. onStart()
3. onResume()
4. onPause()
5. onStop()
6. onRestart()
7. onDestroy()
9) What is intent?
It is a kind of message or information that is passed to the components. It is used to launch
an activity, display a web page, send sms, send email etc. There are two types of intents in
android:
1. Implicit Intent
2. Explicit Intent