Eclipse Dialog Box App (EDBA)


EDBA:   SOLD       



Bismillahirrahmanirrahim.. Thank God I pray to the presence of Allah SWT thanks to His guidance, guidance and inayah I can write again about Android Programming. This ebook is my second writing after the first ebook which contains about Learning Layout in Android Programming. In this second ebook will be discussed about Dialog Box which is included with the example program so you can practice it directly.


1. Getting to know Dialog Boxes

Hopefully this ebook is useful and can be used as a reference by KSL Pamekasan friends and by the general public who are starting to tread Android programming. Amen.

Substance

  1. Getting to Know Dialog Boxes
  2. Toast Dialog Box 
  3. List Dialog Box 
  4. Alert Dialog Box

1. Getting to know Dialog Boxes 

Here I do not give an explicit definition of dialog box. Later you can define yourself what a dialog box is. What is certain is that you have often met with this dialog box in various applications. Try to look at the picture above.

The box that says "Are you sure you want to exit?" is what is called a dialog box. Now you can define yourself what a dialog box is. It's up to you how you want to define it. The important thing is that after you study the contents of this ebook, you can create a dialog box like the one shown in the image above in Android programming. The dialog boxes that we will learn in Android programming now are three types, namely Alert Dialog, Toast Dialog and List Dialog. What are the three types of dialog boxes like, let's study them one by one so that you are not just curious.

Please run your weapons. Those who use eclipse, please run eclipse. Those who use android studio, please run android studio. Don't forget to play your favorite song, Prepare your favorite drink, favorite food and a pack of cigarettes for those who smoke to keep it relaxed. Just don't prepare your girlfriend beside you. Because it will really disturb your concentration in studying  😃 😃. Ok. So that it doesn't take long, let's just get started. Check it out .. 😃

2. Toast Dialog

In this first part we will learn about toast dialog. Do you know what a toast dialog looks like? For those who don't know, please look at the image below:


Toast Dialog

Let me explain first about the simple program example in the image above. In the image there are two buttons, namely the Yes and No buttons. Now, when you click the Yes or No button, then at the bottom there will be a notification of which button you clicked. That notification is called the Toast Dialog. Do you understand? If so, let's continue with the steps to create it.

Steps to Create a Toast Dialog

  1. Create a new project in the editor you are using and please fill in the Application name and others as you wish. I assume you can already create a new project, so I don't need to explain in detail.
  2. Open and edit the string.xml file located in the /res/values/string.xml folder. Look at the following image:


edit string.xml file

Please edit it as follows:


xml string script

Next, edit the layout. Open the XML file located in /res/layout/. Look at the following image:


xml layout file

Please edit it as follows:


xml layout file script

After that, please edit the java file located in the /src folder. See the following image:


java main file

Please edit it as follows:


java main file script

After the editing process is complete, please run it and see the results. Hopefully there are no errors. If there are errors, pay attention to the source code again.

Explanation  

  • The code "Button btnYes" and "Button btnNo" are declarations of Button objects.
  • The following code snippet:


button code

  • It is a synchronization of the declared button object with the button widget in the layout based on the button widget id. And the following code snippet:


onClick toast

This is the method/action when the Yes and No buttons are clicked.

3. Dialog List 

In the previous section we have learned about Toast Dialog. Next we will learn about List Dialog. What does this List Dialog look like? Please pay attention to the following image:


3. Dialog List

In the example program above, there is a button that when clicked will display a dialog containing several sports lists. That dialog is called the List Dialog. Ok, can you understand it now? Next, we go straight to the steps on how to create a List Dialog like the picture above.

Steps to Create a Dialog List

1. Create a new project as usual

2. Open and edit the string.xml file located at /res/values/string.xml. Edit it as follows:


dialog list xml string file

3. Open and edit the layout XML file located in /res/layout. Edit it as follows:


dialog list xml layout file

4. Once edited, continue by editing the java file located in /src. Edit it as follows:


java file list dialog

5. After everything is finished, please run the program and see the results.

4. Alert Dialog

We have passed the Toast Dialog and List Dialog. In this section we will play around with the alert dialog. The alert dialog display is as shown in the image on the Getting to Know Dialog Box page. So that you don't have to scroll up again, I will give you another alert dialog display. Here it is 😃


4. Alert Dialog

In the example program above, we will create two buttons, namely the Login and Exit buttons. When the exit button is clicked, a dialog will appear asking "Are you sure you want to exit"? Well, that dialog is called an alert dialog. To create an example program like the picture, follow the steps!

Steps to Create an Alert Dialog

1. The first step is as usual, you create a new project again 2,

2. Edit string.xml to be as follows:


Edit string.xml alert dialog

3. After that, edit the layout to be as follows:


layout xml alert dialog

4. Next, edit the Java file to be as follows:


java alert dialog file


java file alert dialog next


java file alert dialog 2nd next

4. After that run the program and see the results.


In an application, a dialog box is an interactive tool between the user and the application itself. For example, if we want to exit the application, a warning usually appears containing the question "Are you sure to quit?" and there are "yes" and "cancel" buttons. In this section, we implement 3 types of dialogs, namely

  • Toast
  • ListDialog 
  • AlertDialog

The final result of this project looks like figure 5.2. Okay, let's practice it right away, okay?!


Figure 5.2. Final result of the Dialog Box project 

1. Create a new project

| Project name     | DialogBox    |
|------------------|--------------|
| Build Target     | Android 2.2  |
| Application name | Kotak Dialog |
| Package name     | com.dialog   |
| Create Activity  | KotakDialog  |
| Min SDK version  | 8            |

2. Add 3 string elements to Strings.xml

<string name="app_name">Membuat Kotak Dialog</string>
<string name="toastTextBtn">Panggil Toast</string>
<string name="exitTextBtn">Keluar Applikasi</string>
<string name="listDialogTextBtn">Panggil List Dialog</string>
</resources>

3. First create the layout via Main.xml

<?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">
<Button android:layout_width="fill_parent"
android:id="@+id/toastBtn"
android:layout_height="wrap_content"
android:text="@string/toastTextBtn"></Button>
<Button android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="@+id/listDialogBtn"
android:text="@string/listDialogTextBtn"></Button>
<Button android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/exitTextBtn"
android:id="@+id/exitBtn"></Button>
</LinearLayout>

4. Okay, now it's time to write code in the DialogBox.java activity.

package com.dialog;
import android.app.Activity;
import android.app.AlertDialog;
import android.content.DialogInterface;
import android.os.Bundle;
import android.widget.Button;
import android.widget.Toast;
import android.view.View;
public class KotakDialog extends Activity implements
OnClickListener {
Button pesanToast;
Button keluar;
Button tampilList;
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
pesanToast = (Button) findViewById(R.id.toastBtn);
pesanToast.setOnClickListener(this);

keluar = (Button) findViewById(R.id.exitBtn);
keluar.setOnClickListener(this);

tampilList = (Button)
findViewById(R.id.listDialogBtn);
tampilList.setOnClickListener(this);
}

public void onClick(View clicked) {
switch (clicked.getId()) {
case R.id.listDialogBtn:
munculListDialog();
break;
 case R.id.toastBtn:
 Toast.makeText(this, "Kamu memilih Toast",
 Toast.LENGTH_SHORT).show();
 break;
 case R.id.exitBtn:
 exit();
 break;
 }
}

private void munculListDialog() {
 // TODO Auto-generated method stub
final CharSequence[] items = { "Es Teh", "Es Jeruk",
"Lemon Squash","Soft Drink" };
AlertDialog.Builder kk = new AlertDialog.Builder(this);
kk.setTitle("Pilih Minuman");
kk.setItems(items, new DialogInterface.OnClickListener() {
public void onClick(DialogInterface dialog, int item) {
 Toast.makeText(getApplicationContext(), items[item],
 Toast.LENGTH_SHORT).show();
 }
}).show();
}

private void exit() {
AlertDialog.Builder builder = new AlertDialog.Builder(this);
builder.setMessage("Apakah Kamu Benar-Benar ingin keluar?")
 .setCancelable(false)
 .setPositiveButton("Ya", new
DialogInterface.OnClickListener() {
public void onClick(DialogInterface dialog,
int id) {
 KotakDialog.this.finish();
 }
 })
 .setNegativeButton("Tidak",new
DialogInterface.OnClickListener() {
@Override
 public void onClick(DialogInterface dialog,
    int arg1) {
 // TODO Auto-generated method stub
 dialog.cancel();
 }

}
}
}).show();

Well, it's done. Please run it, hopefully there will be no errors.

Program Discussion

Pay attention to DialogBox.java, I divided it into 5 blocks which have their own roles.

  1. Lines 12-14: Button object declaration.
  2. Lines 19-30: synchronize the object with the button widget in the main.xml layout while activating the button. 
  3. Lines 33-45: the function of each button. 
  4. Lines 48-61: functions that are called when the „call list dialog‟ button is clicked. 
  5. Lines 63-83: functions called when the „exit application‟ button is clicked.

This activity implements the OnClickListener class (lines 11-12). This class has an onClick method (lines 33-45) that is responsible for responding to a button when it is clicked. In the onClick() method, the button is responded to based on its id through a switch-case loop. If the button with the id „listDialogBtn‟ is clicked, then it calls the munculListDialog() function (lines 58-61), if the button with the id „toastBtn‟ is clicked, then the activity generates a toast, while if the button with the id „exitBtn‟ is clicked, then the exit() function is executed (lines 63-83).

Explanation

The code "public void onClick (View clicked)" is a method that controls the action when the button is clicked. If the Login button is clicked, the "tampilDialog()" method will be executed. The munculDialog() method will display an alert dialog. If you click the exit button, the "exit()" method will be executed. The exit() method will display a dialog like the one in the picture. When you click "Yes", the "DemoAlert2.this.finish()" code will be executed, which will close the program. And if you click the no button, the "show()" code will be executed, which will display the program again, aka not exit the program.

Note: DemoAlert2 is a java class name. So, you can change it according to the class name you have.

Closing  

Alhamdulillah, I can finish this second ebook. Hopefully it can be an additional reference material for all of us. If the readers find any mistakes in this ebook, I ask you to inform me so that I can revise it. Or maybe there are criticisms, suggestions or testimonials regarding this ebook, please send them through my contact. That's all from me, more or less I apologize. Thank you


Post a Comment

Previous Next

نموذج الاتصال