Horizontally scrolling Grid Lists? - android

There are a lot of questions on here asking about horizontally scrolling GridViews. A few have answers that lead to some custom classes that manage to do it, yet Google clearly indicates there a standard way to do this. They have an entire page about it in their Design section: Grid Lists. This page illustrates horizontally scrolling grids and implies strongly that this is normal, supported behavior (as it should be). They go into great detail about WHEN to use it. Unfortunately, they neglect to mention HOW to do it. I have searched all day to find an example of how this is accomplished with GridView or any other standard Android UI class, regardless of SDK version. Is their documentation wrong? What is this page referring to?

yet Google clearly indicates there a standard way to do this
No, they do not.
They have an entire page about it in their Design section: Grid Lists.
They have material in the Design section for which there is no out-of-the-box implementation in the Android SDK. Other examples include the drawer, some of the gestures, and section headings in lists.
Is their documentation wrong?
It is design documentation. To that extent, it is not "wrong" to have a design that calls for a horizontal-scrolling GridView. The mere fact that the Android SDK does not supply one -- at least at the time of this writing -- does not preclude somebody creating one.
What is this page referring to?
Grids.

try an xml with the following;
<HorizontalScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<GridView
//your layout
>
</GridView>
</HorizontalScrollView>

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.

How to create vertically nested scrollviews with viewpager content

This is in a lot of apps, where there is header content a view pager and then the pager content. The header content can scroll off the top then the pager content docks and continues to be able to scroll. I've tried a couple ways of doing this, I had the most success with using NestedScrollView, but I was never able to get fling and a few other use cases working right. As far as I can tell the apps that do this all spin their own solution.
I'm looking for suggestions on how to go about building this type of ui. Below is Google+ which uses this ui.
This is not exactly an answer (the question itself is quite open-ended) but I found cheesesquare implementation by Chris Banes (he's from the android team i think) very helpful with what you're asking.
https://github.com/chrisbanes/cheesesquare
What dejavu86 has said. The app in question is a demo of Design Support Library which has the UI widget, CollapsingToolbarLayout, which you are asking about.
http://android-developers.blogspot.co.uk/2015/05/android-design-support-library.html

Is there a library for Floating Action Buttons (FAB) with Labels?

Is there a library for creating Floating Action Buttons with labels (similar to the Evernote app)?
Evernote Screenshot
The popular libraries seem to be
https://github.com/futuresimple/android-floating-action-button (closest to what I want... ability to expand hide "sub" actions)
https://github.com/makovkastar/FloatingActionButton (Primary function is to hide/show with a scrollview, recyclerview, or listview)
https://github.com/oguzbilgener/CircularFloatingActionMenu (library which has been around pre-lollipop)
Neither of these, to my knowledge, have this capability. Before re-inventing the wheel, has somebody already done this?
This feature request ended up being implemented in https://github.com/futuresimple/android-floating-action-button. This includes labels on both the left and right sides.
If you're interested, see the discussion here: https://github.com/futuresimple/android-floating-action-button/issues/22#issuecomment-66155108
Disclaimer: I haven't used this (yet).
I'd recommend this library over others that I've seen.
Nowadays there are available techniques of manipulating behaviour of the view that enable you to program FloatinActionButton as you want and to have joy that you have made it by yourself!
Fade in/out FloatingActionButton while scrolling RecyclerView . DETAILS
Slide down/up , beside it blog says how to:
Expand floatingActionButton and show subFloatingButtons. DETAILS HERE
There is to much details, "how to do". Therefore I've attached just links to blogs. Anyway I encourage you guys to take a look at those blogs. You will have total control over your application. Currenty I use all solutions from both blog's. Enjoy!
Especially the last library you mentioned looks quite sophisticated. To my knowledge, you can set any kind of View you want to be shown as a Button.
This View could simply be a custom-view of yours that shows an image as well as a label.
In case anyone is still looking for this functionality: I made an Android library that has this ability and much more, called ExpandableFab (https://github.com/nambicompany/expandable-fab).
The Material Design spec refers to this functionality as 'Speed Dial' and ExpandableFab implements it along with many additional features.
Nearly everything is customizable (colors, text, size, placement, margins, animations and more) and optional (don't need an Overlay, or FabOptions, or Labels, or icons, etc). Every property can be accessed or set through XML layouts or programmatically - whatever you prefer.
Written 100% in Kotlin but comes with full JavaDoc and KDoc (published API is well documented). Also comes with an example app so you can see different use cases with 0 coding.
Github: https://github.com/nambicompany/expandable-fab
Library website (w/ links to full documentation): https://nambicompany.github.io/expandable-fab/

Custom Android Layouts

I have an upcoming project that requires me to make a custom layout. I have been looking all over for a way to complete this but with no success. The layout will have custom buttons that need to fit the screen and some other custom views. In other words I need it to look the same on all types of devices. So these custom views need to stretch to fit the screens. Something similar to the weather bug app but the buttons will be at the top and there won't be so many options. The buttons will fit the screen width wise. Basically the layout will not contain any stock UI.
I would like to have a book or tutorial that I could follow to help me out here.
check out this blog: http://blog.stylingandroid.com/
there are a lot of good examples for every kind of layout manager in Android.
Furthermore I strongly recommend to you to have a look in the Android's API Demo and source code.
For creating custom view, that's the best resource: http://developer.android.com/guide/topics/ui/custom-components.html
good luck!

Which order of nested layouts is most efficient in Android

I don't think I have really ever nested more than about three levels worth of Layouts (RelativeLayout, LinearLayout, FrameLayout) in Android. I am not thinking about list items which also use a custom layout for ListView but just normal layouts for an activity.
To the point though, I was chatting with another developer about nesting layouts for a certain layout we were discussing and he seemed to think that even a few nested layouts really slowed down performance. I figured there is some truth but it cant be that much.
Does anyone have a more expert approach to this? Any input? Opinion?
Thanks.
UPDATE for those who found on Google:
The first answer below is a great resource. It looks like a lot and people seem to skip over answers like that but please check it out. Very valuable.
I guess there is no silver bullet for this but I will give you some tips:
1) Try using the tools provided with the android sdk.
I tend to analyze my layouts with hierarchyviewer and layoutopt trying to reduce the amount of View used and the height of the tree.
2) Read Romain Guy's posts about <include>, <merge> and <ViewStub>
These tags are not used often but they provide great speed "hacks".
http://www.curious-creature.org/2009/03/01/android-layout-tricks-3-optimize-part-1/
http://www.curious-creature.org/2009/03/16/android-layout-tricks-4-optimize-part-2/
3) Use dmtracedump and measure how long does it take to inflate a view.
You can check how long it takes to inflate a view. Get an inflater and measure how long it takes to inflate each of your options.
I havent done any proper testing to support this, still, I believe that android was design to use nesting Layouts in order to provide adequate UI's to the user, its practically the only way to support multiple screens so I wouldn't really worry about which is the most efficient, just that it looks the way it should.
Any other kind of bad programming practice would probably have a bigger effect in efficiency than layout nesting.
The difference will be much more important when you use such a layout for every item in a ListView for instance. Hopefully this simple example showed you that getting to know your layouts is the best way to learn how to optimize your UI.
Can't give you a full answer, but Romain Guy has specifically stated that nested RelativeLayouts have an exponential time for measurement.
See video here at 38:08 mark
actually all of them are based on the same class..
but it would be better to use according to me as follows:
<RelativeLayout>
<LinearLayout>
<at> here we just create nested more as we wont></at>
</LinearLayout>
</RelativeLayout>

Categories

Resources