Develop Reference

Is there a material component for Simple Dialog?

As mentioned here, under the different types of Dialogs, the Simple Dialog is listed. Is there a dialog builder that would automatically generate such dialog? Is it just an alert dialog with a custom theme?
I would like to replicate a dialog similar to the new permissions dialogs used in Android 10.
I have tried using the material alert dialog builder:
new MaterialAlertDialogBuilder(context)
.setTitle("Title")
.setMessage("Message")
.setPositiveButton("Ok", null)
.setNegativeButton("Ok", null)
.show();
But this shows the options horizontally, whereas I would like to have them vertically. I have many custom dialogs in my app so I could create another one exactly as I need it, but I wanted to get a better understanding of what's ready to use with the material components instead.
For that reason I downloaded the material-components-android project from github, where I found the DialogMainDemoFragment which lists different types of dialogs. The one that is closer to what I want is created like so:
addDialogLauncher(
dialogLaunchersLayout,
R.string.long_title_message_too_long_actions,
new MaterialAlertDialogBuilder(getContext())
.setTitle(getResources().getString(R.string.long_title))
.setMessage(message)
.setPositiveButton(getResources().getString(R.string.too_long_positive), null)
.setNegativeButton(getResources().getString(R.string.too_long_negative), null)
.setNeutralButton(getResources().getString(R.string.too_long_neutral), null));
where
private void addDialogLauncher(
ViewGroup viewGroup, #StringRes int stringResId, AlertDialog.Builder alertDialogBuilder) {
MaterialButton dialogLauncherButton = new MaterialButton(viewGroup.getContext());
dialogLauncherButton.setOnClickListener(v -> alertDialogBuilder.show());
dialogLauncherButton.setText(stringResId);
viewGroup.addView(dialogLauncherButton);
}
but I can't see where the styling/theming is being determined.

There is material theme which values you can override.
Exactly if I not mistaken you need those styles
<style name="MaterialAlertDialog.MaterialComponents.Title.Panel.CenterStacked" parent="Base.MaterialAlertDialog.MaterialComponents.Title.Panel">
<item name="android:orientation">vertical</item>
</style>

Apply similar looking styles to AlertDialog box for different Android versions

I want to make the AlertDialog box for my app look like the ones on Android > 6.0.0 ( as depicted in the following screenshots) for all lower android version till 4.4.4. I have applied a custom style for the dialog box.
Following is the style in styles.xml for AlertDialog:
<style
name="AlertDialogCustom" parent="ThemeOverlay.AppCompat.Dialog.Alert">
<item name="android:textColor">#color/blue</item>
<item name="android:textColorSecondary">#color/white</item>
<item name="android:textColorPrimary">#color/white</item>
<item name="android:background">#color/dark_grey</item>
<item name="android:backgroundDimAmount">0.3</item>
</style>
Following is how I applied the style in java:
new AlertDialog.Builder(new ContextThemeWrapper(context, R.style.AlertDialogCustom))
.setMessage("Why is DialogBox Style Inconsistent through different android versions?")
// Specifying a listener allows you to take an action before dismissing the dialog.
// The dialog is automatically dismissed when a dialog button is clicked.
.setPositiveButton("Yes", new DialogInterface.OnClickListener()
{
public void onClick(DialogInterface dialog, int which)
{
//Do Something
}
})
.setNegativeButton("No", new DialogInterface.OnClickListener()
{
public void onClick(DialogInterface dialog, int which)
{
//Do Something
}
})
.show();
As a get around I managed to at least change the text color to white on the dark background by using:
if (android.os.Build.VERSION.SDK_INT <= Build.VERSION_CODES.LOLLIPOP_MR1)
style = android.R.style.Theme_Material_Dialog;
else
style = R.style.AlertDialogCustom;
So far I have tried making seperate style for lower Android version and apply them via java by detecting Android version. But, I am unable to replicate the style of AlertDialog box on Android 6+ on lower android versions till 4.4.4. And I am unable to find a solution on the internet.
There is an anomaly though; if I apply my custom style on Rate this app provided by kobakei the resulting RateThisApp dialog looks the same on all the android versions. So I believe styling the AlertDialog in a particular manner should fix the issue.
This is what I want - To make the AlertDialog box on Android 4.4.4 and 5.1.0 to look like the one in Android 6.0.0 and higher by using suitable styles. And why does the textColor and textColorPrimary attributes does not get applied on lower android versions?
If the resource provided in my question is insufficient please let me know in the comment, I will share more details.
Here are the screenshots of AlertDialog box on different Android versions with the same style applied.
Android >= 6.0.0
Android = 5.1.0
Android 4.4.4

For more flexibility, you can just create your custom dialog class with a custom layout.
It will give you better control over the way the layout looks.
You can create very complicated UI in your dialog without writing tons of code
You can simply call your dialog like this :
CustomDialog customDialog = new CustomDialog();
customDialog.show();
And you can manage click listeners and more events inside your dialog class instead of adding those code lined inside your activity and make it super big and hard to understand.
Here is an example:
public class CustomDialog extends Dialog {
private ImageView imageView;
private Context dialogContext;
public CustomDialog (#NonNull Context context) {
super(context);
setContentView(R.layout.full_size_image_dialog); .. //your layout
dialogContext = context;
imageView = findViewById(R.id.full_size_image); //controll your views (use any view, the image view is only an example)
}
public void someMethod() {
}
}
}

Android AlertDialog.Builder displays blank unless a theme is supplied

I have recently begun work on an existing android app and noticed that one of the modals displays as a white blank square. I did some research and someone suggested that supplying a theme should fix it. I tried this and it does fix the issue but i don't understand why this was working without it and now its not. The code we use to initialize the AlertDialog looks like this
AlertDialog.Builder builder = new AlertDialog.Builder(getActivity());
builder.setItems(R.array.media_resume_options, new DialogInterface.OnClickListener() {
public void onClick(DialogInterface dialog, int which) {
//handle selection logic here
//......
}
});
builder.create().show();
I can fix it by changing the instantiation line to
AlertDialog.Builder builder = new AlertDialog.Builder(getActivity(), AlertDialog.THEME_DEVICE_DEFAULT_DARK );
I don't see any changes to this part of the code that might have caused it. Could it be affected by something else? whats the potential risk that it might affect other dialogs?

It can't be blank,the textcolor and background color both are white that's why you think it is blank.
How to change default text color of dialogbox is explained here
Change dialog text color on 5.0+

Mvvmcross: launching an android dialog containing a ListView

First, I will like to give a big Kudos to Stuart Lodge for this awesome framework. Together with Xamarin's Visual Studio integration, this is one of the most productive cross platform frameworks I have laid my hands on.
What I want to achieve is launch a dialog containing a selectable ListView when a button is clicked. I need access to the selected item when the user closes this dialog. Is there a recommended way to do this using the Mvvmcross' dialog plugin while following the MVVM paradigm?
I am using the following Activity to create a dialog.
[Activity(Theme = "#android:style/Theme.Holo.Dialog")]
public class SearchResultDialogView : MvxActivity
{
protected override void OnCreate(Bundle bundle)
{
base.OnCreate(bundle);
SetContentView(Resource.Layout.SearchResultView);
}
}
Navigating to SearchResultDialogViewModel from another view model brings up this view as modal. So it looks like I am heading in the right direction. However, the dialog is missing the OK and Cancel buttons and I will also like to get rid of the default header. Think I need an AlertDialog but so far I have had no success launching one with this code:
[Activity(Theme = "#android:style/Theme.NoTitleBar")]
public class SearchResultDialogView : MvxActivity
{
protected override Dialog OnCreateDialog(int id, Bundle args)
{
AlertDialog.Builder builder = new AlertDialog.Builder(this);
builder.SetTitle("some title");
return builder.Create();
}
}
Apologies if this question is vague. I am new to Android UI development.
TIA.

There are several different uses of the word dialog here.
Android Dialogs are 'popup displays' and are covered in http://blog.ostebaronen.dk/2013/02/using-dialogs-in-mono-for-android.html
The MvvmCross Dialog plugin is a code-based form-builder forked from the existing MonoDroid.Dialog and MonoTouch.Dialog tools - see https://github.com/migueldeicaza/MonoTouch.Dialog
The Holo Dialog display is (actually I'm not sure) some theme-based skin on a normal Activity.
With these in mind...
If you want to display a general popup window to collect some data, then you can try using a fragment based dialog to collect data - this is demonstrated (with a little code behind) in Fragments HomeView.cs with NameDialogFragment.cs - for general background on fragments, watch N=26 in http://mvvmcross.wordpress.com/
If you want to use a separate activity for data collection, then #gschackles wrote this article on one way of returning data from child viewmodels - http://www.gregshackles.com/2012/11/returning-results-from-view-models-in-mvvmcross/ - I'm sure other schemes could also be used.
If you do want to learn about the Mvx Dialog plugin, see N=23 in http://mvvmcross.wordpress.com/

You can do it with the builder.
http://developer.android.com/guide/topics/ui/dialogs.html#AddingAList
The code is:
#Override
public Dialog onCreateDialog(Bundle savedInstanceState) {
AlertDialog.Builder builder = new AlertDialog.Builder(getActivity());
builder.setTitle(R.string.pick_color);
.setItems(R.array.colors_array, new DialogInterface.OnClickListener() {
public void onClick(DialogInterface dialog, int which) {
// The 'which' argument contains the index position
// of the selected item
}
});
return builder.create();
}
and you can get your element by returning the which value to your caller.

Mono Droid Modal Popup

I am wondering how I go about (if it is possible) creating a modal popup in a mono for droid application.
Scenario: The application talks to the customers hosted web server (so this location will be different customer to customer). To use the app the user must specify the connection string of their web server. So when the application starts and it hits the main activity, the first task I do is check if there is a connection string set in the devices application settings. If not I want to throw up a simple modal popup that allows the user to specify a connection to their server.
I dont really want to start a normal activity because the user will be able to click the back button and just go back to the main menu and the app is than in an invalid state because it doesnt know what server to talk to.
Any ideas on how I go about this?
Or should I be structuring the activity chain so that the connection string is entered on the first activity so that if they click back it actually goes out of the app?
Im a little confused.
Thanks in advance

This is possible with AlertDialog. It can create dialogs for simple input with lists, checkboxes, yes/no buttons and custom views.
There is a sample in the Xamarin Sample Repository for different type of dialogs and in the bottom you can find one where a custom view with a username and password field has been added.
So first define your custom view you want to put in the AlertDialog. alert_dialog_connection_entry.xml and is a Layout:
Somewhere in your activity add the code:
var connection_string_view = LayoutInflater.Inflate(Resource.Layout.alert_dialog_connection_entry, null);
var builder = new AlertDialog.Builder(this);
builder.SetTitle("Connection String");
builder.SetView(connection_string_view);
builder.SetPositiveButton("OK", OkClicked);
builder.SetNegativeButton("Cancel", CancelClicked);
builder.Create();
builder.Show();
Add some handlers for the buttons:
private void CancelClicked(object sender, DialogClickEventArgs dialogClickEventArgs)
{
//Todo
}
private void OkClicked(object sender, DialogClickEventArgs dialogClickEventArgs)
{
var dialog = sender as AlertDialog;
if (null != dialog)
{
var connectionEdit = dialog.FindViewById(Resource.Id.connectionstring_edit) as EditText;
if (null != connectionEdit)
Console.WriteLine("Connection String: {0}", connectionEdit.Text);
}
}
That should be it. You should be able to put any kind of custom view in the dialog.

If you just want to display a modal popup for letting users put their connection string, you could try this.
First, you need to have a simple layout for how the dialog is presented. In this case, a TextView displaying something like "Connection string:" and an EditText to let the user put connection string is probably enough to go.
Then, you can put this code somewhere in your MainActivity, like after checking application settings or something similar.
var builder = new AlertDialog.Builder(this);
var view = LayoutInflater.Inflate(Resource.Layout.ModalDialog, null);
builder.SetView(view);
string connectionString = view.FindViewById<EditText>(Resource.Id.ConnectionString).Text;
AlertDialog alert = builder.Create();
alert.SetCancelable(false); //This prevents the dialog from being dismissed by either hit back button or hit out side of the dialog
alert.SetButton("OK", (s,e)=> ToDo(connectionString)); //Now you have the connection string, to do whatever you want.
alert.Show();
As you said, the alternative could be allowing user specify the connection string in the first screen. This is a good approach too. I assume you know how to do it, so I didn't post code here.