LinearLayout inside another LinearLayout issue

Question

i have a LinearLayout inside another LinearLayout . the issue i have is that the ToggleButton is not visible in the second LinearLayout ..here is my complete UI.also i want to know is this layout design efficient or no. i know i can use TableLayout but then i have problem in fitting 3 components on one line

<?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="match_parent"
android:orientation="vertical"
android:padding="10dip" >

<TextView
    android:id="@+id/supplierNameTV"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/supplierNameTV"
    android:textColor="#FFFFFF" 
    android:layout_gravity="right"/>

<LinearLayout android:orientation="horizontal" 
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content"> 

    <AutoCompleteTextView
        android:id="@+id/supplierName_CB"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" />

    <ToggleButton
        android:id="@+id/toggleButton1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="right"
        android:checked="false"
        android:text="ToggleButton" />

</LinearLayout>
<TextView
    android:id="@+id/prodNameTV"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/prodNameTV"
    android:textColor="#FFFFFF" 
    android:layout_gravity="right"
    android:layout_marginBottom="5dip"
    android:layout_marginTop="5dip"/>

<AutoCompleteTextView
    android:id="@+id/prodName_CB"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"/>

<Button
    android:id="@+id/add_button"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="@string/addproduct_button"
    android:textColor="#372c24" />


<ListView
    android:id="@+id/listview"
    android:layout_height="wrap_content"
    android:layout_width="match_parent">
</ListView>


</LinearLayout>

Answer 1

With LinearLayout, you can easily assign layout weight. The root layout will have the weightsum of 100 and then the rest of layout will have their on weight. Though in this situation I recommend to use relative layout. The reason being performance as well as ease of support for different screens as the layout is relative.

For example in my case,

<?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="match_parent"
android:orientation="vertical"
android:weightSum="100" >

<ListView
    android:id="@+id/mst"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_weight="98" >
</ListView>

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_weight="2" >

    <Button
        android:id="@+id/btnDelete"
        style="?android:attr/buttonStyleSmall"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:text="@string/btn_delete" />

    <Button
        android:id="@+id/btnExport"
        style="?android:attr/buttonStyleSmall"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:text="@string/btn_export" />

    <Button
        android:id="@+id/btnSelectAll"
        style="?android:attr/buttonStyleSmall"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:text="@string/btn_select_all" />

</RelativeLayout>

Answer 2

Try to assign a layout_weight to your AutoCompleteTextView:

    <AutoCompleteTextView
    android:id="@+id/supplierName_CB"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    />

Answer 3

It is because the AutoCompleteTextView took the whole width. Change it to:

android:layout_width="wrap_content"

Or use a fixed size (like 60dp).