Develop Reference

How to place 2 views to the bottom of the parent but one stacked above the other?

In a RelativeLayout if a view has android:layout_alignParentBottom="true” then it is placed to the bottom of the parent.
If 2 views have android:layout_alignParentBottom="true” then both are placed on the bottom, but 1 above the other.
How can I have 2 view to have the setting android:layout_alignParentBottom="true” and one to be stacked over the other?
android:layout_above seems to be not applicable/working for this case.

Put the views inside a LinearLayout with orientation - vertical, and put
layout_alignParentBottom=true
To the LinearLayout;
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:background="#color/black"
android:layout_height="match_parent">
<LinearLayout
android:layout_alignParentBottom="true"
android:background="#color/red"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</RelativeLayout>

layout_above means "above" in a Y direction, not in a Z direction, if that makes sense. If you want them to overlay, remove the layout_above attribute and make them both layout_alignParentBottom=true.

They won't be placed one after another if you have set only android:layout_alignParentBottom="true”. Please paste your layout xml so that the real issue can be found.

Android - nested layouts

I have built the following XML layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#color/white"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/ll1"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="0.2"
android:orientation="horizontal" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="0.3"
android:gravity="center"
android:src="#drawable/logo" />
<TextView
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="0.7"
android:gravity="center"
android:text="#string/my_profile"
android:textColor="#A669DA"
android:textSize="20sp" />
</LinearLayout>
<LinearLayout
android:id="#+id/ll2"
android:background="#A669DA"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="0.15"
android:orientation="horizontal" >
<TextView
android:id="#+id/TextView"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="10dp"
android:layout_marginTop="20dp"
android:text="#string/payroll_header"
android:textColor="#FFFFFF"
android:textSize="20sp" />
</LinearLayout>
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="0.65" >
<LinearLayout
android:id="#+id/ll3"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:orientation="vertical"
android:weightSum="2" >
<ExpandableListView
android:id="#+id/expandableListView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fadeScrollbars="true" >
</ExpandableListView>
<HorizontalScrollView
android:id="#+id/horizontalScrollView1"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<ExpandableListView
android:id="#+id/expandableListView2"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
</ExpandableListView>
</HorizontalScrollView>
<ListView
android:id="#+id/listView1"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
</ListView>
</LinearLayout>
</ScrollView>
</LinearLayout>
The root element of this XML layout is a linear layout. It contains 2 linear layouts and one scroll. Since scroll view can only have one child, it contains a linear layout which in turn contains an expandable listView, horizontal scrollview (which contains an expandable listview) and a listview. As you can see, this is a very complicated layout, and I think it should be possible to simplify. Basically, I want the top 2 linear layouts to always take 35% of the screen, and the scrollview to take the rest. That's why I gave a weight of 0.2 to the first linear layout, 0.15 to the second linear layout, and 0.65 to scrollView.
Within the scrollView, I would like each of the 3 elements to take as much space as they would need, so that user scrolls down if he/she doesn't see everything. I know that expandableListView and ListView are already scrollable, so I will disable scrolling in them, so that parent's scroll bar is used.
However, I am facing several problems with this design:
1) In the first screenshot, you can see an expandableListView, horizontalScrollBar (with an expandableListView), and a listView.
Each of them has height set to "wrap content", so I would expect each of them to take as much space as they need. However, you can see in the second screenshot that when I open the second expandable listView (the one within a horizontal scrollBar), listview doesn't move down to make space for the expanded list view. How can I achieve it, so that each of them moves down when the expandable list above expands? Is the only way to do it is to combine them all in one expandableListView?
2) My second expandableListView is in the horizontalScrollBar, however, I can't scroll it horizontally. Can I even put horizontal scrollBar inside a vertical scrollBar?

First off, a little simplification: Your second LinearLayout (the 0.15 one) can be left out since it only has a single child. Just be sure to adjust the layout parameters of that single child (the TextView).
For your problem #1, try calling invalidate() or requestLayout() on your root view.
Problem #2 is actually solved: Link
My general impression is that this nesting of ScrollViews and ListViews is pretty complex. Have you considered alternatives such as TabLayout or DrawerLayout?
Cheers

Center ListView horizontally

As easy as it seems to be, as stubbornly this ListView won't center itself (or it's content within - doesn't matter to me).
This is activity layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
tools:context="com.drobiazko.den.mobineon.MainActivity"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:gravity="center_horizontal"
android:background="#drawable/bg">
<RelativeLayout android:id="#+id/clock_container"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<!--<RelativeLayout android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/holo_blue_dark">-->
<com.drobiazko.den.mobineon.ListViewRowsHeight
android:id="#+id/listview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:overScrollMode="never"
android:scrollbars="none"
android:divider="#null"
android:listSelector="#android:color/transparent"
android:persistentDrawingCache="scrolling|animation"
android:background="#android:color/holo_green_dark" />
<!--</RelativeLayout>-->
</LinearLayout>
This is ListView's item layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView android:id="#+id/btn_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="#style/custom_btn_icon" />
<TextView android:id="#+id/btn_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="#style/custom_btn_name" />
<TextView android:id="#+id/btn_count"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
style="#style/custom_btn_count" />
</RelativeLayout>
I've tried everything (including simplifying layout to max), but it still won't go.
Funny that the first relative layout clock_container - centers like a charm, due to parent LinearLayout's android:gravity="center_horizontal". Why won't ListView?
Added later:
Inspired by FOliveira's answer, I've done some investigation and found that:
everything works fine, parent LinearLayout has android:gravity="center_horizontal" and centers his children respectfully. The reason for ListView's children are left-aligned is that ListView takes all possible width despite his android:layout_width="wrap_content" attribute.
Anyone knows why is that?

First of all , i would remove the first linear layout and stay only with the relative layout as the parent.
After having the relative layout as the main parent , set the CENTER_IN_PARENT attribute to true.
The mistake you are making is that you are setting the gravity of Linear Layout child to center horizontal, which is correct, but the only children being affected by this option is the Relative layout itself.

Layout_weight to get 2 equal height layouts

I'm currently modifying an xml layout, and I want to group all of the views into 2 sections, each half of the height available. The layout looks something like this:
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
...Lots of stuff...
</LinearLayout>
What I've done is to wrap each "half" of the views in a linear layout, and assign a weight to each.
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<!-- Top half -->
<LinearLayout
android:layout_weight="1"
android:layout_height="0dp"
android:layout_width="fill_parent"
android:orientation="vertical">
... stuff and things ...
</LinearLayout>
<!-- Bottom half -->
<LinearLayout
android:layout_weight="1"
android:layout_height="0dp"
android:layout_width="fill_parent"
android:orientation="vertical">
... things and stuff ...
</LinearLayout>
</LinearLayout>
I can't figure out why this doesn't give me 2 equal panes. The lower one seems to take up 90% of the available space. I've tried adding (android:weightSum="2") to the container layout, but to no avail. None of these layouts have IDs, so the code behind shouldn't be able to modify them. Any idea what is going on here? Are the child views able to modify their "half" containers so that they wouldn't appear equal?

This link may be of some use to you:
http://www.chess-ix.com/blog/the-use-of-layout_weight-with-android-layouts/
What you are doing seem to be correct, but probably the content in your Linearlayouts may be the culprit.

Trying adding a weightSum to the parent LinearLayout, like so:
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:weightSum="2">
<!-- Top half -->
<LinearLayout
android:layout_weight="1"
android:layout_height="0dp"
android:layout_width="match_parent"
android:orientation="vertical">
... stuff and things ...
</LinearLayout>
<!-- Bottom half -->
<LinearLayout
android:layout_weight="1"
android:layout_height="0dp"
android:layout_width="match_parent"
android:orientation="vertical">
... things and stuff ...
</LinearLayout>
</LinearLayout>
Also, I change layout_height of the children: you won't need fill_parent for the child LinearLayouts since the parent has that property already.

How to make several RelativeLayouts each occupying a potion of the screen?

I want to have a relative layout inside another full-screen relative layout, occupying full width but 50% of its parent's height, preferably done with XML and not java code.
I have figured out how how to align parent's center, and how to fill up the width, but is there a way to get 50% of parent's height? What about 30%? 6.2834%?
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="fill_parent">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="??????????"
android:layout_centerInParent="true" >
The reason I'm trying to do percentage is that, if I specify it with "dip", while the object will remain the same size, the layout will look a lot different on different screen sizes (e.g. a phone and a tablet).
EDIT:
Thank you for all the answers about using LinearLayout and weighting. I have looked at that before, too. I feel I might have over-simplified the problem. Say I need something like this:
I suppose I could use complicated LinearLayout and weighting to outline the center square, then having the center square to fill_parent, like so:
But then what should I do with the other 3 squares (layouts)? Can I have another "layer" of LinearLayout for another square? Or should I divide up the whole screen into many, many small cells and having these sublayouts span over multiple cells (not sure if this is even possible)?

Try to use LinearLayout with weightSum
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="2"
android:gravity="center_vertical"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#FF0000">
</RelativeLayout>
</LinearLayout>

If you don't absolutely need it nested in one RelativeLayout you can use weight in a LinearLayout as others have pointed out. I just added in an additional RelativeLayout above and below so you can use the rest of the screen if you are trying to. If not, just remove the other RelativeLayouts.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/ParentLinearLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="10" >
<RelativeLayout
android:id="#+id/RelativeLayoutTop"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="2.5"
android:background="#color/torange" >
</RelativeLayout>
<RelativeLayout
android:id="#+id/RelativeLayoutMid"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="5"
android:background="#color/tpurple"
android:padding="8dp" >
<TextView
android:id="#+id/description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="#string/describe"
android:textAppearance="?android:attr/textAppearanceLarge" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/RelativeLayoutBottom"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="2.5"
android:background="#color/torange" >
</RelativeLayout>

I usually go with a LinearLayout for this and set the weight to a certain percentage :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<View
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="25"/>
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="50">
</RelativeLayout>
<View
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="25"/>
</LinearLayout>
To your edit:
At some point you need to determine the layout. Start by taking the layout in groups. Look for patterns. In your simple explanation we have devised a way using a linearlayout to group 3 objects with one in the middle. With your new layout, could you group those items in any way?
Once you have simple layout patterns set, maybe add specific spacing that you are looking for by defining weights. Then you might want to add a relative layout and start anchoring views to specific views. Ask yourself do they overlap? Does one view always position on top of other views or on the sides. What defines the bounds of your views and then take it from there using linear layouts, weights, relative layouts, toLeftOf, toRightOf, bellow, above, margins, and padding.
Here is an example of what I mean by grouping like objects. It's by no means the best solutions but that all depends on how you define the positioning parameters.
Yellow = vertical linear layout
Green = horizontal linear layouts
You have 1 large vertical layout and inside two horizontal layouts with multiple objects inside of that. From there you can break it down into easier to manage portions on how to arrange and item within that layout. Now with relative layouts you could position items relative to another object, you could remove some of the work handled by the linear layouts but you will then be defining their distance relative to the other objects and might have to fiddle to get the layout to adjust properly on different screen sizes (reason to not use static positioning).

Maybe try using a LinearLayout with 3 layouts inside with android:layout_weight set to 1, 2, 1.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<RelativeLayout
android:background="#FF0000"
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="0dip" >
</RelativeLayout>
<RelativeLayout
android:background="#00FF00"
android:layout_weight="2"
android:layout_width="match_parent"
android:layout_height="0dip" >
</RelativeLayout>
<RelativeLayout
android:background="#FF0000"
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="0dip" >
</RelativeLayout>
</LinearLayout>

RelativeLayout does not support percentage of width and height for children. Use LinearLayout with android:layout_weight attribute.