Android EditText within TableLayout runs off

问题:

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>

回答1:

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.

回答2:

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>

回答3:

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.

回答4:

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

回答5:

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