Android Interface Design dialog box-custom Toast, AlertDialog, and androidalertdialog

Source: Internet
Author: User

Android Interface Design dialog box-custom Toast, AlertDialog, and androidalertdialog

I. Overview

In the interface design, a dialog box is required to display the prompt information and error information based on user operations. There are two common display methods for Android implementation prompts

1. Toast

2. AlertDialog

Ii. Toast

Android is a mechanism for displaying information, which is frequently used in lightweight message development. Features

    1. Do not accept user operations, with no focus

2. The display time is limited and will disappear automatically after a certain period of time.

It is very easy to use Toast to display information. The operation is as follows:

Toast toast = Toast. makeText (this, "data loaded", Toast. LENGTH_LONG); // create Toasttoast. show (); // display the message

The general Toast looks very simple. You can also customize Toast as needed. For example, you can add and remove the information prompts in the news headlines.

 

Toast customization mainly involves two aspects:

    1. Customize the Toast appearance

2. Set Toast to the screen position

The key code for Toast customization is as follows:

Toast toast = Toast. makeText (context, msg, Toast. LENGTH_LONG); // create Toastint offsetX = 0; int offsetY = 0; toast. setGravity (Gravity. BOTTOM, offsetX, offsetY); // you can specify the position LinearLayout ll = LayoutInflater. from (context ). inflate (R. layout. custom_toast, null); toast. setView (ll); // set the toast. show ();

The code for completing the above case is as follows:

1. CustomToastActivity:

Private Button btCollect; protected void onCreate (Bundle savedInstanceState) {super. onCreate (savedInstanceState); super. setContentView (R. layout. custom_toast_activity); initView ();} private void initView () {btCollect = (Button) super. findViewById (R. id. btCollect); btCollect. setOnClickListener (this);} private void showToast (String txt) {Toast tast = Toast. makeText (this, txt, Toast. LENGTH_LONG); tast. setGravity (Gravity. CENTER, 0, 0); View view = LayoutInflater. from (this ). inflate (R. layout. custom_toast, null); TextView tvMsg = (TextView) view. findViewById (R. id. tvMsg); tvMsg. setText (txt); tast. setView (view); tast. show ();} public void onClick (View view) {String txtCollect = btCollect. getText (). toString (); if (txtCollect. equals ("favorites") {btCollect. setText (""); showToast ("" ");} else {btCollect. setText ("favorites"); showToast ("Remove from favorites ");}}

2. custom_toast.xml

<? Xml version = "1.0" encoding = "UTF-8"?> <RelativeLayout xmlns: android = "http://schemas.android.com/apk/res/android" android: layout_width = "match_parent" android: padding = "10dp" android: layout_height = "match_parent" android: background = "@ drawable/toast_shape"> <TextView android: id = "@ + id/tvImg" android: layout_width = "wrap_content" android: layout_height = "wrap_content" android: textSize = "60sp" android: text ="★"Android: textColor =" @ color/white "android: layout_centerHorizontal =" true "> </TextView> <TextView android: id =" @ + id/tvMsg "android: layout_width = "wrap_content" android: layout_height = "wrap_content" android: textSize = "28sp" android: text = "added to Favorites" android: textColor = "@ color/white" android: layout_below = "@ + id/tvImg" android: layout_centerHorizontal = "true"/> </RelativeLayout>

3. toast_shape.xml

<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android" >    <solid android:color="#000000"></solid>       <corners android:radius="10dp"/></shape>
3. Dialog Box
1. AlertDialog

A simple dialog box mainly aims to display a warning message for the user and generate AlertDialog through AlertDialog. Builder. The main code is as follows:

Dialog dialog = new AlertDialog. Builder (this). setTitle ("Dialog box") // set the title. setMessage ("displays the prompt information. ") // Display information. setIcon (R. drawable. pic_m) // set the displayed IconsetPositiveButton ("OK", new DialogInterface. onClickListener () {public void onClick (DialogInterface diich, int which) {dialog. dismiss () ;}}) // set button. create (); // create Dialogdialog. show (); // display the dialog box

Other main methods:
SetView: Set a custom style for the dialog box

SetItems: Set a list to be displayed in the dialog box. It is generally used to display several commands.

SetSingleChoiceItems: used to set the dialog box to display a series

SetMultiChoiceItems: used to set a series of check boxes in the dialog box.

SetNeutralButton: normal button

SetPositiveButton: add the "Yes" button to the dialog box.
SetNegativeButton: add the "No" button in the dialog box

Create: create dialog box
Show: show dialog box

2. Customize AlertDialog

GetWindow (). setContentView () is used to set the appearance, such as the exit application dialog box.

 

Activity -- CustomAlertDialog code:

Private void showExitDialog () {final AlertDialog exitDlg = new AlertDialog. builder (this ). create (); exitDlg. show (); // run Window win = exitDlg before adding the content. getWindow (); // set the window content page, which defines the view content in the exit_dlg_layout.xml file win. setContentView (R. layout. exit_dlg_layout); TextView tvMsg = (TextView) win. findViewById (R. id. tvMsg); tvMsg. setText ("do you want to exit the application? "); Button btOk = (Button) win. findViewById (R. id. btOk); Button btCancel = (Button) win. findViewById (R. id. btCancel); // Add an event for the confirmation button and execute the exit Application Operation btCancel. setOnClickListener (new View. onClickListener () {public void onClick (View view) {exitDlg. dismiss (); // close the dialog box}); btOk. setOnClickListener (new View. onClickListener () {public void onClick (View arg0) {finish (); exitDlg. dismiss (); // close the dialog box});} public void onBackPressed () {// press the rollback key to call showExitDialog ();}

Exit_dlg_layout.xml file:

<? Xml version = "1.0" encoding = "UTF-8"?> <RelativeLayout xmlns: android = "http://schemas.android.com/apk/res/android" android: layout_width = "match_parent" android: layout_height = "match_parent" android: padding = "10dp"> <LinearLayout android: layout_width = "match_parent" android: layout_height = "wrap_content" android: orientation = "vertical" android: background = "@ drawable/exit_dlg_shape" android: padding = "5dp"> <TextView android: layout_width = "match_parent" android: layout_height = "30dp" android: gravity = "center" android: textSize = "20sp" android: text = "tip" android: textColor = "#000000"/> <LinearLayout android: layout_width = "match_parent" android: layout_height = "100dp" android: orientation = "vertical" android: background = "# ffffff"> <TextView android: id = "@ + id/tvMsg" android: layout_width = "match_parent" android: layout_height = "match_parent" android: gravity = "center_vertical" android: padding = "5dp"/> </LinearLayout> <LinearLayout android: layout_width = "match_parent" android: padding = "5dp" android: layout_height = "40dp" android: orientation = "horizontal"> <Button android: id = "@ + id/btOk" android: layout_width = "wrap_content" android: layout_height = "wrap_content" android: text = "OK" android: layout_weight = "1" android: background = "@ drawable/comm_shop_detail_top_green" android: layout_marginRight = "2dp"/> <Button android: id = "@ + id/btCancel" android: layout_width = "wrap_content" android: layout_height = "wrap_content" android: text = "cancel" android: layout_weight = "1" android: background = "@ drawable/comm_shop_detail_top_black"/> </LinearLayout> </RelativeLayout>


 

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.