how to change the alertdialog box style in android - android

I am just trying to build a alertdialog for my android application.
what I actually want is a dialog box like this:
whose positive and negative button are filled across dialog box
but I always get something like this:
and these two buttons stick together at the right corner of dialog box
can anybody tell me what to do to change the alertdialog from the second one to first one?
many thanks

For that You need to create custom dilogbox Like this
Dialog xml :
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ImageView
android:id="#+id/image"
android:layout_width="50dp"
android:layout_height="50dp"
android:contentDescription="#drawable/ic_launcher"
android:src="#drawable/ic_launcher" />
<Button
android:id="#+id/button"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:layout_below="#+id/image"
android:layout_centerHorizontal="true"
android:text="Dismiss" />
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_above="#+id/button"
android:layout_toRightOf="#+id/image"
android:gravity="center_vertical"
android:textAppearance="?android:attr/textAppearanceMedium" />
</RelativeLayout>
And In your Activity :
final Dialog dialog = new Dialog(MainActivity.this);
//setting custom layout to dialog
dialog.setContentView(R.layout.cusotm_dialog_layout);
dialog.setTitle("Custom Dialog");
//adding text dynamically
TextView txt = (TextView) dialog.findViewById(R.id.textView);
txt.setText("Put your dialog text here.");
ImageView image = (ImageView)dialog.findViewById(R.id.image);
image.setImageDrawable(getResources().getDrawable(android.R.drawable.ic_dialog_info));
//adding button click event
Button dismissButton = (Button) dialog.findViewById(R.id.button);
dismissButton.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
dialog.dismiss();
}
});
dialog.show();

You can set customized layout to alert dialog by using setView(view) method like this:
AlertDialog.Builder dialogBuilder = new AlertDialog.Builder(this);
LayoutInflater inflater = this.getLayoutInflater();
View dialogView = inflater.inflate(R.layout.alert_layout, null);
dialogBuilder.setView(dialogView);
AlertDialog alertDialog = dialogBuilder.create();
alertDialog.show();

Related

Android Pop Up during opening of Application

I am developing an Android application, where I need to show a popup containing some message on application opening (Image attached for reference).
I have tried to achieve this using toast message and snack bar but could not do exact same.
Please suggest which component in Android to be used to achieve this functionality?
You can achieve the desired results using a dialog. I am sharing the code, you can modify it as you want but make sure you put it inside the onCreate method of the launcher activity.
This is the code for a simple dialog
AlertDialog.Builder builder = new AlertDialog.Builder(this);
builder.setMessage("Look at this dialog!")
.setCancelable(false)
.setPositiveButton("OK", new DialogInterface.OnClickListener() {
public void onClick(DialogInterface dialog, int id) {
//do things
}
});
AlertDialog alert = builder.create();
alert.show();
The one shown in the picture shared by you is a custom dialog where you have to make your own layout. Here is an example,
1. Create your own layout
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ffffffff">
<ImageView
android:layout_width="match_parent"
android:layout_height="120dp"
android:id="#+id/a"
android:gravity="center"
android:background="#DA5F6A"
android:src="#drawable/dialog_cross"
android:scaleType="fitCenter" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TEXT"
android:id="#+id/text_dialog"
android:layout_below="#+id/a"
android:layout_marginTop="20dp"
android:layout_marginLeft="4dp"
android:layout_marginRight="4dp"
android:layout_marginBottom="20dp"
android:textSize="18sp"
android:textColor="#ff000000"
android:layout_centerHorizontal="true"
android:gravity="center_horizontal" />
<Button
android:layout_width="wrap_content"
android:layout_height="30dp"
android:text="OK"
android:id="#+id/btn_dialog"
android:gravity="center_vertical|center_horizontal"
android:layout_below="#+id/text_dialog"
android:layout_marginBottom="20dp"
android:background="#drawable/btn_flat_red_selector"
android:layout_centerHorizontal="true"
android:textColor="#ffffffff" />
</RelativeLayout>
2. Create a class for the custom dialog
public class ViewDialog {
public void showDialog(Activity activity, String msg){
final Dialog dialog = new Dialog(activity);
dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
dialog.setCancelable(false);
dialog.setContentView(R.layout.dialog);
TextView text = (TextView) dialog.findViewById(R.id.text_dialog);
text.setText(msg);
Button dialogButton = (Button) dialog.findViewById(R.id.btn_dialog);
dialogButton.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
dialog.dismiss();
}
});
dialog.show();
}
}
3. Make an object in your launcher activity of the custom dialog class and call the function showDialog
ViewDialog alert = new ViewDialog();
alert.showDialog(getActivity(), "Thank you for installing the Paytm
App");
Or you could use an external library for getting the desired results
Pop.on(this).with().title(R.string.title).layout(R.layout.custom_pop).show();
where R.layout.custom_pop is the custom layout of your dialog.
Try this for same result:
dialog.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="right">
<Button
android:id="#+id/btnClose"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="X" />
</LinearLayout>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:padding="10dp"
android:text="Hello, this is your message"
android:textSize="20sp" />
</LinearLayout>
code:
private void showDialog() {
final Dialog dialog = new Dialog(mContext);
dialog.setContentView(R.layout.dialog);
Window window = dialog.getWindow();
WindowManager.LayoutParams wlp = window.getAttributes();
wlp.gravity = Gravity.BOTTOM;
wlp.flags &= ~WindowManager.LayoutParams.FLAG_DIM_BEHIND;
window.setAttributes(wlp);
dialog.findViewById(R.id.btnClose).setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
dialog.cancel();
}
});
dialog.show();
}

Set an entire xml layout file as the content of an alert dialog

For example, say I have a layout file that is a relative layout and has many buttons and text fields etc etc, and the background is transparent.
Is it possible to use this file as the content for a alert dialog (or some sort of pop up) so when I create the dialog, the layout contents will show? Also, I want the background to still be shown, that is why I've declared the layout file's background as transparent.
Is this possible to implement, if so, how can I do it?
You can do it easily:
Dialog dialog = new Dialog(context);
dialog.setContentView(R.layout.custom_dlg);
dialog.setTitle("Custom dialog");
And you are done. You can refer this tutorial for more details.
Yes you can create custom dialogs in android. below is the code snippet you would need to do this.
Custom dialog xml file: custom.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ImageView
android:id="#+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"/>/>
<Button
android:id="#+id/dialogButtonOK"
android:layout_width="100px"
android:layout_height="wrap_content"
android:text=" Ok "
android:layout_marginTop="5dp"
android:layout_marginRight="5dp"
android:layout_below="#+id/image"
/>
</RelativeLayout>
Simple main activity xml with a button: 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>
And once you have set this up in your MainActivity.java file you can click the button and popup the custom dialog as following,
In your MainActivity.java file
public void onClick(View arg0) {
// custom dialog
final Dialog dialog = new Dialog(context);
dialog.setContentView(R.layout.custom);
dialog.setTitle("Title...");
// set the custom dialog components - text, image and button
TextView text = (TextView) dialog.findViewById(R.id.text);
text.setText("Android custom dialog example!");
ImageView image = (ImageView) dialog.findViewById(R.id.image);
image.setImageResource(R.drawable.ic_launcher);
Button dialogButton = (Button) dialog.findViewById(R.id.dialogButtonOK);
// if button is clicked, close the custom dialog
dialogButton.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
dialog.dismiss();
}
});
dialog.show();
}
});

Create a AlertDialog in Android with custom xml view

How to create a dialog like this in Android?
My idea is to create a custom xml view and inflate it into the dialog.
any other suggestions?
and what is the "drag line" at the middle of the dialog called? I really need that.
Thanks in advance
Try below code for your reference:
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>
dialog.xml: Make design whatever you want in dialog.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ImageView
android:id="#+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"/>/>
<Button
android:id="#+id/dialogButtonOK"
android:layout_width="100px"
android:layout_height="wrap_content"
android:text=" Ok "
android:layout_marginTop="5dp"
android:layout_marginRight="5dp"
android:layout_below="#+id/image"
/>
</RelativeLayout>
MainActivity:
public class MainActivity extends Activity {
final Context context = this;
private Button button;
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
button = (Button) findViewById(R.id.buttonShowCustomDialog);
// add button listener
button.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View arg0) {
// custom dialog
final Dialog dialog = new Dialog(context);
dialog.setContentView(R.layout.dialog);
dialog.setTitle("Title...");
// set the custom dialog components - text, image and button
TextView text = (TextView) dialog.findViewById(R.id.text);
text.setText("Android custom dialog example!");
ImageView image = (ImageView) dialog.findViewById(R.id.image);
image.setImageResource(R.drawable.ic_launcher);
Button dialogButton = (Button) dialog.findViewById(R.id.dialogButtonOK);
// if button is clicked, close the custom dialog
dialogButton.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
dialog.dismiss();
}
});
dialog.show();
}
});
}
}
Create Alert Dialog and Inflate Custom Layout and set layout to your Alert Dialog.
Here is the link for some demo examples for reference
http://examples.javacodegeeks.com/android/core/ui/dialog/android-custom-dialog-example/
http://www.mkyong.com/android/android-custom-dialog-example/
and drag line is called as Progress Bar/Seek Bar in android. You can add this into your layout and handle it's progress.
I think this is the standard dialog for android if you are using the Holo theme. You just need to use the holo theme for your application and it should work.
Add this to your application tag in your manifest file
android:theme="#android:style/Theme.Holo"

How to show same sized dialog in different screen sized devices

I have created a fixed size dialog in my application. While i tested with a phone of 240x320 pixel size, it shows perfect. But it shows not proper in a tablet. see the images below
image from phone
image from tab
i tried with below code
public void showDialog(){
// Create custom dialog object
final Dialog dialog = new Dialog(MainActivity.this);
// Include dialog.xml file
dialog.setContentView(R.layout.dialog);
// Set dialog title
dialog.setTitle("Custom Dialog");
// set values for custom dialog components - text, image and button
TextView text = (TextView) dialog.findViewById(R.id.textDialog);
text.setText("Custom dialog Android example.");
ImageView image = (ImageView) dialog.findViewById(R.id.imageDialog);
image.setImageResource(R.drawable.ic_launcher);
dialog.show();
dialog.getWindow().setLayout(180, 150);
Button declineButton = (Button) dialog.findViewById(R.id.declineButton);
// if decline button is clicked, close the custom dialog
declineButton.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
// Close dialog
dialog.dismiss();
}
});
}
dialog.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ImageView
android:id="#+id/imageDialog"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="6dp" />
<TextView
android:id="#+id/textDialog"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textColor="#FFF"
android:layout_toRightOf="#+id/imageDialog"/>
<Button
android:id="#+id/declineButton"
android:layout_width="100px"
android:layout_height="wrap_content"
android:text=" Submit "
android:layout_marginTop="5dp"
android:layout_marginRight="5dp"
android:layout_below="#+id/textDialog"
android:layout_toRightOf="#+id/imageDialog"
/>
</RelativeLayout>
how to solve this ?
thank in advance
Finally i found the solution
I removed the lines dialog.setTitle("Custom Dialog"); and dialog.getWindow().setLayout(180, 150); lines and added dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
Corrected code as follow
public void showDialog(){
// Create custom dialog object
final Dialog dialog = new Dialog(MainActivity.this);
// Include dialog.xml file
dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
dialog.setContentView(R.layout.dialog);
// set values for custom dialog components - text, image and button
TextView text = (TextView) dialog.findViewById(R.id.textDialog);
text.setText("Custom dialog Android example.");
ImageView image = (ImageView) dialog.findViewById(R.id.imageDialog);
image.setImageResource(R.drawable.ic_launcher);
dialog.show();
Button declineButton = (Button) dialog.findViewById(R.id.declineButton);
// if decline button is clicked, close the custom dialog
declineButton.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
// Close dialog
dialog.dismiss();
}
});
}
I made another change in layout file. Replaced to and lines android:layout_width="fill_parent" android:layout_height="fill_parent" to android:layout_width="180dp" android:layout_height="150dp"
Corrected layout as follows
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="180dp"
android:layout_height="150dp" >
<ImageView
android:id="#+id/imageDialog"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="6dp" />
<TextView
android:id="#+id/textDialog"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#FFF" />
<Button
android:id="#+id/declineButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" Submit "
android:layout_marginTop="5dp"
android:layout_marginRight="5dp"
/>
</LinearLayout>

How can I create my own theme for alertDialog?

I want to create a different theme for all of alertDialog instances. I need my own title view instead of the usual black title background. All text should have a blue color, and set the edge of the alertDialog to a round shape.
Is it possible to create our own theme for alert dialogs, using any style or creating a class which extends AlertDialog.Builder? I need a common theme or style for my all instances of alertDialog. I am using alertDialog in many places - one for singleChoice items, one with ArrayAdapter.
My alertDialog with array adapter:
String[] items = {"Edit profile","Change user","Change password","Logout"};
ArrayAdapter<String> adapter = new ArrayAdapter<String>(Loged.this,
R.layout.my_spinner_layout, items);
settingMenu.setAdapter(adapter, listener);
My alertDialog with single choice items:
alertDelete = new AlertDialog.Builder(getParent());
alertDelete.setTitle("Delete");
alertDelete.setCancelable(true);
CharSequence[] choice = {"this user","All user"};
alertDelete.setSingleChoiceItems(choice, 0,
For my all alertDialog, I need a common theme, like:
please check this link. here am creating my own alertDialog class
and its a simple method if you reuse the alertDialog in many situation in your application
how Create setAdapter() for a AlertDialog
I solved my problem by creating a class which extends Dialog, and I created my own functions. for example setMessage,setTitle,setPositiveButton,setNegativeButton etc.
But am confusing on how we can replace the setAdapter() and setSingleChoice().
Here one example For Dialog:
button = (Button) findViewById(R.id.button1);
button.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View arg0) {
// custom dialog
final Dialog dialog = new Dialog(context);
dialog.setContentView(R.layout.custom);
dialog.setTitle("Give a Title...");
// set the custom dialog components - text, image and button
TextView text = (TextView) dialog.findViewById(R.id.text);
text.setText("Put here any custom text!");
ImageView image = (ImageView) dialog.findViewById(R.id.image);
image.setImageResource(R.drawable.ic_launcher);
Button dialogButton = (Button) dialog.findViewById(R.id.ButtonOK);
// if button is clickedthen dialog will closed
dialogButton.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
dialog.dismiss();
}
});
dialog.show();
}
});
Custom AlertDialog
AlertDialog.Builder builder;
AlertDialog alertDialog;
Context mContext;
LayoutInflater inflater = (LayoutInflater)mContext.getSystemService(LAYOUT_INFLATER_SERVICE);
View urlayoutfile = inflater.inflate(R.layout.custom_dialog_xmlfile,(ViewGroup)findViewById(R.id.Yourlayout_id));
builder = new AlertDialog.Builder(this);
builder.setView(urlayoutfile);
alertDialog = builder.create();
alertDialog.show();
To use a specific style, use
ctw = new ContextThemeWrapper(this, R.style.MyStyle);
new AlertDialog.Builder(ctw)
.setTitle(...)
You can use layout as Different themes, styles, Backgrounds
customdialog.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/relativeLayout1"
style="#android:style/Theme.Black.NoTitleBar.Fullscreen"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<LinearLayout
android:id="#+id/layoutsample"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:orientation="vertical" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/dialoghdrbg"
android:orientation="horizontal" >
<ImageView
android:id="#+id/dialogheaderimage1"
android:layout_width="50dp"
android:layout_height="48dp"
android:scaleType="fitXY"
/>
<TextView
android:id="#+id/dialogheadertext1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical|right"
android:layout_marginLeft="1dp"
android:gravity="center_vertical|right"
android:textColor="#000000"
android:textSize="25dp"
android:textStyle="bold" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/dialogcontentbg"
android:orientation="vertical" android:gravity="center">
<TextView
android:id="#+id/dialogmessgetext1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:textColor="#ffffff"
android:textSize="23dp"
android:text=""
android:gravity="center"
/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center|center_horizontal"
android:gravity="center|center_horizontal"
android:layout_marginTop="20dip"
android:orientation="horizontal">
<Button
android:id="#+id/dialogokbutton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="15dp"
android:background="#drawable/buttonanimation"
android:text="Retry"
android:textSize="20dp"
android:textStyle="bold" />
<Button
android:id="#+id/dialogcancelbutton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:background="#drawable/buttonanimation"
android:text="Report"
android:textSize="20dp"
android:textStyle="bold" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
customDialog.java
final Dialog favDialog = new Dialog(Myclass.this,
android.R.style.Theme_Translucent_NoTitleBar_Fullscreen);
favDialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
favDialog.getWindow().setFlags(
WindowManager.LayoutParams.FLAG_FULLSCREEN,
WindowManager.LayoutParams.FLAG_FULLSCREEN);
favDialog.setContentView(R.layout.reloadurlpopuplayout);
favDialog.setCancelable(false);
ImageView dialogImage = (ImageView) favDialog
.findViewById(R.id.dialogheaderimage1);
dialogImage.setBackgroundResource(R.drawable.questionmark);
TextView dialogMesage = (TextView ) favDialog
.findViewById(R.id.dialogmessgetext1);
TextView dialogHeader = (TextView) favDialog
.findViewById(R.id.dialogheadertext1);
String descText = getString(R.string.RetryReportMessage);
dialogMesage.setBackgroundColor(0x00000000);
dialogMesage.setText(descText);
dialogHeader.setText(R.string.BrockenLinkHeader);
try {
favDialog.show();
} catch (Exception e) {
// TODO Auto-generated catch block
e.printStackTrace();
}

Categories

Resources