Develop Reference

How to design 2 different layers in one activity

I'm new at Android programming and couldn't solve how to do a design problem.
I have an activity with constraint layout, and it is full of textviews and buttons.
I want to put 6 imageview tool top of to the this activity. And there should be 3 of them should be seen on the screen, other ones should be scrolls to the right side. Like the screenshot I'm uploading.
Only these 6 imageviews should be scrolling horizontally.
I don't know what to do, which tools should I use. How can I do that design?
Thanks.

For the 6 ImageViews scrolling horizontally, I would advise you make use of a RecyclerView which is very powerful in dealing with showing data in a list especially for very large data sets. You can check out how to work with a RecyclerView here.
Since you only have 6 ImageViews, you can make use of a HorizontalScrollView, a LinearLayout with orientation set to horizontal i.e android:orientation="horizontal" and then place your ImageViews inside the LinearLayout.
<HorizontalScrollView ...........>
<LinearLayout ......>
<ImageView......./>
<ImageView......./>
<ImageView......./>
<ImageView......./>
<ImageView......./>
<ImageView......./>
</LinearLayout>
</HorizontalScrollView>

The easiest solution here is a HorizontalScrollView.
As HorizontalScrollView only accepts one child, wrap your ImageViews in another layout, e.g. LinearLayout or ConstraintLayout, then put that in a HorizontalScrollView.

You can use horizontal recyclerview for imageviews and below horizontal recyclerview, you can use linear layout for textviews inside scroll view.
<ScrollView>
<LinearLayout>
<RecyclerView>
</RecyclerView>
<LinearLayout>
</LinearLayout>
</LinearLayout>
</ScrollView>

GridLayout is overlapped, when the VISIBILITY of some of its elements is set to GONE

I am developing an app on Android with this form :
<ScrollView>
<RelativeLayout>
<TextView/>
<RelativeLayout>
....
</RelativeLayout>
<gridLayout>
7 CheckBoxes
1 ImageButton
</gridLayout>
<LinearLayout>
many TextViews
</LinearLayout>
</RelativeLayout>
</ScrollView>
The ImageButton inside the gridLayout controls when some of the checkBoxes disappear (VISIBILITY->GONE) and when it's pressed (the ImageButton) the LinearLayout, which is just below it (the gridLayout), overlaps the gridLayout before it takes its final form. See the images below :
[1]: https://i.stack.imgur.com/K6aSc.png This is before the disappearance.
[2]: https://i.stack.imgur.com/nHqpj.png This happens during the disappearance.
EDIT: The problem happens because the View.GONEtakes some time to be performed visually, but the gridLayoutunderstands that it happens immediately, so it reserves the "empty" space right away. Only think I can figure out, is to set the View.INVISIBLE instead and resize the gridLayout manually. Is there a better way?
EDIT2 The problem is caused by animateLayoutChanges="true". Due to the animations, it take some time for the checkBoxes to disappear. Is there a way to force the linearLayout to "wait" for the effect of the animation to end?
Any ideas?

You can add a listener to your animation changes of animateLayoutChanges="true" and move the LinearLayout when the animation ends. More information in this thread - Listner
Also, you can try a combination of setAlpha(0) and setEnabled(false) on your checkboxes in which case gridLayout won't adjust the views again.

Most fitting View/Layout for placing several text- and image views inside, XML for Android

So I have this ScrollView inside which I have a RelativeLayout on one of my views on my Android app. Inside the RelativeLayout I already have a TableLayout that I'm using, and above it I want; 2 different text views (one header and one longer text, and I want the header to be placed on top of the longer bit of text) aswell as an ImageView that I want to be placed to the right of the 2 TextViews, and I want all 3 views to be placed on a differently colored background than the other stuff on the ScrollView such as the TableLayout for example.
I tried putting another RelativeLayout inside the ScrollView but it tells me ScrollView can only host one direct child, so that didn't really pan out. What would the most fitting way to accomplish this? Because I want this 3-view-background-thingie to scroll with the TableLayout and all the other stuff on the view.
As always, thankful for any answers or tips!
(My design kinda looks like this at the moment, schematically;)
<Container (that doesn't scroll)/>
<ScrollView
<RelativeLayout
*Alot of stuff here, such as a TableLayout for example
</RelativeLayout>
</ScrollView>

Put everything in your RelativeLayout
<ScrollView
<RelativeLayout
<LinearLayout>
<TextView>
</TextView>
<TextView>
</TextView>
<ImageView>
</ImageView>
</LinearLayout>
<TableLayout>
</TableLayout>
</RelativeLayout>
</ScrollView>
This way, the only child is the RelativeLayout, the others being children of the RelativeLayout.
Hope this helps!

Android HorizontalScrollView snap

So I have a horizontalscrollview and I want to try add a snapping effect, that basically centers an element.
I have done it all in XML basically so far.
<HorizontalScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:scrollbars="none" >
And then I have a LinearLayout inside of it.
So how do I go about making the elements inside of the LinearLayout snap? Also, is there a way to make the layout start on the middle element? So when you see the scroller, you can scroll left or right from the start.
Would appreciate any help with this! Thanks guys!

Why don't you use viewpager (http://developer.android.com/reference/android/support/v4/view/ViewPager.html)?
but if you insist to use horizontal scroll view there are some tutorial out there you can follow like this
-http://www.dev-smart.com/archives/34
-http://blog.velir.com/index.php/2010/11/17/android-snapping-horizontal-scroll/
-http://androidprogrammingmadeeasy.blogspot.com/2011/08/creating-custom-horizontal-scroll-view.html

Using layout_gravity="bottom" to place at bottom of LinearLayout

I would like to place a layout on the bottom of a LinearLayout, but I can't seem to get it to work. I know that I can use RelativeLayout to do this, but I should be able to use LinearLayout, shouldn't I?
EDIT: Actually this is more confusing than I thought. The layout below is simplified. In reality, I'm using fragments on a pre-3.0 device, with the compatibility layer.
I used Hierarchy Viewer to examine what's going on, and found that an android.support.v4.app.NoSaveStateFrameLayout was added to my layout, and that layout has layout_height set to wrap_content. That seems to be what's causing my problem, but I haven't yet figured out how to fix it.
Specifically, why doesn't this work? Shouldn't the layout_gravity place it at the bottom?
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
... stuff here ...
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:orientation="horizontal">
... more stuff here ...
</LinearLayout>
</LinearLayout>
BTW, changing layout_height to fill_parent or setting layout_weight don't seem to work either. I just want to better understand what is going on, because clearly I'm missing something important. Thanks.

First of all nice question.
Android behaves we can say weird in the situation like this.
if you have selected your parent linear layout's orientation horizontal then you can set its child component at bottom by setting its layoug_gravity=bottom. suppose you have added 2 text views in that horizontal linear layout and second textview's layout_gravity is bottom then it will set to bottom but it work like it is set at bottom in other column then the first text view. NOTE : you can set textview's layout_gravity = "left" or "right" when its parent linearlayout is horizontal but you cant see its result.
Oppositely, if you have selected parent linearlayout's orientation vertical then you can set its child component at left or right by using layout_gravity. but the second textview will shown in you can say next row with left or right gravity as you have set. NOTE you can set textview's layout_gravity = "top" or "bottom" when its linear layout is vertical but you can not see its result.
Try to make sample xml design as i have stated above so you get better idea.
Strange but True!!! Try to understand this behavior. :)

Just add space between what you want at the bottom and all the rest:
<Space
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"/>

So I resolved the problem. It's a two-part solution:
First, the way to do this without using LinearLayout is to provide weight to the element above so that it takes up all of the empty space. BTW, you can see this example in the API demos: http://developer.android.com/resources/samples/ApiDemos/res/layout/linear_layout_3.html
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
... stuff here ...
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:weight="1"/>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
... more stuff here ...
</LinearLayout>
</LinearLayout>
This by itself didn't solve my problem, as I had a NoSaveStateFrameLayout with layout_width="wrap_content" as a parent view, and so I needed to get that fixed first. I'm using code based on the wonderful Google I/O App, and when I searched the code for NoSaveStateFrameLayout, I found this:
// For some reason, if we omit this, NoSaveStateFrameLayout thinks we are
// FILL_PARENT / WRAP_CONTENT, making the progress bar stick to the top of the activity.
mRootView.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.FILL_PARENT,
ViewGroup.LayoutParams.FILL_PARENT));
Thanks for an awesome comment Google!!! I added this into my source and everything worked great!
The moral of the story: Hierarchy Viewer and comments are your friends.

LinearLayout will just stack things as they are placed in there. Since it is vertical, it will keep placing items one after the next in a vertical manner. Can you change the android:gravity of the linearLayout and not the layout_gravity of the nested one and see if that works.
RelativeLayout of course should be the first way but you stated you didnt want to do that. Is there reason for that?

It could be that, as per https://stackoverflow.com/a/13366783/513038, you need to set the parent LinearLayout to have android:baselineAligned="false". Worked in my case.