I am trying to find an example code to implement a material dialog with full width buttons as shown in the screenshot below.
Can someone help by sharing example code on how to replicate this design?
You could achieve that with using ONLY AppCompat, check my workaround:
Code
import android.support.v7.app.AlertDialog;
AlertDialog.Builder builder;
builder = new AlertDialog.Builder(context, R.style.StackedAlertDialogStyle);
builder.setTitle("Title");
builder.setMessage("Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dignissim purus eget gravida mollis. Integer in auctor turpis. Morbi auctor, diam eget vestibulum congue, quam arcu pulvinar dui, blandit egestas erat enim non ligula." +
" Nunc quis laoreet libero. Aliquam consectetur nibh eu arcu eleifend efficitur.");
builder.setPositiveButton("Positive Button", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
}
});
builder.setNeutralButton("Neutral Button", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
}
});
builder.setNegativeButton("Cancel Button", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
}
});
AlertDialog alertDialog = builder.create();
alertDialog.show();
try{
final Button button = alertDialog.getButton(AlertDialog.BUTTON_POSITIVE);
LinearLayout linearLayout = (LinearLayout) button.getParent();
linearLayout.setOrientation(LinearLayout.VERTICAL);
} catch(Exception ex){
//ignore it
}
Style
<style name="StackedAlertDialogStyle" parent="Theme.AppCompat.Light.Dialog.Alert">
<item name="buttonBarButtonStyle">@style/StackedButtonBarButtonStyle</item>
</style>
<style name="StackedButtonBarButtonStyle" parent="Widget.AppCompat.Button.ButtonBar.AlertDialog">
<item name="android:layout_gravity">right</item>
</style>
Result
Here's how i am doing in my app using ONLY AppCompat library You can any number of options
String[] mOptionsArray = new String[]{"Option 1", "Option 2"};
@Override
public Dialog onCreateDialog(Bundle savedInstanceState) {
AlertDialog.Builder builder = new AlertDialog.Builder(getContext());
builder.setTitle("Cool! title");
builder.setMessage("Cool! message");
LayoutInflater inflater = (LayoutInflater) getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View view = inflater.inflate(R.layout.dialog_list_view, null);
ListView listView = (ListView) view.findViewById(R.id.list_view);
listView.setAdapter(new ArrayAdapter<>(
getContext(),
R.layout.dialog_list_item,
R.id.button,
mOptionsArray
));
listView.setDivider(null);
listView.setOnItemClickListener(mOnItemClickListener);
builder.setView(view);
return builder.create();
}
dialog_list_view.xml
<?xml version="1.0" encoding="utf-8"?>
<ListView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/list_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="8dp"
android:paddingLeft="16dp"
android:paddingRight="16dp" />
dialog_list_item.xml
<?xml version="1.0" encoding="utf-8"?>
<Button xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/button"
style="@style/Widget.AppCompat.Button.Borderless.Colored"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@null"
android:clickable="false"
android:focusable="false"
android:gravity="right|center_vertical"
android:paddingRight="8dp"
android:paddingLeft="8dp"
android:text="Button"
android:textAllCaps="true" />
Ref: http://www.materialdoc.com/flat-button/, https://material.io/guidelines/components/dialogs.html#dialogs-specs, https://material.io/guidelines/components/buttons.html#buttons-style
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With