Skip to main content

Alerts : Material Design Tips

From Google material design documentation
Alerts are urgent interruptions, requiring acknowledgement, that inform the user about a situation.

How to add?

I. In your build.gradle add latest appcompat library.
dependencies {  
    compile 'com.android.support:appcompat-v7:X.X.X' // where X.X.X version
}
II. Make your activity extend android.support.v7.app.AppCompatActivity.
public class MainActivity extends AppCompatActivity {  
    ...
}
III. To create your dialog use android.support.v7.app.AlertDialog.Builder.
private void showLocationDialog() {  
    AlertDialog.Builder builder = new AlertDialog.Builder(MainActivity.this);
    builder.setTitle(getString(R.string.dialog_title));
    builder.setMessage(getString(R.string.dialog_message));

    String positiveText = getString(android.R.string.ok);
    builder.setPositiveButton(positiveText,
            new DialogInterface.OnClickListener() {
        @Override
        public void onClick(DialogInterface dialog, int which) {
            // positive button logic
        }
    });

    String negativeText = getString(android.R.string.cancel);
    builder.setNegativeButton(negativeText,
            new DialogInterface.OnClickListener() {
        @Override
        public void onClick(DialogInterface dialog, int which) {
            // negative button logic
        }
    });

    AlertDialog dialog = builder.create();
    // display dialog
    dialog.show();
}

How to style?

I. Declare custom drawable.xml for dialog background.
<?xml version="1.0" encoding="utf-8"?>  
<!-- From: support/v7/appcompat/res/drawable/abc_dialog_material_background_light.xml -->  
<inset xmlns:android="http://schemas.android.com/apk/res/android"  
    android:insetLeft="16dp"
    android:insetTop="16dp"
    android:insetRight="16dp"
    android:insetBottom="16dp">

    <shape android:shape="rectangle">
        <corners android:radius="2dp" />
        <solid android:color="@color/indigo" />
    </shape>

</inset>  
II. Declare custom styles in your styles.xml file.
<style name="MyDialogTheme" parent="Theme.AppCompat.Light.Dialog.Alert">  
    <!--buttons color-->
    <item name="colorAccent">@color/pink</item>
    <!--title and message color-->
    <item name="android:textColorPrimary">@android:color/white</item>
    <!--dialog background-->
    <item name="android:windowBackground">@drawable/background_dialog</item>
</style>  
III. Create your dialog and use style as parameter in AlertDialog.Builder.
AlertDialog.Builder builder =  
        new AlertDialog.Builder(this, R.style.MyDialogTheme);
...
AlertDialog dialog = builder.create();  
// display dialog
dialog.show();  
You can also style dialog in your activity theme via alertDialogTheme attribute.

Comments

Popular posts from this blog

Android Basic Tutorial : Get the Current Date and Time

Here’s a code snipped to get the current date and/or time. This snipped uses the Calendar object (java.util.Calendar) which is a useful class when working with dates.






//Get a calendar object for the current date and time Calendar CurrentDateTime = Calendar.getInstance();
//Example: Get current day of the month

Switch : Material Design Tips

From google material design documentation.
On/off switches toggle the state of a single settings option. The option that the switch controls, as well as the state it’s in, should be made clear from the corresponding inline label. Switches take on the same visual properties of the radio button.
The on/off slide toggle with the text “on” and “off” included within the asset is deprecated. Use the switch shown here instead. How to add? I. In your build.gradle add latest appcompat library. dependencies { compile 'com.android.support:appcompat-v7:X.X.X'// where X.X.X version} II. Make your activity extend android.support.v7.app.AppCompatActivity. publicclassMainActivityextendsAppCompatActivity{...} III. Declare your SwitchCompat inside any layout.xml file <android.support.v7.widget.SwitchCompatandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:checked="true"/> SwitchCompat is a backward compatible version of the Switc…