Vertical Action Bar for Android - android

I want to display the Action Bar Vertically in my App.
I have found few examples for the Horizontal One, but not any for the Vertical One.
Can anyone please give me any example for the Vertical Action Bar.
Thanks,
David Brown

There's nothing in the Android UI design guide about a vertical ActionBar. But you might be able to coerce a similar effect by locking the display orientation, and then applying a rotation to the View in the content area. You also might be able to get somewhere by downloading the source code for ActionBarSherlock and implementing your own version of the ActionBar. But I don't recommend either of these solutions. If you're really that intent on putting actions on the side of your screen, I suggest either a small vertical LinearLayout, or implement one of the side navigation solutions as discussed in Android Facebook style slide.

Related

Can we implement collapsing Toolbar behaviour in Bottom Appbar?

How can we implement collapsing Toolbar behaviour in Bottom Appbar? Is it possible to do it?
Side note : This question is too broad to be considered here. They are better off searched on Google.
However, to answer your question : yes you can do that if you want to but there is pretty much no reason to do so. It goes against material design principles, there are no built in components to accomplish this (so you will have to make your custom views) and it will also confuse the user since this is not a design seen anywhere in android.
You are better off using a Bottom app bar with a navigation drawer (which pulls up from the bottom instead of the side).

How does instagram fixed and change the bar when scroll up in android?

Notice: I cannot provide pictures due to my reputation.
When we scroll down from the feed in instagram the action bar is actually hide and a white bar that indicate the user name and time is fixed at the top. When we scrolling down again the previous white bar will scroll up and next bar will fixed at the top again. I want to make something like that for my school project.
So my first question is how can I hide the action bar while scrolling up and show it again while i scrolling down?
Second question is how can I make the white bar just like how instagram did it?
Any help will be highly apperciate!!
I am not a 100% sure what to do to accomplish the movable action-bar, but you may want to look into "toolbar" which may provide more manipulation potential.
http://www.google.com/design/spec/layout/structure.html#structure-toolbars
http://developer.android.com/reference/android/widget/Toolbar.html
http://cyrilmottier.com/2013/05/24/pushing-the-actionbar-to-the-next-level/
Also, if you are looking for the white part that has to do with usernames and such inside instagram, you should look for an effect called sticky-headers.
Awesome library to quickly add list view animations, such as sticky-headers
https://github.com/nhaarman/ListViewAnimations

How to position the elements in a custom action bar layout in Android?

I need to develop a custom layout for the action bar in Android.
I'm now stuck because I have no clue how to calculate the available space for my custom layout.
In the image, the red part is my custom layout, the blue part is the space occupied by the action buttons.
Clearly I need to know/calculate the size of the red part to be able to correctly position the elements in my custom action bar (for example center the title in the window or make sure not to overflow in the blue part).
How can I achieve this?
I couldn't find useful examples or a clear API in the Android documentation.
I think that anyone using the custom action bar layout must be facing this kind of problem, I'm a bit confused.
Or am I supposed not to use action buttons in this case? Perhaps I'm supposed to replicate the action buttons by myself?
Thanks in advance
Try using ToolBar instead of ActionBar. It will give you a lot more control over ActionBar elements than ActionBar.
Here is a simple tutorial about how to replace ActionBar with ToolBar and how you can customise it.
Material ToolBar
Possibilities are endless with ToolBar but my recommendation is to don't overdo anything.
As per my suggestion try to use the entire action bar by your custom layout. So that you can arrange all the things use it as a fragment inside a framelayout for all your screens so that the code can be reused for all your layouts.

How can I create this UI navigation control?

This is a picture of my phone (Android 2.1 with HKC Sense):
The bit that's got a red border around it is in the Clock app and the Media player on my phone. What is it called? Is it a standard Android interface control?
I've been trying to figure out how to get something like this for the past while and I'm not seeing anything immediately obvious.
I've seen a lot of people referring to the ActionBar or Split ActionBar, but that seems to be something that is anchored to the top. I need this to be at the bottom without any component on the top.
*please excuse
It's an actual pic of the phone, rather than a screenshot - the screenshot app I downloaded wouldn't work.
The fact that the pic was taken with an iPhone, and that the apple logo is clearly reflected in the pic.
You can use Split ActionBar
android:uiOptions="splitActionBarWhenNarrow"
And that will force the action bar items to be hosted on the bottom of the screen for narrow devices, mostly phones. When this flag is set, no components are hosted on the top of the ActionBar, unless you use tab navigation.
See example Image
Keep in mind though, that should you be displaying the layout on a non-narrow device, like a tablet, then the items will be attached to the top ActionBar.
Some other things to consider
Creating a custom view, which you can set to the bottom of the layout. The View would be a scrollable ListView per say, and you can add as many icons as you'd like to it. Here's an example. That would not be a standard nav pattern though.

Copy the google plus floating toolbar menu

I'm trying to emulate a "toolbar" type floating menu used by the android google plus app. The menu appears when you scroll up the page and hides nicely when you scroll down.
I'm guessing this is a linear layout with some sort of animation. Is that correct? Any ideas on how to reproduce?
You should have a look at Roman Nurik's scroll tricks example here. It shows how to have a quick return view like the one you mention.
One way to achieve this effect is to call animate().translationY(value) on the object you want to slide down/up.

Categories

Resources