Android EditText within TableLayout runs off

Question

I have a simple sign in tablelayout, but the contents inside are stretching too far to the right. Everything appears to me to be centered. Or it seems like the EditText is trying to center itself inside the main parent and not IT'S parent tablelayout. Any idea why?

<?xml version="1.0" encoding="UTF-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@drawable/bluebg"
android:id="@+id/loading_page_lin_layout"
>
 <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/roundtable"
        android:layout_gravity="center"
        android:gravity="center"
        android:layout_margin="10dip"
        android:padding="10dip"
        android:stretchColumns="*">
        <TableRow>
            <EditText  
            android:id="@+id/txtUserName"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:textColor="#85AFBE"                              
            android:hint="Email"
            android:text=""
            android:gravity="left"

            />
         </TableRow>
        <TableRow>
            <EditText  
                android:id="@+id/txtPassword"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:textColor="#85AFBE"                              
                android:text=""
                android:hint="Password"
                android:password="true"
                android:gravity="left"  
                android:layout_gravity="center"                     
                />
        </TableRow>
        <TableRow>
            <!--  <Button
            android:id="@+id/btnSignIn"
            android:text="Sign In" 
            android:layout_width="fill_parent"
            android:paddingTop="10dip"
            android:gravity="center"
            />-->
            <ImageButton 
             android:id="@+id/btnSignIn"
             android:src="@drawable/signbig"    
             android:scaleType="fitCenter"   
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"                
             android:adjustViewBounds="true"
             android:layout_marginLeft="3dip"
             android:background="@null"
             android:layout_marginRight="3dip"
             android:layout_gravity="center"
             />
        </TableRow>
        <TableRow>
            <Button
            android:id="@+id/btnSignUp"
            android:background="@null"
            android:text="Sign Up" 
            android:textStyle=""
            android:layout_width="wrap_content"
            android:paddingTop="10dip"
            android:textSize="20dip"
            android:gravity="center"
            android:onClick="SendToSignUp"
            />                          
        </TableRow> 
        <TableRow>
            <Button
               android:id="@+id/btnFillData"
               android:text="Fill Fake Data" 
               android:background="@null"
               android:layout_width="wrap_content"
               android:layout_height="wrap_content"
               android:paddingTop="10dip"
               android:gravity="center"
               android:onClick="FillFakeData"
               />
           </TableRow>
</TableLayout>
</LinearLayout>

signin screen shot

Can you get a screen shot of how it looks and put it online somewhere then edit your question and paste a link to it in there? Being able to actually see it will make it far easier for us to help you figure it out. — FoamyGuy, Feb 08 '12 at 17:52

score 15 · Answer 1 · answered Jun 12 '13 at 14:39

I had the same problem on a two column table. My text in the second column was being cut off the screen. Fixed it by using android:shrinkColumns="1" in my TableLayout.

Here's my code, text3 was too big and was being cut off the screen until I added the shrinkColumns attribute in my TableLayout.

<TableLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:shrinkColumns="1" >

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

            <TextView
                android:id="@+id/text1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginRight="10dp" />

            <TextView
                android:id="@+id/text2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content" />
        </TableRow>

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

            <TextView
                android:id="@+id/text3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_column="1" />
        </TableRow>
    </TableLayout>

This helped me too! On a sidenote - this can be done in Java using `mTableLayout.setShrinkAllColumns(true);` — Dev-iL, Apr 25 '15 at 21:56
Note that the value of `shrinkColumns` is the column you want shrinked. Don't read it as `1 == true` — Ivan Rubinson, Mar 29 '17 at 13:56

Ivan Bartsov · Accepted Answer · 2012-02-08T18:25:46.387

10

Your table layout has it's width set to "wrap_content" and it's children have it at "fill_parent", not one of them knows anything exactly :) Set your table layout's width to "fill_parent" and everything should lay out as you mean it to.

UPD I only see one column in your table. That means you can safely substitute it with vertical LinearLayout.

edited Feb 08 '12 at 18:25

answered Feb 08 '12 at 17:58

Ivan Bartsov

19,664
7
61
59

I've tried that, and just tried again, no different. Everything inside the table gets cut off on the right side. – Jesse Feb 08 '12 at 18:00
hmm. That's weird. But keep it at "fill_parent" either way, that's the proper way to go, I'll think some more. – Ivan Bartsov Feb 08 '12 at 18:08
Also, the simpler solution would be to use a simple LinearLayout with orientation="vertical". Your layout doesn't seem complex enough to require a TableLayout, it'll do just fine with Linear. – Ivan Bartsov Feb 08 '12 at 18:11
It has to have the table, look at the screen shot. The table is part of the design and has the rounded edges. – Jesse Feb 08 '12 at 18:16
Also, try setting layout_gravity="center" to your first EditText. That's the only difference I see between it and the password field that seems to be laying out well. – Ivan Bartsov Feb 08 '12 at 18:17
Well, I only see one column in your table. That means you can safely substitute it with vertical LinearLayout. You can set the background="@drawable/roundtable" for it just as well. Just try it) – Ivan Bartsov Feb 08 '12 at 18:19
Actually the issue with it if I do that is that it squeezes the edittext to minimum size. I actually took that out of both fields so it stretches out. – Jesse Feb 08 '12 at 18:20
I'm thinking get it back, but set layout_width="fill_parent" for the fields. But seriously, try LinearLayout :D – Ivan Bartsov Feb 08 '12 at 18:22
the squeeze response above is in reference to your comment on layout_gravity. I will try the suggestion on using linearlayout only... – Jesse Feb 08 '12 at 18:22
And for LinearLayout layout_width="fill_parent", for children layout_gravity="center", layout_width="fill_parent" – Ivan Bartsov Feb 08 '12 at 18:24
On the off topic, please delete the duplicate question: http://stackoverflow.com/questions/9198543/android-edittext-squeezed – Ivan Bartsov Feb 08 '12 at 18:33
i dont know how that got posted, some how this account I am using right here was not signed in and it posted that anonymously? I have no idea how to get to that account – Jesse Feb 08 '12 at 18:36
Okay here is the deal...it seems the signup imagebutton is the culprit here. I set its layout_width to 10dip just to see what would happen and all the other controls came in line normal now... – Jesse Feb 08 '12 at 18:40
Flagged it, mods will handle. – Ivan Bartsov Feb 08 '12 at 18:41
Weird. Well, again, I never had any of those problems with LinearLayout :) – Ivan Bartsov Feb 08 '12 at 18:43
Yeah I got ya Im sure that would work too..but I wanted to get this solved with the table because I have some other more complex tables I will be doing with odd columns so this was good. thanks for the tips though! – Jesse Feb 08 '12 at 18:45

score 2 · Answer 3 · answered Sep 28 '13 at 20:10

2

I had the same problem and none of the tutorials on the net were helpful. In the end , I found out setting the 'Shrink Columns' Property of the Table View would do the trick.

answered Sep 28 '13 at 20:10

Iman Akbari

2,167
26
31

score 0 · Answer 4 · answered Jan 23 '15 at 12:28

0

Set both shrinkColumn and stretchColumn for the column of running off EditText. This gives you a parent matching width and doesn't run off.

answered Jan 23 '15 at 12:28

OneWorld

17,512
21
86
136

score 0 · Answer 5 · answered Sep 29 '15 at 13:59

0

Setting EditTextView's layout_width="0dp" and layout_weight="1" solved my problem.

answered Sep 29 '15 at 13:59

Bharat Dodeja

1,137
16
22

Android EditText within TableLayout runs off

5 Answers5

Linked