How to enlarge the background layout when text wraps into multiple lines

Question

I have a custom dialog window with title, message and 2 buttons. When the text of one of the buttons wraps to 3 lines, the bottom of the button is chopped off. I would like to have the window height enlarged automatically so that the full button is displayed. Can someone help me in this problem?

Since I do not have enough reps to post a screen captures I included 2 links. http://212.150.56.58:8080/q/Doc10.htm shows the dialog with short text in the button, and http://212.150.56.58:8080/q/Doc11.htm shows the dialog with the problem I want to fix.

Dialog.xml

<?xml version="1.0" encoding="utf-8"?>
<TableLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/tableLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/border_white_inside_black"
>

<TextView
    android:id="@+id/txt_dialog_title"
    android:gravity="center"
    android:text="@string/shut_down"
    android:textStyle="bold"
    android:textSize="22sp"
    android:textColor="@android:color/white"
    android:layout_marginTop="11dp"
    android:layout_marginBottom="11dp"
    />

<TableLayout
    android:id="@+id/layout_dialog_content"
    android:background="@drawable/border_white_inside_offwhite_round_bottom"
    android:layout_height="wrap_content"
    >

    <TableRow
        android:layout_height="wrap_content"
        android:id="@+id/tableRow2"
        android:padding="5dip" >

        <TextView
            android:id="@+id/txt_dialog_message"
            android:layout_span="2"
            android:text="@string/are_u_sure_close_msg"
            android:textSize="16sp"
            android:textColor="@android:color/black"
            android:textStyle="normal"
            android:gravity="center"
            android:layout_marginTop="25dp"
            android:layout_marginBottom="25dp"

            android:layout_width="wrap_content"
            android:ellipsize="none"
            android:singleLine="false"
            android:scrollHorizontally="false"
            android:layout_weight="1"
            android:maxLines="3"

            />
    </TableRow>

    <TableRow
        android:layout_height="wrap_content"
        android:id="@+id/tableRow3"
        android:layout_marginBottom="15dp"
        >

        <Button
            android:id="@+id/dialogButtonClose"
            android:text="Cancel"
            android:textColor="@android:color/black"
            android:textStyle="bold"
            android:textSize="18sp"
            android:background="@drawable/border_round_corners_thin_blue"
            android:layout_marginRight="10dp"
            android:layout_marginLeft="15dp"
            android:layout_marginEnd="10dp"
            android:layout_marginStart="15dp"
            android:minHeight="35dp"
            android:minWidth="130dp"

            android:layout_width="130dp"
            android:ellipsize="none"
            android:singleLine="false"
            android:scrollHorizontally="false"
            android:layout_weight="1"
            android:maxLines="3"
            />

        <Button
            android:id="@+id/dialogButtonCancel"
            android:text="Shut Down"
            android:textColor="@android:color/black"
            android:textStyle="bold"
            android:textSize="18sp"
            android:background="@drawable/border_round_corners_thin_blue"
            android:layout_marginLeft="5dp"
            android:layout_marginRight="5dp"
            android:minHeight="35dp"
            android:minWidth="130dp"

            android:layout_width="130dp"
            android:ellipsize="none"
            android:singleLine="false"
            android:scrollHorizontally="false"
            android:layout_weight="1"
            android:maxLines="3"

            />
    </TableRow>

</TableLayout>

</TableLayout>

As a suggestion cut it short (Enable GPS) keeps the buttons equal length. If you want after the(?) put (Enable GPS will open the Location Page) — Tasos, Sep 20 '15 at 19:42
Of course I can solve it by changing the text. That was not the purpose of my question. I want to know how to change the XML to solve it in order to get a better understanding of the UI functionality, for future usage., — Zvi, Sep 21 '15 at 21:08
in your top TableLayout you have -- android:layout_height="match_parent" -- try setting a height in dp e.g -- android:layout_height="200dp" -- you can do that dynamically if its a shared dialog layout — Tasos, Sep 22 '15 at 00:00
Any value entered in the top TableLayout did not affect the window. I tried 400dp, 600dp, and wrap_context but the height of the window did not change at all, even for buttons with short text. — Zvi, Sep 23 '15 at 16:59
have a look here then on how to do it by code -- http://stackoverflow.com/questions/4406804/how-to-control-the-width-and-height-of-default-alert-dialog-in-android — Tasos, Sep 23 '15 at 18:22
Well, there is some progress. I used the code there and change lp.height += 900. What happened is that the outer layout was enlarged, But I need the 2nd tableLayout (with id=layout_dialog_content) to increase in height as well. Is there a way to get it's parameters by using it's id? Also, why is the width and the height of the window returns -2 (when I read them, before the I change them)? — Zvi, Sep 24 '15 at 23:23
I found out that if I make the text of the "cancel" button longer then it's area expands such that the other button is aligned with it and the bottom of the layout is pushed down as desired. However, adding spaces to the text "Cancel" did not help (they are trimmed automatically) — Zvi, Sep 25 '15 at 10:20
try padding or margin (left,right) for the cancel button or have a look here on how to insert whitespace in text -- http://stackoverflow.com/questions/1587056/android-string-concatenate-how-to-keep-the-spaces-at-the-end-and-or-beginnin/2206684#2206684 — Tasos, Sep 25 '15 at 11:04
Solved. I ended up adding a new line "\n" before and after the short text.Now the short text is in the middle of a big box, and the long text has proper margin from the bottom of the box surrounding it. Thank for your help. Without it I would not have solved the problem. Sorry I cannot upvote because I do not have enough reps. — Zvi, Sep 26 '15 at 13:38

score 0 · Answer 1 · answered Nov 01 '15 at 11:08

The Answer:

you have to add a center layout_gravity to both buttons (Close & Cancel):

android:layout_gravity="center"

Why?!!

Your problem is NOT in the height of the button, the problem is that you set the TableRow height to wrap_content without giving a particular layout gravity to both buttons, so when the text of the first button expands, the height will gain size but as the second button "Cancel" will restrict to TableRow to it's default gravity (you can notice "Cancel" Button floated up when the text of the first Button expanded) and it will croping the first button "Close" from the end of the display of the full text of it, so you will always see the full text of the button whatever big it is but after the text displayed the remaining part of the button background will be cropped to adapt with the second button "Cancel", so you have to add a layout_gravity to both buttons to adapt with each other:

  <Button
    android:id="@+id/dialogButtonClose"
    android:layout_gravity="center"
    .
    .
    />
  <Button
    android:id="@+id/dialogButtonCancel"
    android:layout_gravity="center"
    .
    .
    />

How to enlarge the background layout when text wraps into multiple lines

1 Answers1