swenn
swenn

Reputation: 33

centerHorizontal RelativeLayout in ScrollView

I'd like to centerHorizontal a RelativeLayout within a ScrollView like this: good layout

I can only achieve this layout when using RelativeLayout. But since I need to use ScrollView aswell, it messes up. Somehow android:layout_centerHorizontal="true" won't apply for RelativeLayout then... Output looks like this:

bad layout

<RelativeLayout 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="#ffcc33"
android:paddingLeft="7dp"
android:paddingRight="7dp"
android:paddingTop="10dp"
tools:context=".MainActivity" >

<EditText
    android:id="@+id/search_box"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_toLeftOf="@+id/search_button"
    android:ems="5"
    android:hint="@string/search_hint" >

    <requestFocus />
</EditText>

<Button
    android:id="@+id/search_button"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentRight="true"
    android:text="@string/search_button" />

<ScrollView
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_below="@+id/search_box"
    android:layout_marginTop="15dp"
     >

<RelativeLayout
    android:layout_width="225dp"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true" >

    <Button
        android:id="@+id/btn_lihatoidud"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@android:color/transparent"
        android:drawableTop="@drawable/lihatoidud"
        android:layout_alignParentTop="true"
        android:text="Lihatoidud"
        android:textSize="18sp" />

    <Button
        android:id="@+id/btn_kypsetised"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/btn_lihatoidud"
        android:layout_marginTop="15dp"
        android:background="@android:color/transparent"
        android:drawableTop="@drawable/kypsetised"
        android:text="Küpsetised"
        android:textSize="18sp" />

    <Button
        android:id="@+id/btn_seenetoidud"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/btn_kypsetised"
        android:layout_marginTop="15dp"
        android:background="@android:color/transparent"
        android:drawableTop="@drawable/seenetoidud"
        android:text="Seenetoidud"
        android:textSize="18sp" />

    <Button
        android:id="@+id/btn_juustutoidud"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/btn_seenetoidud"
        android:layout_marginTop="15dp"
        android:background="@android:color/transparent"
        android:drawableTop="@drawable/juustutoidud"
        android:text="Juustutoidud"
        android:textSize="18sp" />

    <Button
        android:id="@+id/btn_lisandid"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/btn_juustutoidud"
        android:layout_marginTop="15dp"
        android:background="@android:color/transparent"
        android:drawableTop="@drawable/lisandid"
        android:text="Lisandid"
        android:textSize="18sp" />

    <Button
        android:id="@+id/btn_supid"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:background="@android:color/transparent"
        android:drawableTop="@drawable/supid"
        android:text="Supid"
        android:textSize="18sp" />

    <Button
        android:id="@+id/btn_voileivad"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_below="@+id/btn_supid"
        android:layout_marginTop="15dp"
        android:background="@android:color/transparent"
        android:drawableTop="@drawable/voileivad"
        android:text="Võileivad"
        android:textSize="18sp" />

    <Button
        android:id="@+id/btn_pudrud"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_below="@+id/btn_voileivad"
        android:layout_marginTop="15dp"
        android:background="@android:color/transparent"
        android:drawableTop="@drawable/pudrud"
        android:text="Pudrud"
        android:textSize="18sp" />

    <Button
        android:id="@+id/btn_joogid"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_below="@+id/btn_pudrud"
        android:layout_marginTop="15dp"
        android:background="@android:color/transparent"
        android:drawableTop="@drawable/joogid"
        android:text="Joogid"
        android:textSize="18sp" />

</RelativeLayout>
</ScrollView>

Upvotes: 0

Views: 342

Answers (3)

Neil Townsend
Neil Townsend

Reputation: 6084

A ScrollView will collapse its contents down to core size unless told otherwise. Try things:

  1. Explicitly lock the sides of the ScrollView to the positions in the top RelativeLayout using

    android:layout_below="@id/search_box"
    android:layout_alignParentLeft="true"
    android:layout_alignParentRight="true"
    android:layout_alignParentBottom="true"
    
  2. Force the ScrollView not to collapse:

    android:fillViewport="true"
    

Upvotes: 1

user2483079
user2483079

Reputation: 533

The comment wouldnt let me format...

Here is what I would do, change the overall layout to a linear layout, that way you can make sure that they editText and button are on top. It would look something like this...

<LinearLayout
    ...android:orientation="vertical">

    <LinearLayout
         ...android:orentation="horizontal">
         <Edit Text>
         <Button>
     />
     <ScrollView
        ...>
        <RelativeLayout
             ..../>
     />
/>

Upvotes: 1

user2483079
user2483079

Reputation: 533

Have you tried using gravity? Try this:

android:layout_gravity="center"

inside your RelativeLayout.

android:gravity="center"

may also work. I always forget which one does which.

Upvotes: 0

Related Questions