2

The Problem

I have an Android app that, when in tablet mode, opens a dialog to get user input. However, the date field opens a date picker dialog.

The material design spec says this about opening pickers from a full screen dialog:

Full-screen dialogs may open additional dialogs, such as pickers, because their design accommodates additional layers of material without significantly increasing the app’s perceived z-depth or visual noise.

https://material.io/guidelines/components/dialogs.html#dialogs-behavior

So there is an implication here that dialogs which are not fullscreen, should not open additional dialogs such as pickers. On the other hand, define "significantly increasing the app's percieved z-depth or visual noise".

The Question

What do I do instead? The website doesn't include examples of tablet layouts. Is it really so bad to have 2 levels of dialogs?

Things I've Tried

I have it working with 2 levels and I think it looks ok, but I'm not sure about it. I've also tried making the original dialog hide when the date picker is open, and then show itself again when the date picker is closed. Is that a good/bad idea? It seems like the user might get confused as to where the original dialog went and feel like something went wrong.

I thought about embedding the dialog inside the other dialog but then how does the user press ok or cancel? It seems it would make the original dialog very complicated. Not to mention that when I tried it it didn't work; it wouldn't let me scroll the year, likely because of being in a scrollView already.

I could also have the date picker permanently embedded in the other dialog (rather than only show it when the user presses the date field, but then it takes up too much space. It's too big to leave it there - I think.

Another option could be to use text entry for the date. However my issue with doing that is that different regions display the date in different formats. I would like this to be more universal, not to mention take advantage of the inbuilt validation and any updates the date picker may receive in the future. Also, it requires the user to type which feels harder.

What other options are there?

Surprisingly I wasn't able to find a direct answer to this. All I was able to glean from my research was that it's not good design to open a dialog from another dialog. But what are the solutions? Is it never good or is it ok sometimes?

Thanks. I wish they would add more examples to the website.

Improve this question
8
  • could you share some screens for better understanding.
    – uttham
    Mar 10, 2017 at 5:19
  • what don't you understand? there's some screenshots in the link. the only difference is that I'm launching the date picker from a dialog that is not full screen. happy to clarify if you have a specific question...
    – Michael Vescovo
    Mar 10, 2017 at 5:35
  • I'm just gonna stick with the 2 levels of dialogs for now, but I'm curious as to what others do when they find themselves in this situation. I wonder what the "recommendation" is, if one exists at all.
    – Michael Vescovo
    Mar 10, 2017 at 5:40
  • If you could post an image of the first dialog so we can understand a bit more the context, and see if there is a way not to call a second dialog.
    – Alvaro
    Mar 10, 2017 at 12:08
  • Sorry there is no screenshot. Just imaging a tablet screen with a dialog opened for entering data. Then imagine that one of those items to enter is the date. The method I'm using to select the date is to use a date picker which launches and additional dialog over the top of the existing one. It's a simple as that. I'm now happy with this solution after having developed it more. I have a spinner to select either "Today", "Yesterday", "Custom", or "Unknown". If they select "Custom" it displays the date picker. However, feel free to add your own answer for others to read. Thanks.
    – Michael Vescovo
    Mar 10, 2017 at 12:20

2 Answers 2

Reset to default
4

I think two levels of dialogs is the best option, it's what I've done in the past in this situation. It's certainly better than hiding the first dialogue, for example, this gets very messy and confusing for the user, in my experience.

In fact, I've found multiple layering beyond two layers not to be a problem either, users totally get the concept of dialogs on top of dialogs, the only problem comes when they want to exit out and have to close multiple dialogs to do it, which can be frustrating.

Improve this answer
4
  • Thanks for your answer Rik. This was my first question on UX community so I'm actually not sure how to select the correct answer, lol. Your answer has helped, and since it's the only one I'll accept it!
    – Michael Vescovo
    Mar 10, 2017 at 6:49
  • There was another answer which got down voted and then disappeared. I think they also removed my only upvote on the question. Isn't it sad when that happens? It's not my fault they didn't have a good answer. Anyway, thanks.
    – Michael Vescovo
    Mar 10, 2017 at 6:53
  • It's necessary to have some research backing your answer when you say it's the best option. Right now your post appears as your own view/experience of the component.
    – Dipak
    Mar 10, 2017 at 7:02
  • There isn't anyways extensive research done. My company did some user testing but I can't link to published results. So this is based on my experience, not my opinion, as stated.
    – Rik Lewis
    Mar 10, 2017 at 7:07
4

Just because the default behavior of Android date picker is not the same as PC date picker doesn't mean you have to be cautious about using it inside a modal dialog. If it would been working the same as PC date picker (which works as a callout), you may not have had this question.

Don't take the date picker as a modal dialog, but take it as a system component which happen to appear as a dialog. Mostly, in any platform, it's not recommended to modify the system component unless you improve the user experience of it.

Considering a date picker component on modal dialog for tablet is a fair choice, and I'm sure users are using it in many applications. Do read this post here that talks about Modals on top of Modals

Modals are great for creating an area for self-contained tasks that focus a users attention.

Improve this answer
2
  • Thanks Dipak. So it seems it's ok for 2 levels in this situation.
    – Michael Vescovo
    Mar 10, 2017 at 6:57
  • @MichaelVescovo Considering Date Picker? Yes
    – Dipak
    Mar 10, 2017 at 7:03

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.