Develop Reference

Android: height of LinearLayout didn't fill parent of ListView item

I have a ListView, the item is a RelativeLayout, at left is text, and the right side is ImageView in a LinearLayout.
I expect the height of the LinearLayout**(white background)** to be fillParent but it didn't.
The effect is :
Anyone can help on this?
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/main_list_item"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation="vertical" >
<TextView
android:id="#+id/main_list_item_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/main_list_item_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/main_list_item_more"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:id="#+id/main_list_item_delete_layout"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:background="#ffffff"
android:gravity="center"
android:orientation="horizontal" >
<ImageView
android:id="#+id/main_list_item_delete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/main_list_item_check_margin_lr"
android:layout_marginRight="#dimen/main_list_item_check_margin_lr"
android:contentDescription="#string/none"
android:gravity="center"
android:src="#drawable/ic_ctx_del1" />
</LinearLayout>
</RelativeLayout>
The main.xml is as below which contains the ListView:
<?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"
android:gravity="fill"
android:orientation="vertical" >
<!-- content -->
<LinearLayout
android:id="#+id/center"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="#dimen/main_margin"
android:layout_marginRight="#dimen/main_margin"
android:orientation="vertical"
android:layout_above="#id/adview_ayout">
<ListView
android:id="#+id/main_list"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
</ListView>
</LinearLayout>
<!-- content end -->
<LinearLayout
android:id="#+id/main_layout_pb"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:color/transparent"
android:gravity="center"
android:orientation="vertical"
android:clickable="true"
android:visibility="gone">
<ProgressBar
android:id="#+id/main_pb"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical|center_horizontal" >
</ProgressBar>
</LinearLayout>
enter code here

I believe this is something that the parent RelativeLayout can't handle by itself - it creates kind of a vicious circle - parent defers the height to the child (wrap_content on the RelativeLayout) and the child defers the height to the parent (match_parent on main_list_item_delete_layout).
What you can do is to anchor the top of the main_list_item_delete_layout to the parent and its bottom to another view that is guaranteed to be the bottom (the LinearLayout on the left, containing the three text views):
<RelativeLayout ...>
<LinearLayout
android:id="#+id/left_layout"
android:layout_toLeftOf="#+id/main_list_item_delete_layout"
android:layout_toStartOf="#+id/main_list_item_delete_layout"
...
>
</LinearLayout>
<LinearLayout
android:id="#+id/main_list_item_delete_layout"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:layout_alignParentTop="true"
android:layout_alignBottom="#id/left_layout"
...>
</LinearLayout>
</RelativeLayout>
PS: in your example, in case the text on the left LinearLayout is too long, it will overflow and overlap the delete layout - hence the addition of the anchor I added to the left layout.
PS2: I know this solution is very customized to your layout. If you are set on using the RelativeLayout as a parent, you might want to try the new ConstraintLayout.

Vertical RelativeLayout: how to achieve fixed header and footer and scrollable main area?

This is a layout I'm having problems with (this is for ListActivity):
<RelativeLayout 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" >
<TextView
android:id="#+id/path"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true" />
<ListView
android:id="#android:id/list"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/path" />
<TextView
android:id="#android:id/empty"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#android:id/list" />
<Button
android:id="#+id/negative_button"
style="#style/Button"
android_alignParentBottom="true"
android:layout_below="#android:id/empty"
android:layout_weight="1" />
</RelativeLayout>
What happens right now is the list is below header TextView ("path") as it should be, the button is at the bottom also as it should be, but the ListView is not aligned between the header (textview) and footer (button). Instead, the button is simply slapped on top of listview. How can I fix that?

You need to define the footer and header before the list, try something like this:
<RelativeLayout 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" >
<TextView
android:id="#+id/path"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
<!-- to see the button, you must to declare its width/height here
and not (as I think you did) in the style.xml -->
<Button
android:id="#+id/negative_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
style="#style/Button"
android:layout_alignParentBottom="true" />
<!-- also layout_weight doesnot change anything in RelativeLayout -->
<ListView
android:id="#android:id/list"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/path"
android:layout_above="#id/negative_button" />
<TextView
android:id="#android:id/empty"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#android:id/list" />
</RelativeLayout>

The TextView "empty" should not be below the TextView "empty".
If the Button must be at the bottom of the screen you can use
android:layout_alignParentBottom="true"
For the Button
Otherwise you can use this layout :
<RelativeLayout 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" >
<TextView
android:id="#+id/path"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true" />
<LinearLayout
android:id="#+id/container"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/path">
<ListView
android:id="#android:id/list"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
<TextView
android:id="#android:id/empty"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#android:id/list" />
</LinearLayout>
<Button
android:id="#+id/negative_button"
style="#style/Button"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/container" />
</RelativeLayout>
Or ever add the Button as a footer of you Listview :
mListView.addFooterView(mButton);
http://developer.android.com/reference/android/widget/ListView.html#addFooterView(android.view.View)

The only things that you used are the ListView, the first TextView as a "top bar" and the Button as a "bottom bar", right? If it is the case, why did you keep the empty TextView?
Try to remove it and try this 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:orientation="vertical" >
<TextView
android:id="#+id/path"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
<ListView
android:id="#android:id/list"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1" />
<!-- work also with android:layout_height="0dip" -->
<Button
android:id="#+id/negative_button"
style="#style/Button"
android:layout_gravity="bottom"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
</LinearLayout>
Saw on these questions, it might be help you:
1. Layout for ListView at top and Buttons in Bottom?
2. Android Layout with ListView between a "top bar" and "bottom bar"
3. Add a button in bottom of listview when the listview is empty (using ListActivity)
Hope this will be helpful and you'll have the expected result.

Android ScrollView content disappearing on removing background attribute

I have a ScrollView in a LinearLayout along with a header LinearLayout on top. I have given the main LinearLayout a background. If I keep the background for the ScrollView everything displays fine. But If I add a lot of content then the ScrollView background stretches. So I want to keep the ScrollView transparent.
But if I remove the background attribute or if I try android:background="#android:color/transparent" the content inside the ScrollView vanishes. All I can see is the header and the background from the outer LinearLayouts.
This is how I want my Views:
<Linear Layout with background image>
<Header Linear Layout>
</Header Linear Layout>
<ScrollView with no background>
<Layouts in Scroll View>
</ScrollView>
Here is the code:
<?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:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/bg"
android:orientation="vertical" >
<include layout="#layout/topbar" />
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
style="#style/Labels"
android:text="#string/posts_add_postcontent" />
<EditText
android:id="#+id/postsAddContent"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:hint="#string/posts_add_postcontent_h"
android:inputType="textMultiLine"
android:maxLength="3000"
android:minLines="3" />
</LinearLayout>
</ScrollView>
</LinearLayout>
Note: The header LinearLayout is included via another file:
<?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:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<RelativeLayout
android:id="#+id/topbar"
android:layout_width="fill_parent"
android:layout_height="30dip"
android:background="#layout/bgtop_repeat"
android:orientation="horizontal"
android:paddingTop="2dip" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:contentDescription="#string/app_name"
android:src="#drawable/cornerlogo" />
<Button
android:id="#+id/menubuton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:background="#drawable/menubutton" />
</RelativeLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#layout/headshadow_repeat"
android:orientation="horizontal" />
</LinearLayout>
Thanks in advance :)

Try
android:layout_height="wrap_content"
in included layout

android Layouts overlapping ListView and LinearLayout

I am using FrameLayout in which I am having a search Textbox and Button and a ListView to be displayed in the next line of the TextBox
My layout is like this ,
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scaleType="fitXY"
android:src="#drawable/pattern1" />
<LinearLayout
android:id="#+id/LinearLayout02"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_gravity="top" >
<Button
android:id="#+id/btnadd"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:onClick="addCustomers"
android:text="Add"
android:textColor="#000000" >
</Button>
<EditText
android:id="#+id/edtSearch"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="2"
android:ems="10"
android:hint="Search"
android:inputType="textPersonName" >
<requestFocus />
</EditText>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginTop="60dp"
android:gravity="bottom"
android:orientation="vertical">
<ListView
android:id="#+id/list_customers"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="bottom|center_horizontal" >
</ListView>
</LinearLayout>
</FrameLayout>
I am using this TextView to diplay List item in the ListView,
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/txtsimple_list"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="60dp"
android:gravity="center_vertical"
android:textSize="20sp"
android:textStyle="bold" />
I have given margin top attribute for the ListView, but even though it overlaps on the Button and EditText controls.
I am using a FrameLayout but of no use. Please suggest me any help!!
Any help is appreciated!!

You should use LinearLayout as parent, just set android:orientation="vertical".
<?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" >
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scaleType="fitXY"
android:src="#drawable/pattern1" />
<LinearLayout
android:id="#+id/LinearLayout02"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_gravity="top" >
...
</LinearLayout>
<ListView
android:id="#+id/list_customers"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="bottom|center_horizontal" >
...
</ListView>
</LinearLayout>

FrameLayout has no 'rules of placement' so everything just stacks on to each other.
Instead, use a LinearLayout with android:orientation="vertical"
or use a RelativeLayout and add positioning values to the childs, such as android:layout_below

+1 Neoh and remove imageview, instead put the image as background image attribute at parent view
android:background="#drawable/pattern1"

FrameLayout are used very less,beacuse they are used to display single view or views which overlaps each other.
So you should use RelativeLayout.

FrameLayout is not the best option. You can use other layouts, eg, GridLayout, RelativeLayout or ListView.

Use ListView as background of TextView

I have the below layout which contain mainly:
Relative layout, which act as header with Textview and button.
and Listview.
I would like to make the "header" which is the above relative layout to be transparent and show the listview as user scroll down the list view.
I know how to make the layout transparent, but I dont know how to show the listview as background for the "header".
<?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
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/buttonlayout2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:background="#FFDBE2ED"
android:paddingBottom="0dp"
android:paddingTop="0dp"
>
<TextView
android:id="#+id/txtTest"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:gravity="center_vertical"
android:layout_centerVertical="true"
android:paddingLeft="0dp"
android:text="#string/list_header"
android:textColor="#000000"
android:textSize="25sp"
android:textStyle="bold">
</TextView>
<Button
android:id="#+id/btnClear"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="0px"
android:layout_marginLeft="10px"
android:layout_marginRight="3px"
android:layout_marginTop="6px"
android:height="0dp"
android:text="Clear"
android:textSize="15sp"
android:width="70dp"
android:layout_alignParentRight="true"
>
</Button>
</RelativeLayout>
<ListView
android:id="#+id/mylist1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/form"
android:layout_alignParentTop="true" >
</ListView>
</LinearLayout>

You are using a LinearLayout as the root container and in linear layout the views are placed one over the other so you cannot overlap one view over the other. If you want an overlapping effect you can use either the FrameLayout or the RelativeLayout as the root container.
Using RelativeLayout is a better option.
Here is sample code for this:
<?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"
android:orientation="vertical" >
<ListView
android:id="#+id/list"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
</ListView>
<Button
android:id="#+id/view"
android:layout_width="fill_parent"
android:layout_height="100dp"
android:background="#00cc0000"
android:layout_alignParentTop="true" />
</RelativeLayout>
Here the button is overlapping the list view.
I hope this will help :)

Try moving the ListView inside of your RelativeLayout, as the first element (this ensures that it's in the back). This way, the other views are just on top of the ListView, and if you make them transparent you should get the desired effect!
Oh, and you should make the ListView then fill the RelativeLayout:
<ListView
android:id="#+id/mylist1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true" >
</ListView>
, and make the RelativeLayout fill the screen:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/buttonlayout2"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
...