Develop Reference

Android linear layout difficulties

I have a portrait xml layout file which contains a text-box which rests onto of an ImageView. This was done using a vertical linear layout. The trouble is, I have created a landscape xml layout file, but I don't know how to insert a text box above the ImageView in this particular layout file. For some reason i'm having trouble.
To summarize, I want to replicate the style I had in my portrait xml (with regards to the text-box and ImageView relationship). Pictures below should clarify exactly what I mean. Icons are covered in gray on purpose, but you get the general idea.
My Landscape xml:
<?xml version="1.0" encoding="utf-8"?>
<!-- This relative layout will center EVERYTHING within it. Do not touch this functionality. -->
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/relative_layout"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ProgressBar
android:id="#+id/progressBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<com.edmodo.cropper.CropImageView
xmlns:custom="http://schemas.android.com/apk/res-auto"
android:id="#+id/CropImageView"
android:layout_width="0dip"
android:layout_height="fill_parent"
android:layout_weight="1"
android:gravity="center" >
</com.edmodo.cropper.CropImageView>
<LinearLayout
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight=".12"
android:gravity="center" >
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical"
tools:ignore="UselessParent" >
<ImageView
android:id="#+id/button1of3"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:contentDescription="#string/button1_description"
android:src="#drawable/ic_action_rotate"
android:visibility="invisible"
tools:ignore="Suspicious0dp" />
<ImageView
android:id="#+id/button2of3"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:contentDescription="#string/button3_description"
android:padding="2dp"
android:src="#drawable/ic_action_camera" />
<ImageView
android:id="#+id/button3of3"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:contentDescription="#string/button4_description"
android:src="#drawable/ic_action_feed" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</RelativeLayout>

Just wrap your CropImageView inside a layout, for example, a LinearLayout
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/relative_layout"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ProgressBar
android:id="#+id/progressBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="0dip"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical" >
<TextView
android:id="#+id/test"
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight=".12"
android:text="Test" />
<com.edmodo.cropper.CropImageView
xmlns:custom="http://schemas.android.com/apk/res-auto"
android:id="#+id/CropImageView"
android:layout_height="0dip"
android:layout_width="fill_parent"
android:layout_weight=".88"
android:gravity="center" >
</com.edmodo.cropper.CropImageView>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight=".12"
android:gravity="center" >
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical"
tools:ignore="UselessParent" >
<ImageView
android:id="#+id/button1of3"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:contentDescription="#string/button1_description"
android:src="#drawable/ic_action_rotate"
android:visibility="invisible"
tools:ignore="Suspicious0dp" />
<ImageView
android:id="#+id/button2of3"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:contentDescription="#string/button3_description"
android:padding="2dp"
android:src="#drawable/ic_action_camera" />
<ImageView
android:id="#+id/button3of3"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:contentDescription="#string/button4_description"
android:src="#drawable/ic_action_feed" />
</LinearLayout>
</LinearLayout>
</LinearLayout>

The android layout lacks proportion when I set the background of Imagebutton.

The android layout lacks proportion when I set the background of Imagebutton.
And the code of xml is like the following:
<?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:baselineAligned="false"
android:orientation="vertical" >
<FrameLayout
android:id="#+id/player_frame"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="#+id/buttonLayout" >
<FrameLayout
android:id="#+id/player_surface_frame"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center" >
<SurfaceView
android:id="#+id/player_surface"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="center" />
</FrameLayout>
</FrameLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<Button
android:id="#+id/findCameraButton"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="4"
android:text="#string/label_find_camera" />
<Button
android:id="#+id/SettingButton"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="4"
android:text="#string/Camera_WiFi_setup" />
<ImageButton
android:id="#+id/FileSavebutton"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="4"
android:background="#drawable/save_in_camera" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/TimeStampLabel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dip"
android:text=""
android:textColor="#ffff00"
android:textAppearance="?android:attr/textAppearanceMedium" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
<Button
android:id="#+id/snapshotButton"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="4"
android:text="#string/label_app_snapshot" />
<Button
android:id="#+id/recordButton"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="4"
android:text="#string/label_app_record" />
<ImageButton
android:id="#+id/photo_record_mode"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="4"
android:background="#drawable/turn_to_photomode"/>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
How to setup can make the top of LinearLayout no deformation like the LinearLayout of bottom ?

Have you tried changing all the android:layout_height values from match_parent to wrap_content?

i think you should use scaleType to get your image look nice
prefer fitXY
like that
android:scaleType="fitXY"
put inside your xml to be whole code like that
<ImageButton
android:id="#+id/photo_record_mode"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="4"
android:background="#drawable/turn_to_photomode"
android:scaleType="fitXY"/>

3 layouts - middle is flexible

I need the following thing:
3 layouts:
Header
Content
Footer
Header must be on the top footer must be sticked to the bottom (android:layout_alignParentBottom="true").
But how to make middle to occupy the whole other screen? Thanks.

Here is my solution (with android:layout_weight and ScrollView):
<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" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#DDDDDD"
android:gravity="center"
android:orientation="vertical" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Header"
tools:ignore="HardcodedText" />
</LinearLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="3" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Content"
tools:ignore="HardcodedText" />
</ScrollView>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#DDDDDD"
android:gravity="center"
android:orientation="vertical" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Footer"
tools:ignore="HardcodedText" />
</LinearLayout></LinearLayout>
And the result picture :

Hi Use the following lines
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/button1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:text="Button" >
<Button
android:id="#+id/button2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Header" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="#+id/linearfooter"
android:layout_below="#+id/button1"
android:background="#android:color/darker_gray"
>
</LinearLayout>
<LinearLayout
android:id="#+id/linearfooter"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:text="Button" >
<Button
android:id="#+id/button2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="footer" />
</LinearLayout>
</RelativeLayout>
hope this helps you.

Use a height of 0dp and
android:layout_weight
set to 1

Finally I've got the next solution:
To the middle layout I added:
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#id/footer"
android:layout_below="#id/header"
android:layout_weight="1">
And it works!

ListView inside tab is not filling height?

I'm using TabHost and inside of one tab, I inserted ListView. I set all height's to fill_parent. But it doesn't show full list, but only part of it. What to do to make tab contents fill screen by height?
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/bkg"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="7dp"
android:layout_marginRight="7dp"
android:layout_marginTop="7dp"
android:background="#drawable/gradientrounded"
android:orientation="horizontal" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:src="#drawable/taxisign" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:id="#+id/taxiprofiletitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:layout_weight="0.9"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textColor="#000000" />
<Button
android:id="#+id/phonenumber"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="4dp"
android:layout_marginLeft="15dp"
android:layout_marginRight="15dp"
android:layout_marginTop="5dp"
android:background="#drawable/button"
android:paddingBottom="5dp"
android:paddingTop="5dp"
android:text="Button"
android:textColor="#ffffff" />
</LinearLayout>
<ProgressBar
android:id="#+id/loadFeedbacks"
style="?android:attr/progressBarStyleLarge"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_gravity="center"
android:visibility="invisible" />
</LinearLayout>
<TabHost
android:id="#android:id/tabhost"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFFF0000" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TabWidget
android:id="#android:id/tabs"
android:layout_width="match_parent"
android:background="#FF000000"
android:layout_height="wrap_content" >
<TextView
android:tag="tab0"
android:text="Инфо"
android:background="#android:drawable/btn_star_big_on"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
/>
<TextView
android:tag="tab1"
android:text="Отзывы"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
/>
<TextView
android:tag="tab2"
android:text="Тарифы"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
/>
</TabWidget>
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1" >
<LinearLayout
android:id="#+id/tab1"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="#+id/profile_info"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Info" />
</LinearLayout>
<LinearLayout
android:id="#+id/tab2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView android:text="Добавить"
android:layout_width="match_parent"
android:layout_height="wrap_content">
</TextView>
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
<ListView
android:id="#+id/reviewslist"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
</ListView>
</LinearLayout>
<LinearLayout
android:id="#+id/tab3"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ListView
android:id="#+id/tariffslist"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1" >
</ListView>
</LinearLayout>
</FrameLayout>
</LinearLayout>
</TabHost>
</LinearLayout>
</ScrollView>

On your very first LinearLayout change the layout_height="match_parent". Also, fill_parent has been deprecated since API 8 and replaced with match_parent so that is what you should be using instead.

You have used wrap content for your listView height. You should always use height as match_parent/fill_parent. I guess your problem is here
<ListView
android:id="#+id/reviewslist"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
</ListView>
change it to:
<ListView
android:id="#+id/reviewslist"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</ListView>
Adding to that, this layout seems to be innefcient. Listviews inside scrollviews are not recommended.

It does seem while quickly viewing the XML file that the parent of your TabHost (LinearLayout) is 'wrap_content' so I am not sure that you are getting all the parents. I do desire a better UI interface for building visuals through Eclipse. Not too happy to work out issues like this when they come up. And they can come up frequently. Usually it involves some trial and error to get things looking the way I want.

Scroll Layout was unnecessary, removing it, made code to work

ANDROID linearlayout fill remaing space using weight

I am trying to get my controls so that I display a control that has a button and an image that takes up the remaining space. I have been looking at using weights I can get it to work on the width but as soon as I use the weight on height nothing is displayed, my code is as follows:
<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" >
<LinearLayout android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:baselineAligned="true" android:weightSum="100">
<com.example.test.MyImageView
android:id="#+id/test_img"
android:layout_height="0dp"
android:layout_width="wrap_content"
android:layout_weight="75"
android:scaleType="fitCenter"
/>
<Button
android:id="#+id/RedrawBtn"
android:layout_height="0dp"
android:layout_width="wrap_content"
android:layout_weight="25"
android:text="Button" />
</LinearLayout>
</RelativeLayout>

you haven't given orientation to LinearLayout
<LinearLayout android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:baselineAligned="true" android:weightSum="100"
android:orientation="vertical">
<com.example.test.MyImageView
android:id="#+id/test_img"
android:layout_height="0dp"
android:layout_width="wrap_content"
android:layout_weight="75"
android:scaleType="fitCenter"
/>
<Button
android:id="#+id/RedrawBtn"
android:layout_height="0dp"
android:layout_width="wrap_content"
android:layout_weight="25"
android:text="Button" />
</LinearLayout>

try this code
<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" >
<LinearLayout android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:baselineAligned="true"
android:orientation="vertical">
<com.example.test.MyImageView
android:id="#+id/test_img"
android:layout_height="0dp"
android:layout_width="wrap_content"
android:layout_weight="1"
android:scaleType="fitCenter"
/>
<Button
android:id="#+id/RedrawBtn"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Button" />
</LinearLayout>
</RelativeLayout>

Write below code instead of your code, it will solve your problem.
<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" >
<com.example.test.MyImageView
android:id="#+id/test_img"
android:layout_height="match_parent"
android:layout_width="wrap_content"
android:layout_weight="75"
android:scaleType="fitCenter" />
<Button
android:id="#+id/RedrawBtn"
android:layout_height="match_parent"
android:layout_width="wrap_content"
android:layout_weight="25"
android:text="Button" />
</LinearLayout>