Gerhard
Gerhard

Reputation: 1362

Button is not wrapping its content

I am using a simple horizontal LinearLayout to put 3 buttons next to each other, all the same width. I achieve this by the following xml text:

   <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="@dimen/activity_vertical_margin"
            android:baselineAligned="false" >

            <Button
                android:id="@+id/help"
                style="android:buttonBarButtonStyle"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="@string/help" />

            <Button
                android:id="@+id/close"
                style="android:buttonBarButtonStyle"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="@string/closemultigame" />

            <Button
                android:id="@+id/ok"
                style="android:buttonBarButtonStyle"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="@string/restartmultigame" />

        </LinearLayout>

Now the layout looks like this: screenshot from designer

The button layout_height is defined as wrap_content, but the rightmost button doesn't wrap its content. It looks different on different devices, on some it looks good. What I would actually like to achieve is three buttons, same width and same height, each with its text centered both horizontally and vertically. What approach would you propose?

ADDED: the whole layout as requested:

<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="@dimen/activity_horizontal_margin" >

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_vertical"
        android:drawableLeft="@drawable/matchandfit"
        android:drawablePadding="@dimen/activity_horizontal_margin"
        android:gravity="center_vertical"
        android:padding="@dimen/activity_horizontal_margin"
        android:text="@string/multigameover"
        android:textAppearance="?android:attr/textAppearanceLarge" />

    <TextView
        android:id="@+id/status"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:gravity="center_horizontal"
        android:text="@string/multigameresult"
        android:textAppearance="?android:attr/textAppearanceMedium" />

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

        <TextView
            android:id="@+id/textView1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="@string/masterresultinfo"
            android:textAppearance="?android:attr/textAppearanceMedium" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="@dimen/activity_vertical_margin"
            android:baselineAligned="false" >

            <Button
                android:id="@+id/help1"
                style="android:buttonBarButtonStyle"
                android:layout_width="0dp"
                android:layout_height="fill_parent"
                android:layout_weight="1"
                android:text="@string/help" />

            <Button
                android:id="@+id/close1"
                style="android:buttonBarButtonStyle"
                android:layout_width="0dp"
                android:layout_height="fill_parent"
                android:layout_weight="1"
                android:text="@string/closemultigame" />

            <Button
                android:id="@+id/ok1"
                style="android:buttonBarButtonStyle"
                android:layout_width="0dp"
                android:layout_height="fill_parent"
                android:layout_weight="1"
                android:text="@string/restartmultigame" />

        </LinearLayout>



    </LinearLayout>
</LinearLayout>

</ScrollView>

As Wasim Ahmed pointed out, it is due to the ScrollView. Now I use the ScrollView to make sure that the buttons stay accessible even in landscape on small devices. (The layout is for a Dialog). Is there an other way to always keep the buttons accessible/visible?

WORKAROUND: The solution or better workaround I found was adding a TextView to the end of the enclosing LinearLayout. This TextView is vertically clipped at about half of its height, But it contains no text, so nobody will notice. Adding some padding to the bottom of the enclosing LinearLayout didn't help

Upvotes: 13

Views: 19454

Answers (6)

Hassan Jawed
Hassan Jawed

Reputation: 1650

Button has minHeight by default. Remove minHeight of Button like so:

android:minHeight="0dp"

Upvotes: 7

portsample
portsample

Reputation: 2112

Was not having luck wrapping text within a toggle button using android:layout_width="wrap_content", etc, so I added backslash n (\n) to the label string where I wanted wraps. For example, "Press to START" became, "Press \nto \nSTART" This worked for me.

Upvotes: 0

Yash Sampat
Yash Sampat

Reputation: 30611

Time and again I've observed that the Button class does not adjust to the text size even if you specify android:layout_height="wrap_content".

You can do one of two things:

1. You can manually set either the text size or the width of your Button until the text fits in properly (simulating the appearance of wrap_content).

2. Use a TextView instead (which does wrap the text correctly when you specify android:layout_height="wrap_content") and you set an onClickListener on the TextView to simulate the behaviour of a button.

Upvotes: 8

Rod_Algonquin
Rod_Algonquin

Reputation: 26198

Do not wrap the height of the button instead use the fill_parent to make the buttons's height identical with each other.

sample:

  <?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="wrap_content"
    android:layout_marginTop="@dimen/activity_vertical_margin"
    android:orientation="horizontal"
    android:baselineAligned="false" >

    <Button
        android:id="@+id/help"
        style="android:buttonBarButtonStyle"
        android:layout_width="0dp"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:text="hilfe" />

    <Button
        android:id="@+id/close"
        style="android:buttonBarButtonStyle"
        android:layout_width="0dp"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:text="beenden" />

    <Button
        android:id="@+id/ok"
        style="android:buttonBarButtonStyle"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="neue Pundo" />

</LinearLayout>

result:

enter image description here

Upvotes: 3

Elvis Whizzkid
Elvis Whizzkid

Reputation: 41

Try using android:layout_width="wrap_content" instead of android:layout_width="0dp" and see id

Upvotes: -1

Jay
Jay

Reputation: 1492

I just tried and it worked:

1) Define in ../res/values/strings.xml:

Line1Line1\nLine2Line2

2) Refer it in the layout file:

<Button
    android:id="@+id/btn_multilines"
    android:text="@string/multilines"
    android:layout_height="wrap_content"
    android:layout_width="fill_parent">
</Button>

Upvotes: 0

Related Questions