The buttons on Google play cards (CardView & RecycleView) - android

I've just started working on CardView and RecycleView and I want to know what are the side buttons that looks like 3 dots on every card and how to implement it.
Cards like we see in Google Play Store app, where there are cards with buttons.
I don't have enough reputation to post a picture but I'm posting this link where you can see it and the buttons are marked in red circle.

I don't think adding a toolbar on every card is a good idea (as suggested in another answer). As you can see in the image itself, there is no space for a full-width toolbar due to images taking up width of layout. So the best way will be to implement it using an ImageButton. Just add an imageButton on top and configure it to open a drop down menu or dialog or whatever.
P.S. Yes, there can be multiple toolbars according to new material design guidelines but having one on every card is probably not a good idea. Especially when it can't even be a full-width component.

You are looking for Toolbar.
It's a new Android Pattern to generalize ActionBar to use in multiple enviroments, like Cards and others.
How to use it: http://android-developers.blogspot.com.es/2014/10/appcompat-v21-material-design-for-pre.html

Related

What Layout XML should I use for the about page of an android app?

I can't seem to find any good resource or guidelines for making the about section of an app I'm making.
Using a Preference xml seems not a good idea to me as there are no preferences to make. I need to just display textual information. The only interaction required is for showing those Open-source licenses, TOS, the version, etc.
See this about page of the Google app:
I have no clue what is a good (may not be the best) way to implement like in the above linked image.
Any help would be appreciated.
If you want to implement something like this your best bet would be using a RecyclerView with an DividerItemDecoration (for the grey line). The item of your RecyclerView simply needs to support a Title and a Subtitle. The Subtitles visibility should be gone by default, so your item (which should be wrap_content) is not unnecessarily stretched. This way you can reproduce the screen of the image you have linked
If your about page is a static one use constraint layout as parent and textviews as children. But if it is a dynamic list use recyclerview for better performance.

What view to use for such feature?

ALL,
I am trying to port the application from iOS to Android.
In iOS there is a view at the bottom of the screen which holds couple of buttons and it looks like a status bar. One button is implemented as notification button (something like icon in SMS-like applications where you see number in the upper right corner of the icon) and the others are just regular buttons.
This view is always on screen and it looks like a notification area.
Now on Android, how do I implement such a view? Go to each layout.xml and add it there? Can ViewGroup be used for such a view?
Need some guidance here.
Thank you.
[EDIT]
As some people asked here is what I'd like to have.
If you look at the Android phone after boot up (I have an HTC one) there is a grey area at the bottom of the screen. In the middle there is a big button, which says "Phone" and there are 2 smaller buttons - one which directs you to the applications installed and the other is for Personalization of the device.
What we want is something like this with much smaller button images.
[/EDIT]
Tabs on Android are placed at the top of the screen; not at the bottom:
Please carefully read this page: http://developer.android.com/design/patterns/pure-android.html and http://developer.android.com/design/patterns/actionbar.html
You could of course use a custom View, but developing will be a nightmare.
The contents of tabs can be achieved using ViewPager and Fragments: http://developer.android.com/reference/android/support/v4/view/ViewPager.html
While the indicators can be achieved with PagerTabStrips
http://developer.android.com/reference/android/support/v4/view/PagerTabStrip.html
I'm not sure what exactly the view is you are talking about without an image but you can create this layout in its own xml file then you simply use an <include> tag in each xml file. Once you get the properties how you want them it is simply copy/paste into each file, for the most part
I do this in my layouts. I extend from a BaseActivity or BaseListActivityandincludea customActionBar` so I can have the look and functionality I need throughout the whole app.
Reu-using Layouts

Android Custom TabBar

I have seen a couple of application having a TabBar like the following here. I am talking about the widget the bottom left hand corner of the image. You can drag the circular disc and change the tab. Also an Image POP ups about the current TAB. I have tried searching about but so far no luck.
Kind Regards
This is something that HTC developed for their own usage.
it is not available openly to developers sorry.
If you want something like this you will need to develop it on your own.
You can achieve this by using a TabHost widget with TabWidget placed in a horizontal scroll view and then on tab click show some kind of custom fullscreen Toast message with the description and the image. also customize the TabWidget, you can definitely find info on the Tabhost and customizing the tabwidget either here on stackoverflow or some tutorials on google.
In any case you definitely need to do this from scratch, but its certainly possible.

How to design a iPhone like menu/button in android at the bottom?

I have googled this, most of the solutions are using:
1.TabHost with customized style which would cover the separate line between each tab to archive the requirement.
2.On the android developers website, there is a article is using Merge layout to put 2 buttons on top of the background image kind of archive what I want.(http://developer.android.com/resources/articles/layout-tricks-merge.html)
3.What about using button but style the looking like the example below? I don't need the selection, cause each item in the menu will be a button, which takes the user to another page.
I am wondering is there any other solutions apart from these two?
This is something want:
I don't need the menu likes a tab which has selected and unselected, they are better like a button always displaying in certain screen(activity).
Thank you.
You can use simple buttons, and provide any custom background for it. For such simple form as on your screenshot look for this link.
But #Janne write right thing - you should be very careful with transplanting controls from another platforms.

Tips on how to build a layout like this one

Could anyone give me a tip on how to build a layout like in the following picture?
The application i'm working on has absolutely nothing to do with VoIP but I'm trying to build something like this. One fixed toolbar at the bottom, an interchangeable middle pane with listviews, scrollviews or other, and another toolbar at the top which would change depending on the button selected on the bottom bar.
Also, would it be possible and good practice to keep all of this within a single activity?
You should NOT build an interface like this. Don't use bottom bars! Don't use labelled back buttons on action views!
You should read the Android design guidelines and then work with tab views... and other stuff referenced there and build an Android app.
Also, would it be possible and good practice to keep all of this within a single activity?
-Yes for sure, and yes with a slight catch, depending on what you mean.
One approach would be to create your top and bottom bars inside their own XML. Then in your activity onCreate() inflate and add at the top and bottom of your Layout.
If the bottom bar will not change ever, then you could actually add that into the layouts you already have. If you do it that way, to handle the listeners you could create an Activity that contains just the bottom bar click listeners and then extend that with all of your other activities.
Since the top bar can change though you'll probably have to inflate and add the views to that at run time, that way you can react to what is going on to add / remove / present the appropriate views in the top bar.
Also just because it is somewhat of a pet peeve of mine:
When designing your bottom bar please seriously consider the fact that some devices have soft buttons directly underneath the touch screen. And they are rather close to the screen on some devices. Applications with a bottom bar that is not tall enough create an opportunity for the user to hit one of the system buttons instead of one of the bottom bar buttons as they are intending (or vice versa). Which from a users perspective I must say is VERY aggravating.
Do not use bottom bars. To give a more familiar UI, put all of those functions into the top bar. Start by looking at the source code for the ActionBarCompat project in your android sdk sample folder.
The Android developer site is a good place to start. See
UI Guide
I also agree with the poster who recommended against this specific layout. It seems to have been developed for an iPhone and shouldn't be used "as is".

Categories

Resources