Android app development session-3

1. Android Application
Development Session-3
From Beginner to Advanced
By: Ahesanali Suthar
email:ahesanali.suthar@gmail.com

2. Topics Covered
1.
Menu
2.
Dialog

3. 1. Menu
●
Android app have basically 3 types of menu.
a. Option Menu
b. Context Menu
c. Popup Menu.

4. 1.Menu
1. Option Menu : The options menu is where you should include actions and
other options that are relevant to the current activity context, such as "Search,"
"Compose email," and "Settings."
● To specify the options menu for an activity, override
onCreateOptionsMenu() (fragments provide their own
onCreateOptionsMenu() callback). In this method, you can inflate your
menu resource (defined in XML) into the Menu provided in the callback.
For example:
@Override
public boolean onCreateOptionsMenu(Menu menu) {
MenuInflater inflater = getMenuInflater();
inflater.inflate(R.menu.game_menu, menu);
return true;
}

5. 1. Menu
●
Menu item xml:
game_menu.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@+id/new_game"
android:icon="@drawable/ic_new_game"
android:title="@string/new_game"
android:showAsAction="ifRoom"/>
<item android:id="@+id/help"
android:icon="@drawable/ic_help"
android:title="@string/help" />
</menu>

6. 1.Menu
Handling click event for Menu.
@Override
public boolean onOptionsItemSelected(MenuItem item) {
// Handle item selection
switch (item.getItemId()) {
case R.id.new_game:
newGame();
return true;
case R.id.help:
showHelp();
return true;
default:
return super.onOptionsItemSelected(item);
}
}

7. 1. Menu
2. Context Menu : A contextual menu offers actions that affect a specific item
or context frame in the UI. You can provide a context menu for any view, but
they are most often used for items in a ListView, GridView, or other view
collections in which the user can perform direct actions on each item.
@Override
public void onCreateContextMenu(ContextMenu menu, View v,
ContextMenuInfo menuInfo) {
super.onCreateContextMenu(menu, v, menuInfo);
MenuInflater inflater = getMenuInflater();
inflater.inflate(R.menu.context_menu, menu);
}
●
for display meu items you need to create context_menu.xml
same way you careted for option menu.
●
for click Handeling
onContextItemSelected(MenuItem item)

8. 1. Menu
3. Popup Menu : Providing an overflow-style menu for actions that relate to
specific content. It appears below the anchor view if there is room, or above the
view otherwise
● here's a button with the android:onClick
attribute that shows a popup menu:
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/ic_overflow_holo_dark"
android:contentDescription="@string/descr_overflow_button"
android:onClick="showPopup" />
●
The activity can then show the popup menu like this:
public void showPopup(View v) {
PopupMenu popup = new PopupMenu(this, v);
MenuInflater inflater = popup.getMenuInflater();
inflater.inflate(R.menu.actions, popup.getMenu());
popup.show();
}

9. 2.Dialog
●
We will see three types of dialog that is used in android app.
a. Alert Dialog
b. Progress Dialog
c. Custom Dialog

10. 2.Dialog
1. Alert Dailog: The AlertDialog class allows you to build a variety of dialog
designs and is often the only dialog class you'll need. As shown in figure 2,
there are three regions of an alert dialog.
1.Title
This is optional and should be used only when
the content area is occupied by a detailed
message, a list, or custom layout. If you need to
state a simple message or question (such as the
dialog in figure 1), you don't need a title.
2. Content area
This can display a message, a list, or other
custom layout.
3. Action buttons
There should be no more than three action buttons in a dialog.

11. 2. Dialog
●
To build alert diloag:
// 1. Instantiate an AlertDialog.Builder with its constructor
AlertDialog.Builder builder = new AlertDialog.Builder(getActivity());
// 2. Chain together various setter methods to set the dialog characteristics
builder.setMessage(R.string.dialog_message)
.setTitle(R.string.dialog_title);
//3. Add the buttons
builder.setPositiveButton(R.string.ok, new DialogInterface.OnClickListener() {
public void onClick(DialogInterface dialog, int id) {
// User clicked OK button
} });
builder.setNegativeButton(R.string.cancel, new DialogInterface.OnClickListener() {
public void onClick(DialogInterface dialog, int id) {
// User cancelled the dialog
// 4. Get the AlertDialog from create()
AlertDialog dialog = builder.create();
} });

12. 2.Dialog
2. Progress Dialog: Android includes another dialog class called
ProgressDialog that shows a dialog with a progress bar. However, if you need
to indicate loading or indeterminate progress.
●
To create progress dialog:
ProgressDialog pDialog = new ProgressDialog(context);
pDialog.setMessage(message);
pDialog.setIndeterminate(false);
pDialog.setCancelable(true);
pDialog.show();
●
To dismiss progress dialog:
pDialog.dismiss();

13. 2.Dialog
3. Custom Dialog: To develop a custom dialog in app we have to use Dialog
class and custom layout xml design for the dialog
content.
●
Let see how to develop the custom dialog as
seen in the right side image.

14. 2.Dialog
●
●
Two XML files, one for main screen, one for custom dialog.
Main.xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<Button
android:id="@+id/buttonShowCustomDialog"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Show Custom Dialog" />
</LinearLayout>

15. 2.Dialog
●
custom.xml
<Button
android:id="@+id/dialogButtonOK"
<?xml version="1.0" encoding="utf-8"?>
android:layout_width="100px"
<RelativeLayout xmlns:android="http://schemas.android.
android:layout_height="wrap_content"
com/apk/res/android" android:layout_width="fill_parent"
android:text=" Ok "
android:layout_height="fill_parent" >
android:layout_marginTop="5dp"
<ImageView
android:layout_marginRight="5dp"
android:id="@+id/image"
android:layout_below="@+id/image"
android:layout_width="wrap_content"
/>
android:layout_height="wrap_content"
android:layout_marginRight="5dp" />
<TextView
android:id="@+id/text"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textColor="#FFF"
android:layout_toRightOf="@+id/image"/>/>
</RelativeLayout>

16. 2.Diaog
●
Activity Code:
public class MainActivity extends Activity {
TextView text = (TextView) dialog.findViewById(R.id.text);
text.setText("Android custom dialog example!");
final Context context = this;
ImageView image = (ImageView) dialog.findViewById(R.id.
private Button button;
image);
public void onCreate(Bundle savedInstanceState) {
drawable.ic_launcher);
image.setImageResource(R.
super.onCreate(savedInstanceState);
Button dialogButton = (Button) dialog.findViewById(R.id.
setContentView(R.layout.main);
dialogButtonOK);
button = (Button) findViewById(R.id.
dialogButton.setOnClickListener(new OnClickListener() {
buttonShowCustomDialog);
@Override
// add button listener
public void onClick(View v) {
button.setOnClickListener(new
dialog.dismiss();
OnClickListener() {
}
@Override
public void onClick(View arg0) {
// custom dialog
});
dialog.show();}
final Dialog dialog = new Dialog(context);
});
dialog.setContentView(R.layout.
custom);
}
}

17. Questions?