Andrela
Andrela

Reputation: 23

Linearlayout displaying button incorrectly

Just a small issue with my layout that I have when running my app on a smaller device such as a phone, on a tablet it renders fine. One of the buttons seems to be being 'squeezed' by the others and is rendered vertically.

Heres a screenshot of the problem area

enter image description here

my xml is as follows.

<?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="fill_parent"
        android:layout_height="wrap_content"
        android:layout_margin="8dp"
        android:orientation="vertical" >

        <ImageView
            android:id="@+id/imageView1"
            android:layout_width="78dp"
            android:layout_height="78dp"
            android:layout_alignParentTop="true" />

        <TextView
            android:id="@+id/txtEventNameTitle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Event Name"
            android:textSize="19dp"
            android:textStyle="bold"
            android:layout_below="@+id/imageView1" />

        <TextView
            android:id="@+id/txtEventName"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="16dp"
            android:layout_below="@+id/txtEventNameTitle" />

        <TextView
            android:id="@+id/txtEventDateTitle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Event Date"
            android:textSize="19dp"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/txtEventDate"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="16dp" />

        <TextView
            android:id="@+id/txtEventTimeTitle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Event Time"
            android:textSize="19dp"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/txtEventTime"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="16dp" />

        <TextView
            android:id="@+id/txtEventLocationTitle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Event Location"
            android:textSize="19dp"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/txtEventLocation"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="16dp" />

        <TextView
            android:id="@+id/txtEventDetailsTitle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Event Details"
            android:textSize="19dp"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/txtEventDetails"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="16dp" />

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

     <Button
            android:id="@+id/btnAddToCal"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="20dp"
                        android:layout_marginBottom="20dp"

            android:text="Add to Calendar" 
            android:layout_weight="1"/>

        <Button
            android:id="@+id/btnAddToMyEvents"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Add to my Events"
            android:layout_marginTop="20dp"

            android:layout_weight="1"
            android:layout_toRightOf="@+id/btnAddToCal"

            />

        <Button
            android:id="@+id/btnSendToTwitter"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Share"
            android:layout_marginTop="20dp"            
            android:layout_weight="1"
            android:minWidth="40dp"

            />
         <Button
            android:id="@+id/btnSendToMaps"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Get directions" 
                        android:layout_marginTop="20dp"

            android:layout_weight="1"
            android:layout_toRightOf="@+id/btnAddToMyEvents"

         />


   </LinearLayout>    

        <fragment
            android:id="@+id/map"
            android:layout_width="fill_parent"
            android:layout_height="300dp"
            class="com.google.android.gms.maps.SupportMapFragment"
            android:layout_marginBottom="10dp"
             />
    </LinearLayout>

</ScrollView>

Upvotes: 0

Views: 209

Answers (2)

AndroidDeveloper
AndroidDeveloper

Reputation: 1

add parameter 'android:weightSum="4"' to your linear layout

Upvotes: 0

TNR
TNR

Reputation: 5869

Change your code as below. You are not setting the weightSum as well as you are setting wrap_content to your buttons which is the problem making your buttons displaying in wrong way.

<LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:measureWithLargestChild="true"
        android:orientation="horizontal"
        android:weightSum="4">
 <Button
        android:id="@+id/btnAddToCal"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
                    android:layout_marginBottom="20dp"

        android:text="Add to Calendar" 
        android:layout_weight="1"/>

    <Button
        android:id="@+id/btnAddToMyEvents"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="Add to my Events"
        android:layout_marginTop="20dp"

        android:layout_weight="1"
        android:layout_toRightOf="@+id/btnAddToCal"

        />

    <Button
        android:id="@+id/btnSendToTwitter"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="Share"
        android:layout_marginTop="20dp"            
        android:layout_weight="1"
        android:minWidth="40dp"

        />
     <Button
        android:id="@+id/btnSendToMaps"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="Get directions" 
                    android:layout_marginTop="20dp"

        android:layout_weight="1"
        android:layout_toRightOf="@+id/btnAddToMyEvents"

     />
</LinearLayout>   

Upvotes: 2

Related Questions