-
-
Notifications
You must be signed in to change notification settings - Fork 10
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
UI for choosing reminder type #30
Comments
Hi, I'd like to take a look at this issue. Android 12's sound/vibration/silent menu seems to use a You mentioned that the button should go in Also, I'm not quite sure I understand what the alarm reminder is going to be. It would be useful to know more about it to decide on an icon for it, but based on the name I think something like what is currently used for notifications ( These are of course all just my two cents, let me know what you think. |
Hi @maxcutlyp, thanks a lot for your interest and what you already found out!
The commit where the global_actions_silent_mode.xml file you point to was last changed might also contain some useful hints ("Implement a new volume panel widget, combining volume and zen mode + conditions"). But I am a bit confused that this is from 2014, while I think the menu I described is rather new. Also, I don't know what they mean with Zen mode. Your link "this function" doesn't work, can you correct it?
Of course, you are right, it should be done in
An alarm reminder will result in an alarm like alarms from the stock Android alarm clock app. So the icon Apparently the bell symbol seems to represent notifications on Android. In Android 12, having a notification channel set to "Default" ("May ring or vibrate based on phone settings") a bell with two stripes at the top (indicating ringing) is shown, whereas having it set to "Silent" the bell is crossed out. I find the bell symbol a bit unfortunate if it should represent notifications in general, because it suggests that there is a sound while it is up to the user to configure whether the notification channel should make a sound, vibrate, or be silent. If we can find a more neutral symbol to represent notifications that would be better in my opinion. But if it turns out that the bell is the best/most suitable, then that's also fine. A You are very welcome to go ahead and try to implement the menu. If you want to start making commits, create a branch "feature/reminder-type-selector" in your fork. If you want to include and modify files from the Android Open Source Project, please first commit the unmodified file where you
Then you can replace the copyright header with the project's one and make changes. Be aware that currently I am refactoring major parts of the project, including conversion to Kotlin (see #27). But as |
Wow, I guess it must have been in the works since 2014. And I'd only be guessing, but maybe "zen mode" refers to the silent (non-vibrate) option, which may have previously been a separate feature? I'm not sure.
Whoops! Yes, this is the correct link, and I've edited it in my original comment. For some reason, GitHub's search gave me a file from an old commit, which I naively changed to "master" in the link without testing it, assuming they would be identical. The same function exists in the current master branch, although in a different file (linked above).
I agree. However, it seems like the bell symbol is used almost universally as a generic notification icon, to the point that I think people don't really think of it as "sound" unless it's directly contrasted with a "no sound" symbol, like in Android's silent mode menu (a Google image search for "notification icon" shows almost entirely bells). I'd compare it to the way a floppy disk is still used as a "save" icon even long after floppy disks are no longer used. I think that a different symbol would be preferable but I can't think of what such a symbol would be, so I think that a bell (without extra lines to indicate sound or a line through it to indicate silence) would be best unless you (or anyone else) can think of something better. Thank you for the rundown on proper copyright/licensing, I'll make sure to do that as necessary. |
Thanks for the link! If it suffices to implement sth. like the SilentModeTriStateAction class (if that's what implements the menu) that would be great.
Yeah my image search came to the same result. I think too that the bell symbol (in the plain version) is fine then. Thanks again and I'm curious what you'll come up with :). |
Hey, I'm having some trouble setting up the dev environment. I made a
Is there anything else I should put in the In case it's useful, here's my
I assume you're using Intellij IDEA from the .idea folder. I'm quite new to Android development, and I haven't used Intellij for it before. I managed to get a "Run Configuration" for
I'm sure I'm doing something wrong, so it would be nice to know how you set your dev environment up. Maybe I missed some build instructions? Thanks! |
Hi, I'm sorry that you got into troubles building the project. It sounds you might be missing the git submodule (sectionedrecyclerviewadapter). Simply run It should be easiest to use Android Studio; except for installing the right gradle and SDK version, which it will help you with, you shouldn't need to configure anything before being able to build. If you are still having troubles, you might want to wait until I push the maintenance changes, which remove the submodule and update gradle. |
Thanks, that definitely helped. I had to add Other than that, I've got it built and running in Android Studio! Thanks again for the help :) |
Perfect! Then good luck with the rest, let me know if there are any problems. |
Thanks, will do! |
Update: my initial guesses were quite wrong. Upon further research, Additionally, I'm reasonably certain that The file the volume dialog is actually in is VolumeDialogImpl.java. This uses the layout from volume_dialog.xml which Unfortunately, this means it's a custom solution - we can't just use some preexisting "drawer" class (although I'll try to start actually writing code tomorrow. Also, for your interest, "zen mode" seems to refer to "do not disturb mode". |
Thanks for tracking down to the actual implementation! It's unfortunate that they apparently didn't implement it in a modular way (a reusable menu). Maybe it might be worth to first look for libraries that might provide a similar menu? The one from the volume menu seems neat and practical, but it's not necessarily the best. And if there are other menus/buttons that require less work to incorporate, modify (e.g., we want a long-click action) and maintain (e.g., what if at some point we want a 4th option in the menu?) then that might be the better choice. For example, I once found this Advanced floating action button project (here it is described how to include it as a dependency). This could probably provide what we need, but it's just an example and there might be other good solutions. Optimally, it's a maintained library that keeps up-to-date with platform changes, or at least a somewhat robust implementation that will work fine for long enough. There is also a Android developer guide on popup menus, but this might be too restricted for our purposes (e.g., can the menu items be custom views/icons, can we have long-click actions on those etc.). When you begin to work on a concrete solution/attempt, you can open a WIP pull request, and we can discuss details there. Just reference this issue. P.S. Regarding your confusion concerning the use of |
I'm inclined to agree, but I'm honestly not sure what to search for. At the core, we just need some radio buttons, but there's not enough space to fit them in the layout, so we need them to expand and float above the rest of the layout. This problem, I think, is quite niche, although the ringer drawer seems to solve it. I like the advanced floating action button project you linked, but I'm not sure how well it would work for our situation. I think there are two ways we could use it:
I agree that a popup menu may be too restricted, and it also suffers from the icon issue mentioned above. None of these, in my opinion, match the elegance of the drawer solution (at least from a user's perspective). I like the idea of having titles next to the buttons, but I think that with good icons and toast text they aren't strictly necessary. Once I have something concrete to show, I'll open a WIP PR. |
I would call what we look for "popup menu", "floating menu", "floating buttons" etc. Another way to find UI components is to explore other open source apps and see whether there is one with a UI one is looking for, and then find the corresponding code. But probably you are right that it is rather niche and not used so often.
I think option 2 is not really an option, it is essential that the current choice can be seen. And making the display of current choice and the selection button two separate UI elements would be waste of space. I was thinking of option 1, but without the need to worry about order: the popup menu is always the same, regardless of what is already chosen. I think this is actually quite important, as the user will remember the positions of the different choices, and quickly select an option without much thinking. This would be made more difficult if options change place. With the advanced floating action button (where I probably would choose the radial one, which uses the available space better) we would use it as advertised, just that the main button gets a fixed place with a smaller size (it shouldn't use more space than the current nagging switch) and its icon is changed whenever a choice is made. Furthermore the main button and the popup buttons need a long-click action. I would guess that none of these is too difficult to achieve. This solution would look and behave very similar to the original idea of reusing the audio drawer solution. The main difference is where the popup menu/buttons appear and how the animation looks like. So I would rather base the decision of which to use on how easy it will be to integrate/adapt.
No, we don't need text next to the button; the icons should be enough, there will be an explanation in the help text and the toast when creating the reminder can confirm the selected choice. In addition, a long-click will open the settings for the selected reminder type where the name will be stated. In addition, if we use the advanced floating action button, there might even be space for labels in the popup choices. An alternative would be to use a Spinner with a custom layout for the entries - these could be icons, and I assume/hope that one can also attach long-click actions to those and the spinner itself. This solution just doesn't seem as neat as the other two (audio drawer / advanced floating action button). |
Agreed.
Good point. This would mean that the main button would have the same icon as one of the options though, but I don't think that would be a problem as long as the main button is visually different enough from the submenu buttons.
I'm worried that since there's a lot going on behind the submenu, the radial one has the potential to be confusing to users. This could be mitigated by fading out the background (like the examples in the bottom corners of the gif in the AFAB readme), although to be honest I think that would be necessary for both types (radial and linear).
Sorry, I wasn't clear - this is what I meant by "having titles next to the buttons".
I agree, spinners feel a bit clunky for our use case. |
Right, there is a chance that one might be confused by same buttons. Although I think that already the positioning and opening animation of the menu buttons might make it clear enough. For example the radial version of the advanced floating action button arranges the buttons in a way such that the main button is standing out as the center. This might be another reason in favour for that version. Another possibility of making it more clear is changing the main button when opening the menu, like in the examples of the advanced floating action button. Instead of turning it into a "close button" with an "x", we could just turn it grey, i.e. we'd have grey versions of the 3 buttons.
Good point. Another way to make the menu UI be more distinct from the background would be choosing distinct colors for the buttons (as the background is mostly grey with a bit of blue, I could imagine green or white for regular reminders, yellow or purple or orange for nagging reminders and red or orange for alarm reminders). Blurring the background seems like a good idea regardless of how the buttons look like. One option that might be preferred over blurring the whole background could be extending the circular icons of the menu with a bigger transparent circle, forming a blurring margin. Maybe this or something similar can already be achieved by using the depth attribute (I think this adds shadow). It seems to me that we have a quite good idea now of how it could look like and how it can be integrated into the current UI. I think I would be fine with the floating action button, depending on how easily it can be integrated. You could give it a try, just with dummy buttons and no further functionality and then we'll see. If you can find other libraries, just post them here and we can take a look as well. |
I actually like the idea of turning it into a "close button" with an "x". I feel like making it grey tells the user that it's invalid ("greyed out") when in reality clicking on it will just close the submenu.
I quite like the current colour scheme of blue and grey, it looks very professional. I worry that adding too many different colours could detract from that and make it look less professional.
Do you mean extending one blurred region across all the buttons (in a circle for a radial FAB, or a pill shape for a linear one [similar to the ringer drawer shape]), or do you mean extending each individual submenu button with its own blurred circular region? Personally I think either would work. Also, I'm running into an issue installing Advanced FABs as a dependency: "Manifest merger failed : uses-sdk:minSdkVersion 16 cannot be smaller than version 21 declared in library [com.github.kelmer44:fabmenus:1.33] as the library might be using APIs not available in 16". The suggestions it listed were:
Personally I think option 2 is the best, unless there's a reason SimpleReminder's minSdk version can't/shouldn't be updated to 21. What do you think? |
Yeah you are right about "greyed out", but I think it depends on how it is realized in the end. What I like is that one can still see the current choice while the menu is open. Then clicking on the main button again, which happens to be the button of the currently selected mode, closes the menu but could also be regarded as "choosing the current choice". Let's keep both as an option and see what looks/works best in the end.
I agree to some extent. On the other hand, the selected reminder type is very important (e.g., if you want it to be an alarm, you might miss it if you accidentally make it a normal or nagging reminder). Here colors would make it less likely to choose (or keep) the wrong one.
I meant that each submenu button would get a blurring ring around it. The other option you describe also seems reasonable, but I think I'd prefer the former which is probably also easier to realize.
Oh, that's unfortunate, I wasn't expecting this. Until now it was not much of a problem to keep the However, probably at some point I'll want or need to increase the You could go ahead for now and use |
I was thinking this could be done by having the relevant submenu button appear "checked", like the "checkable" example in the Advanced FAB readme and similar to how the ringer drawer shows the current selection.
Sure.
True. I think, like above, we should keep both options and see what looks best in the end.
Sounds good, I'll look into it.
I agree to an extent, but it's important to remember that the last version before Android 5.0 (Android 4.4) stopped being supported by Google in October 2017, almost 5 years ago. I'll bump up |
Right, that's also an option. But as I understand the example from the Advanced FAB readme, this type of menu also has the behaviour of checkboxes, i.e., it will stay open when making choices instead of closing on a selection.
Okay. And actually this also opens the option of partially supporting Android <5.0 by keeping the lower |
That's okay, we can just close it when the user taps on a selection. The main button's icon will change to their selection so they know what they tapped. I'm playing around with it at the moment, you can just call the
Agreed. PS: You can check out my WIP PR if you'd like, #32. There's not much there yet, but it shows how the UI could look. I've got some uncommitted changes that I'll try to tidy up and push tomorrow, mostly related to saving the selection visually and internally. |
Help wanted: You can help by looking up how this could be realized, find or design icons and potentially also do the implemention. You do not need to know anything about the app's implementation.
In the near future, there will be three reminder types: simple notification reminders, nagging reminders and alarm reminders (separate issue will follow soon).
(Recurrence is a feature independent from the reminder type.)
We need a UI in the Add/Edit Reminder dialog that allows to efficiently choose the reminder type while not using too much space.
My idea is to place a selection button next to the reminder text field, where currently the switch for nagging reminders is. Clicking this button will open a floating menu with 3 buttons, each with a corresponding symbol representing one of the reminder types. Clicking one of them closes the menu and the selection button will show the selected symbol, meaning that the respective reminder type is selected.
An example for such a floating menu is the sound/vibration/silent menu on Android 12, reached by clicking a volume button and then clicking on the symbol at the top.
Individual settings for each reminder type can be performed by long-clicking the respective button (either on the selection button, or in the floating menu). The long-click will open a new dialog with further settings, as it is for nagging reminders now, and closing this dialog with an affirmative action will also switch to this reminder type (this is relevant when long-clicking in the floating menu).
In a later, advanced version, I would like to add swipe/pull controls to the reminder type buttons. For example, to change the nagging repeat interval, one could pull the button up or down, which will continuously change the value up or down until releasing.
The symbols used to represent the reminder type should also be used in the reminders list to indicate the reminder type, and maybe also as the notification's symbol.
Tasks
ReminderDialogActivity
.The text was updated successfully, but these errors were encountered: