OneWorld
OneWorld

Reputation: 17671

How to shrink a TableLayout column to a minWidth?

If coloumn 3 has large text, column 2 disappears. Column 2 also disappears if I set android:stretchColumns="2,3". I'd like to set a minWidths to column 2. But this attribute is getting ignored.

I'm helping myself right now by setting android:stretchColumns="3" and android:shrinkColumns="3" and applying a maxWidth to the TextView on position 2. This almost does the job, but minWidth would be more the solution.

            <TableLayout
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:shrinkColumns="2,3"
                android:stretchColumns="3" >

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

                    <TextView
                        android:id="@+id/TextViewIdLabel"
                        style="@style/overlay_content"
                        android:text="@string/id_label"
                        android:textStyle="bold" />

                    <TextView
                        android:id="@+id/TextViewIdValue"
                        style="@style/overlay_content"
                        android:layout_marginLeft="4dp" />

                    <TextView
                        android:id="@+id/TextViewPersonIdLabel"
                        style="@style/overlay_content"
                        android:layout_marginLeft="8dp"
                        android:text="@string/person_id_label"
                        android:textStyle="bold" />

                    <TextView
                        android:id="@+id/TextViewPersonIdValue"
                        style="@style/overlay_content"
                        android:layout_marginLeft="4dp" />
                </TableRow>
                <!-- I skipped the other rows -->
           </TableLayout>

This is the used style, if you wonder:

<style name="overlay_content">
    <item name="android:textColor">@color/foreground_color_on_dark_background</item>
    <item name="android:layout_width">wrap_content</item>
    <item name="android:layout_height">wrap_content</item>
    <item name="android:textSize">20sp</item>
    <item name="android:ellipsize">marquee</item>
    <item name="android:singleLine">true</item>
</style>

Update:

As the answers came I found out more about my requirements which I summed up in this comment: How to shrink a TableLayout column to a minWidth?

Upvotes: 3

Views: 3263

Answers (3)

Xcihnegn
Xcihnegn

Reputation: 11597

How to shrink a TableLayout column to a minWidth?

Actually it is simple, just TextView layout_width="wrap_content" can do
that, the reason not working in your style is that 'wrap_content' should
not work together with TextView 'ellipsize', they are conflict. So you need
one seperate syle 'overlay_slide' for the column that has long text.

So use 'overlay_content' for columns those have short text, use    
'overlay_slide' for columns that have long text.

Besides I suppose the 'ellipsize' in your style is not working because
seems two items missing:

    <item name="android:focusable">true</item>
    <item name="android:focusableInTouchMode">true</item>

finally in the column that has long text, you also need:

    android:layout_weight="1"

to use all rest of space for 'ellipsize'. 


Remove android:shrinkColumns="2,3" android:stretchColumns="3" from TableLayout


Solution working styles and layout:

//remove 'ecllipze' related items from 'overlay_content' 
<style name="overlay_content">
   <item name="android:textColor">@color/foreground_color_on_dark_background</item>
   <item name="android:layout_width">wrap_content</item>
   <item name="android:layout_height">wrap_content</item>
   <item name="android:textSize">20sp</item>    
</style>

//remove 'android:layout_width' from 'overlay_slide'
<style name="overlay_slide">
   <item name="android:textColor">@color/foreground_color_on_dark_background</item>
   <item name="android:layout_height">wrap_content</item>
   <item name="android:textSize">20sp</item>
   <item name="android:ellipsize">marquee</item>

   <item name="android:focusable">true</item>
   <item name="android:focusableInTouchMode">true</item>

   <item name="android:singleLine">true</item>
</style>


<TableLayout
 xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="match_parent"
 android:layout_height="wrap_content"

 >

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

      <TextView
           android:id="@+id/TextViewIdLabel"
           style="@style/overlay_content"              
           android:text="@string/id_label"
           android:textStyle="bold" />

      <TextView
           android:id="@+id/TextViewIdValue" 
           style="@style/overlay_content"
           android:layout_marginLeft="4dp"/>

      <TextView
           android:id="@+id/TextViewPersonIdLabel"
           style="@style/overlay_content"
           android:layout_marginLeft="8dp"
           android:text="@string/person_id_label"
           android:textStyle="bold"/>

      <TextView
           android:id="@+id/TextViewPersonIdValue"
           style="@style/overlay_slide"
           android:layout_weight="1" 
           android:layout_marginLeft="4dp" />  

   </TableRow>
</TableLayout>


Screenshot from my testing: (Portrait and Landscape)

My test long text column is text 'Column 1 ... Column 8'

In Portrait In landscape

Upvotes: 2

Jem
Jem

Reputation: 656

You cannot change the width of a column that way. The width is only defined by the widest row in that column. If you have no display there, there will be no width. You can adjust this by adjusting the textview for that row.

<TextView
            android:id="@+id/TextViewIdValue"
            style="@style/overlay_content"
            android:layout_marginLeft="4dp"
            android:minEms="4"              <!--    You can use either of these -->
            android:minWidth="40dp" />

The trade-off here is that you might run out of room and your other columns will run off the end, but you can adjust your text size to correct that, even if you have to overwrite your style with android:textSize="10dp"

This code appears to be working for me, but I also changed your TableLayout width from "0dp" to "match_parent".

  <TableLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:shrinkColumns="3"
android:stretchColumns="*" >

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

    <TextView
        android:id="@+id/TextViewIdLabel"
        style="@style/overlay_content"
        android:text="id_label"
        android:textStyle="bold" />

    <TextView
        android:id="@+id/TextViewIdValue"
        style="@style/overlay_content"
        android:layout_marginLeft="4dp"
         />

    <TextView
        android:id="@+id/TextViewPersonIdLabel"
        style="@style/overlay_content"
        android:layout_marginLeft="8dp"
        android:text="person_id_label"
        android:textSize="10dp"
        android:textStyle="bold"
        android:minEms="4"
        android:minWidth="40dp" />
    <!-- You can use either of these -->

    <TextView
        android:id="@+id/TextViewPersonIdValue"
        style="@style/overlay_content"
        android:layout_marginLeft="4dp" />
</TableRow>
<!-- I skipped the other rows -->

Upvotes: 0

Vrashabh Irde
Vrashabh Irde

Reputation: 14367

Seems like this might be the practical workaround you need, so moving my comment to answer. Maybe this can be improved though, essentially be dilligent about setting these weights to suit your app

How about setting weight per column instead of android:shrinkColumns and android:stretchColumns . So for column 1 you could set 0.2 weight, 0.3 for column 2 and 0.5 for column 3 and so on

Upvotes: 2

Related Questions