Search code examples
androidandroid-layouthorizontalscrollview

need help in fixing the layout


i am designing application for android in which i have kept a HorizontalScrollView at the top to display 3 log in control(Textbox for Username and Password) in a scroll view. I have almost achieved what i want except for one minor defect that it is not occupying the whole width of the screen as you can see in the image below. How can i make its width to fill_parent ?

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:panel="http://schemas.android.com/apk/res-auto"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#CCC"
android:orientation="vertical" >

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <org.miscwidgets.widget.Panel
        android:id="@+id/mytopPanel"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        panel:animationDuration="1000"
        panel:closedHandle="@drawable/top_switcher_collapsed_background"
        panel:content="@+id/mypanelContent"
        panel:handle="@+id/mypanelHandle"
        panel:linearFlying="true"
        panel:openedHandle="@drawable/top_switcher_expanded_background"
        panel:position="top" >

        <Button
            android:id="@+id/mypanelHandle"
            android:layout_width="wrap_content"
            android:layout_height="33dip"
            android:layout_gravity="center_horizontal" />

        <HorizontalScrollView
            android:id="@+id/mypanelContent"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content" >

            <RelativeLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" >

                <LinearLayout
                    android:id="@+id/linearLayout"
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:orientation="vertical" >

                    <EditText
                        android:id="@+id/editTextUserName"
                        android:layout_width="fill_parent"
                        android:layout_height="wrap_content"
                        android:layout_margin="3dp"
                        android:layout_marginTop="6dp"
                        android:hint="@string/editUserName" >
                    </EditText>

                    <EditText
                        android:id="@+id/editTextPassword"
                        android:layout_width="fill_parent"
                        android:layout_height="wrap_content"
                        android:layout_margin="3dp"
                        android:hint="@string/editUserPwd" >
                    </EditText>

                    <TextView
                        android:id="@+id/textView"
                        android:layout_width="fill_parent"
                        android:layout_height="wrap_content"
                        android:background="#323299"
                        android:gravity="center"
                        android:padding="4dip"
                        android:text="@string/drpDwnTxt"
                        android:textColor="#eee"
                        android:textSize="16dip"
                        android:textStyle="bold" />
                </LinearLayout>

                <LinearLayout
                    android:id="@+id/linearLayout1"
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:layout_toRightOf="@+id/linearLayout"
                    android:orientation="vertical" >

                    <EditText
                        android:id="@+id/editTextUserName1"
                        android:layout_width="fill_parent"
                        android:layout_height="wrap_content"
                        android:layout_margin="3dp"
                        android:layout_marginTop="6dp"
                        android:hint="@string/editUserName" >
                    </EditText>

                    <EditText
                        android:id="@+id/editTextPassword1"
                        android:layout_width="fill_parent"
                        android:layout_height="wrap_content"
                        android:layout_margin="3dp"
                        android:hint="@string/editUserPwd" >
                    </EditText>

                    <TextView
                        android:id="@+id/textView1"
                        android:layout_width="fill_parent"
                        android:layout_height="wrap_content"
                        android:background="#323299"
                        android:gravity="center"
                        android:padding="4dip"
                        android:text="@string/drpDwnTxt"
                        android:textColor="#eee"
                        android:textSize="16dip"
                        android:textStyle="bold" />
                </LinearLayout>
            </RelativeLayout>
        </HorizontalScrollView>
    </org.miscwidgets.widget.Panel>
</LinearLayout>
</FrameLayout>

enter image description here


Solution

  • Here is what you can do.

    In XML :

    Define 1 Horizontal Linear Layout.

    Define 3 Vertical Linear Layouts.

    Inside each vertical linear layout, put the pair of EditTexts for username and password. [make sure that their width attributes are "fill_parent" i.e. each of the editTexts should fill the vertical linear layout width inside which they are placed ]

    Put these 3 vertical linear layouts inside the horizontal linear layout.

    In Java :

    Make the horizontal linear layout ( which contains the other three layouts) to have a width of 3 times the width of the display.

    Display display = getWindowManager().getDefaultDisplay();
            int width = display.getWidth();
            int height = display.getHeight();
            horizontalLayout = (LinearLayout) findViewById(R.id.yourHorizonatalLinearLayout);
            horizontalLayout.setLayoutParams(new LinearLayout.LayoutParams(
                    (width * 3), height));
    

    Now, for each of the vertical linear layouts (which are placed inside the horizontal linear layout and contain a pair of username and password fields) make the width equal to the width of the device display.

    The code below is for one of the vertical linear layouts and you would need to repeat this for the other two also. Similar code snippet, just change the id.

    firstEditLayout = (LinearLayout) findViewById(R.id.yourFirstVerticalLinearLayout);
            firstEditLayout.setGravity(Gravity.CENTER_VERTICAL);
            firstEditLayout.setLayoutParams(new LinearLayout.LayoutParams(
                    (width), height));
    

    P.S. : I hope I have been clear enough for you to understand.