Skip to content
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

Discussion on Split ActionBar #24

Closed
rbarman opened this issue Dec 22, 2013 · 9 comments
Closed

Discussion on Split ActionBar #24

rbarman opened this issue Dec 22, 2013 · 9 comments
Assignees

Comments

@rbarman
Copy link
Owner

rbarman commented Dec 22, 2013

Continued from #23 (comment)
It is agreed that we will use split action bar. (For reference : http://developer.android.com/design/patterns/actionbar.html#considerations-split-action-bars)

Now the question arises, what will we put on the top action bar and on the bottom action bar?

My current thoughts :
Top Action Bar

  1. Search Icon (definitely)
  2. other

Bottom Action Bar

  1. Share Icon
  2. Favorite Icon
  3. Menu Icon
  4. other

The awkward one is where to put the favorites icon? The star icon is too similar and the user can easily get confused. We could have a way for the user to get to the favorites by clicking on the menu icon which will lead to a pop up menu.

What are your thoughts?

@chan96
Copy link
Collaborator

chan96 commented Dec 22, 2013

My thoughts:

Top action bar

  1. search icon
  2. menu icon

bottom action bar

  1. share icons
  2. favorite icon

I am thinking of having the bottom bar as more of a sharing/favorites/social menu. Regarding the favorites icon issue, we could add the word "favorites" or an abbreviation to the left of the icon (assuming it doesn't take up too much space). When you say "menu icon" are you talking about a specific button on the screen, or the hardware button? If it's an icon, we could create a sub menu that appears and has the favorites button link (similar to your idea, but using a sub menu instead of a popup.

@rbarman
Copy link
Owner Author

rbarman commented Dec 22, 2013

I am referring to an actual menu icon in the bar such as :
screen shot 2013-12-22 at 1 31 46 pm

@chan96
Copy link
Collaborator

chan96 commented Dec 22, 2013

Ah, ok, that looks good.

@ghost ghost assigned rbarman Dec 22, 2013
@rbarman
Copy link
Owner Author

rbarman commented Dec 24, 2013

Current Status.

Top Action Bar

  1. made custom_actionbar.xml
  2. searchView functional (needs null pointer exception quick fix for when queryText.isEmpty)
  3. No menu icon yet

Bottom ActionBar

  1. uses current actionbar
  2. currently has star, share, and arrow icon.
  3. star is to add to quote to favorite - currently can only change icon based on toggle, starting respective async task results in null pointer (prob failed to declare things in BaseActivity)
  4. menu icon not functional yet
  5. arrow icon is put for testing to launch FavQuoteScreen Activity.

Goals

  1. make bottom action bar fully functional
  2. quick searchView fix
  3. find good actionOverflow icon for menu icon in custom_actionbar.xml

@rbarman
Copy link
Owner Author

rbarman commented Dec 25, 2013

Current Status : Top and Bottom Action bar functionally work but there are some design "flaws."

Main Activity
main
Top action bar has a searchView while the bottom has a action overflow menu. I did not use a image from drawable for that icon, that icon will just appear if there are action items that have showAsAction = "never."

Random / Specific Quote Activity (same for both)
randactivity
Top has searchView while bottom has favorite, share, and action overflow menu.

So what is "wrong?" I would like the action overflow menu to be in the top action overflow but that will be tricky / hackish to do so. You can look at my stack overflow question to fully understand my problem : http://stackoverflow.com/questions/20768652/possible-to-have-action-overflow-icon-in-top-action-bar-of-split-actionbar

So I will have to ..

  1. Wait for good answers
  2. Figure out a hack way to do what I want
  3. If all else fails, do a completely new design. (Maybe single action bar and then a banner at the bottom or just a single action bar)

Once I have figured it out / found a new way, I can easily change the FavQuoteScreen and SelectedQuote accordingly.

@rbarman
Copy link
Owner Author

rbarman commented Dec 25, 2013

Here is what happens when the action overflow is clicked. It will show all action elements that were = android:showAsAction = "never" IE, things we want in a menu.
action

@rbarman
Copy link
Owner Author

rbarman commented Dec 25, 2013

now with pop up menu mimicking overflow menu

  1. find good action_overflow menu icon
  2. change theme accordingly
  3. IF 1 or 2 can not be done
    wait for stack overflow + design new action bar design.

@rbarman
Copy link
Owner Author

rbarman commented Dec 27, 2013

there is no suitable action_overflow icon. Well resort to single action bar or use Fragments.

@rbarman
Copy link
Owner Author

rbarman commented Dec 27, 2013

Current Status : Code is implemented, some aesthetic touch ups needed.

  1. Split action bar is not used due to design complications. Instead I used a single action bar and a custom layout that I include within all the different layout. This custom layout (customized_bottom.xml) will hold the share and star image button and will be placed at the bottom of each activity.
  2. The action bar has a fully functional searchView and an action overflow menu that will have "Favorites" , "Settings", and "Help" as the current options. Currently "Favorites" is the only functional menu item and will launch the FavQuoteScreen Activity as a result.
  3. The customized bottom bar has a fully functional share and favorite button that will be seen only in the SpecificQuote, RandomQuote, and SelectedQuote Activity.

Rather than upload pictures here on GitHub, pictures of each activity with the actionbar and customized bottom bar can be seen in the Brainy Quote Pics under the file named "12-26-13 pics" : https://drive.google.com/#folders/0B8JarS5_1mecUmNkOE5JZXhXcjQ

What's left

  1. make the bottom bar more aesthetic. (Color, width, etc)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants