RelativeLayout: can't use layout_below with link to a LinearLayout child? - android

I have a RelativeLayout which has a LinearLayout as a child containing TextViews.
I would like to place ImageViews at the right side of the TextViews with layout_alignRight="#id/userdetail_tv_special" but somehow this is not working.
Can't I "link" a child of a RelativeLayout to a child of a LinearLayout? Any ideas how i could achieve this without creating another RelativeLayout for each Button?
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:id="#+id/userdetail_lin_btncontainer"
android:layout_width="fill_parent"
android:layout_height="50dp"
android:layout_below="#id/userdetail_lin_divider"
android:padding="6dp" >
<TextView
android:id="#+id/userdetail_tv_special"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:text="Special"
android:background="#cccccc" />
<!-- here are more TextViews like this one -->
</LinearLayout>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignRight="#id/userdetail_tv_special"
android:src="#drawable/ic_detail_special" />
<!-- much more views and stuff -->
</RelativeLayout>

It would seem logical to me that you cannot point to a "layour" deeper: you can layout the children of a RelativeLayout against each-other, but you LinearLayout is a complete view that you can use as a reference.
If you want to be able to position views relative to the textview, place them as direct children of the relativelayout. I do not see why you would need a LinearLayout here by the way.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/imgview"
android:src="#drawable/ic_detail_special" />
<LinearLayout
android:id="#+id/userdetail_lin_btncontainer"
android:layout_width="fill_parent"
android:layout_height="50dp"
android:layout_below="#id/userdetail_lin_divider"
android:layout_alignLeft="#id/imgview"
android:padding="6dp" >
<TextView
android:id="#+id/userdetail_tv_special"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"
android:text="Special"
android:background="#cccccc" />
<!-- here are more TextViews like this one -->
</LinearLayout>
<!-- much more views and stuff -->

Related

Android LinearLayout as screen footer

I have a layout like this:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="#dimen/action_bar_default_height"
android:layout_marginTop="25dp"
android:background="#drawable/gradient"
android:gravity="center_vertical"
android:orientation="horizontal" >
<ImageButton ... />
<TextView ... />
<View
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="1" />
<ImageView ... />
<ImageButton ... />
<ImageButton ... />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<!-- All extra views are inflated here, if needed -->
</LinearLayout>
<!-- Main view -->
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" />
<!-- HERE I WANT TO PUT A FOOTER -->
<LinearLayout
android:id="#+id/FOOTER"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<!-- footer.xml WILL BE INFLATED HERE -->
</LinearLayout>
</LinearLayout>
The footer is another .xml file (footer.xml) that will be inflated in the FOOTER LinearLayout.
I tried to change FOOTER to RelativeLayout and add android:layout_alignParentBottom="true" to the footer.xml LinearLayout, but it did not work.
footer.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" >
...
</LinearLayout>
Any ideas?
Since all of your LinearLayout in you XML are "wrap_content", you need to set the weight of one of them to be "1" so that guy will actually takes all the possible space. I would give it to the "Main View". basically you should add android:layout_weight="1" to it.
Changing footer to relativelayout won't work. those "relative parent bottom" stuff works if the PARENT is relative layout. not the child.
Try adding
android:layout_weight="1"
To the LinearLayout you want to take up all of the extra vertical space (I assume this would be the one under your Main view comment?)
That will force the footer linear layout to the bottom of its parent.
Also, you may want to consider just using an include tag for your footer.xml layout instead of placing it as a child of your LinearLayout with id FOOTER.
So you should be able to remove the LinearLayout with id FOOTER altogether and replace it with an include tag.
Something like:
<include android:id="#+id/FOOTER" layout="#layout/footer" android:layout_width="fill_parent" android:layout_height="wrap_content"/>
I can't see any reason why changing the patent layout to relative wouldn't work. Try removing all of the XML except the footer and see if it works. Then add it back in bit by but

How to make widget in the middle of layout stretch to fill the parent in Android

I have an Android layout question. I have a display where I am putting some text into the middle of a view that has a header at the top and three buttons at the bottom. What I am having trouble with is getting the TextView (which is inside a ScrollView) to stretch to fill up the available screen space. If I set the layout_height of the ScrollView to "fill_parent" the three buttons are pushed off the bottom of the screen. If I set it to "wrap_content" it is only as large as is needed to support the text that is put into the TextView.
Here is the XML for the layout I am using:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<LinearLayout android:orientation="horizontal"
android:gravity="top"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher">
</ImageView>
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_vertical"
style="#android:style/TextAppearance.Large"
android:text="#string/meetingdetail" />
</LinearLayout>
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView android:id="#+id/meeting"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
style="#android:style/TextAppearance.Medium" />
</ScrollView>
<Button android:id="#+id/navigation"
android:text="#string/naviation"
android:onClick="meetingInfoOnClick"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
<Button android:id="#+id/mapsingle"
android:text="#string/mapsingle"
android:onClick="meetingInfoOnClick"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
<Button android:id="#+id/goback"
android:text="#string/goback"
android:onClick="meetingInfoOnClick"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
</LinearLayout>
Could someone suggest what would work best to make the ScrollView with the TextView fill up the available space but still allow the three buttons to appear?
Set the height of the ScrollView to 0dp and its weight to 1.
<ScrollView
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1" >
<TextView android:id="#+id/meeting"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
style="#android:style/TextAppearance.Medium" />
</ScrollView>
However if you don't plan to have more than one views scrollable you should remove the ScrollView and use:
android:scrollbars="vertical"
attribute on your TextView since the TextView is scrollable itself.
Just replace your ScrollView tag code to..
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
<TextView android:id="#+id/meeting"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
style="#android:style/TextAppearance.Medium" />
</ScrollView>
It will work fine, if still you have any problem then tell me. if works then accept as answer.

How to define LinearLayout Combination

I want to create a layout for four image button. With two buttons in a row, so that it looks like a cube in the layout. Because I want to support API Level 8 i cannot use grid layout, so I tried it with a combination of LinearLayout.
A root LinearLayout with horizontal orientation, this contains two linearlayout with vertical orientation. These contain my buttons, but i does not work as expected, only one row with two buttons is visible. Can someone help me, thanks
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/action_screen"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal"
android:paddingTop="30px">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal" >
<ImageButton
android:id="#+id/btn_start_cam"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="startCamAction"
android:src="#drawable/photo_button" />
<ImageButton
android:id="#+id/btn_photo_lib"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="startPhotoLibAction"
android:src="#drawable/library_blau" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal" >
<ImageButton
android:id="#+id/btn_start_barcode"
android:onClick="startBarcodeAction"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/barcode_blau" />
<ImageButton
android:id="#+id/btn_start_qr_barcode"
android:onClick="startQRcodeAction"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/qr_code_blau" />
</LinearLayout>
</LinearLayout>
Set the height of the two child LinearLayouts to wrap_content. Otherwise the first LinearLayout will take up the whole height of the parent layout.

Difficulty with ScrollView and LinearLayout

I'm trying to make an Android layout: 3 components inside a vertical LinearLayout. The center component is a ScrollView that contains a TextView. When the TextView contains a significant amount of text (more than can fit on the screen), the ScrollView grows all the way to the bottom of the screen, shows scrollbars, and pushes the last component, a LinearLayout with a Button inside, off the screen.
If the text inside the TextView inside the ScrollView is short enough, the button at the bottom of the screen is positioned perfectly.
The layout I'm trying to achieve is:
The XML for the layout I've written is:
<?xml version="1.0" encoding="UTF-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#FFFFFF"
android:layout_marginLeft="10dip"
android:layout_marginRight="10dip"
android:layout_marginTop="10dip"
android:layout_marginBottom="10dip"
android:text="Title />
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TextView android:id="#+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:autoLink="web"
android:textColor="#FFFFFF"
android:background="#444444"
android:padding="10dip" />
</ScrollView>
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
<LinearLayout
android:orientation="horizontal"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="1"/>
<Button android:id="#+id/login_button"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_weight="1"
android:text="#string/next_button"/>
</LinearLayout>
</LinearLayout>
The scrollview is the second view object and is set to wrap_content, which is more than the screen.
I recommend a RelativeLayout. Top textview first with android:alignParentTop="true", the bottom LinearLayout next with android:alignParentBottom="true" and the scrollview listed last in the xml with the value android:alignBelow="#id/whatYouCallTheHeader.
This will align the bottom bar at the bottom of the screen, and the header at the top, no matter the size. Then the scrollview will have its own place, after the header and footer have been placed.
you should go for relativeLayout rather than LinearLayout. And you can use some properties like alignBelow and all.
Try adding a layout weight into the ScrollView ie.
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
This worked for me in a situation almost identical to the one you're presenting but left me wondering why, because it is counter-intuitive that increasing the layout weight of a control from 0 (the default if you don't specify a layout_weight) to 1 should make a control which is already using too much space smaller.
I suspect the reason it works is that by not specifying a layout_weight you actually allow the layout to ignore the size of the scroll view relative to other controls and conversely if do specify one you give it permission to shrink it in proportion to the weights you assign.
![Fixed Header-Footer and scrollable Body layout ][1]
This is what you are looking for . Most of the app in android had this type of layout ,
a fixed header and footer and a scrollable body . The xml for this layout is
<?xml version="1.0" encoding="UTF-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:background="#5599DD"
android:layout_height="fill_parent">
<!-- Header goes here -->
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#FFFFFF"
android:layout_marginLeft="10dip"
android:layout_marginRight="10dip"
android:layout_marginTop="10dip"
android:layout_marginBottom="10dip"
android:textSize="20sp"
android:layout_gravity="center"
android:text="Title" />
<!-- Body goes here -->
<ScrollView
android:layout_weight="1"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:autoLink="web"
android:text="#string/lorem_ipsum"
android:textColor="#FFFFFF"
android:padding="10dip" />
</ScrollView>
<!-- footer goes here -->
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<Button
android:id="#+id/login_button"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_gravity="bottom"
android:layout_alignParentRight="true"
android:text="Button"/>
</RelativeLayout>
</LinearLayout>
</LinearLayout>

problem adding linearlayout after listview

i am the new android development.i got one problem i.e. in my application i added listview for the activity.after listview i added one linear layout in that i took one imageview and textview.my problem is for this one it cannot show the last row in the emulator but it displays the imageview and textview.but its not displaying the last row of the listview.i cannot understand what is the problem having so can you know please help my xml code is below see it once....
-->
<LinearLayout
android:id="#+id/search_layout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<AutoCompleteTextView android:id="#+id/autocomplete_country"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginLeft="5dp"
android:singleLine="true"
android:hint="Search"/>
</LinearLayout>
<!-- <ScrollView android:id="#+id/scrollView1"
android:layout_width="wrap_content"
android:layout_height="match_parent"> -->
<ListView android:id="#+id/listview"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/search_layout"
android:layout_centerHorizontal="true"
android:layout_above="#+id/ban_layout"/>
<!-- </ScrollView> -->
</RelativeLayout>
<!-- </ScrollView> -->
<!-- <RelativeLayout android:layout_width="fill_parent"
android:layout_height="wrap_content"> -->
<!-- </RelativeLayout> -->
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_below="#id/listview"
android:background="#android:color/black"
android:id="#+id/ban_layout">
<ImageView
android:src="#drawable/orbit"
android:layout_width="50dip"
android:layout_height="50dip"
android:scaleType="fitCenter"/>
<TextView android:text="TextView"
android:layout_width="fill_parent"
android:layout_height="60dip"
android:gravity="center"></TextView>
</LinearLayout>
Its because the your linear layout [ban_layout] is covering up your listview, as you have set it to align towards the bottom of the parent.
Quick Hacks,
Add an extra row and set its inside elements to invisible in your listview adapter
or
Add an bottom margin to your listview that compensates the footer
Your best solution would be to rework the parent relativelayout and set up a linearlayouts with weights

Categories

Resources