Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Style attributes of custom styled AlertDialog

I am trying to style my AlertDialog and I have been able to change most of it through styles and xml declarations... but there are still a few issues:

  1. How do I change the area around the title bar from black to my custom color?
  2. How do I change the outer background to transparent (the outside part that is blue the the shadow drops upon)
  3. How do I change the buttons so they do not overlap the black border around the alert message?

The AlertDialog

here is the function I have in my RootActivity (my activities extend this one)

public static void showNoConnectionDialog(Context ctx1) {
    final Context ctx = ctx1;
    LayoutInflater factory = LayoutInflater.from(ctx);
    AlertDialog.Builder builder = new AlertDialog.Builder(new ContextThemeWrapper(ctx, R.style.SetdartDialog));
    builder.setView(factory.inflate(R.layout.alert_dialog, null))
    .setIcon(R.drawable.icon)
    .setCancelable(true)
    .setMessage(R.string.check_wireless_settings)
    .setTitle(R.string.no_connection)
    .setPositiveButton(R.string.myes, new DialogInterface.OnClickListener() {
        public void onClick(DialogInterface dialog, int which) {
            ctx.startActivity(new Intent(Settings.ACTION_WIRELESS_SETTINGS));
        }
    })
    .setNegativeButton(R.string.mno, new DialogInterface.OnClickListener() {
        public void onClick(DialogInterface dialog, int which) {
            return;
        }
    })
    .setOnCancelListener(new DialogInterface.OnCancelListener() {
        public void onCancel(DialogInterface dialog) {
            return;
        }
    })
    .show();
}

here a snippet from styles.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="Theme.WhiteBackground" parent="android:Theme">
        <item name="android:windowBackground">@null</item>
        <item name="android:background">@android:color/white</item>
        <!-- Dialog attributes
        <item name="alertDialogStyle">@style/AlertDialog</item>  -->
    </style>
    <style name="SetdartDialog">
            <item name="android:background">@color/sd_blue</item> <!-- MUST HAVE with white bg-->
            <!--<item name="android:windowBackground">@color/sd_blue</item> -->
            <!--<item name="android:windowBackground">@color/transparent</item> needed with white bg ? -->
            <item name="android:windowFrame">@color/transparent</item><!-- not sure what this changes-->
            <item name="android:textColor">@android:color/black</item>
            <item name="android:windowNoTitle">true</item>
            <item name="android:textSize">10sp</item>
            <item name="android:windowIsFloating">true</item>
            <item name="android:windowContentOverlay">@color/transparent</item>
            <item name="android:windowTitleStyle">@style/setwindowTitleStyle</item>
            <item name="android:windowAnimationStyle">@android:style/Animation.Dialog</item>
            <item name="android:windowSoftInputMode">stateUnspecified|adjustPan</item>
            <item name="android:backgroundDimEnabled">true</item>
            <item name="android:gravity">center_vertical|center_horizontal</item>
        <!--<item name="android:colorBackgroundCacheHint">@android:color/white</item>-->
        </style>
        <style name="setwindowTitleStyle">
            <item name="android:textColor">@android:color/white</item>
            <item name="android:background">@color/sd_blue</item>
        </style>
</resources>

Also R.layout.alert_dialog

<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/screen"
    android:layout_width="wrap_content" android:layout_height="wrap_content"
    android:orientation="vertical"
    >
    <LinearLayout
        android:layout_width="wrap_content" android:layout_height="wrap_content"
        android:orientation="vertical">
    </LinearLayout>
</ScrollView>
like image 533
Traveling_Monk Avatar asked Sep 04 '11 21:09

Traveling_Monk


People also ask

How do I customize alert dialog?

Creating a Custom Layout If you want a custom layout in a dialog, create a layout and add it to an AlertDialog by calling setView() on your AlertDialog. Builder object. By default, the custom layout fills the dialog window, but you can still use AlertDialog. Builder methods to add buttons and a title.

What is the significance of AlertDialog builder?

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.

How many types of dialogs are there in android?

Explain. Android supports 4 dialog boxes: AlertDialog : An alert dialog box supports 0 to 3 buttons and a list of selectable elements, including check boxes and radio buttons.

How many button options can you use in creating AlertDialog?

An alert dialog can have maximum three action buttons. If you want the user to accept the action, use Positive action button. It is normally displayed as OK/YES. If the user wants to cancel the action , then you can use Negative action button (NO).


1 Answers

Create your custom layout with all these attributes you've mentioned. Use Dialog instead of AlertDialog, inflate the layout you have created, use the Dialog object to set the inflated layout. If you haven't been introduced to inflating service, do some research. After you are clear with inflating, remember that all the components of the dialog you access with the View object, that you have created with the inflating. The rest (like click listeners) remains to be done on usual way. Cheers. I hope it helps.

like image 159
Nikola Despotoski Avatar answered Nov 21 '22 03:11

Nikola Despotoski