I have a GridLayout in a fragment with 3 columns and 2 rows. The text length in the first cell varies. I have the TextView inside the first cell set to maxLines=1 and ellipsize=end.
My problem is that whenever the text reaches a certain length, the second cell adjacent to it overflows past the screen. I was under the assumption that setting the GridLayout layout_width=match_parent would keep the grid within the screen size, and the TextView in cell 1 would shrink - keeping cell 2 inside the screen.
My goal is to keep cell2 visible and have cell1 centered & filling the remaining area.
I tried the solution suggested here: https://stackoverflow.com/a/34099239/6368401 which recommends:
You need to use fill layout_gravity and set an arbitrary layout_width or width on the long TextView in need of ellipsizing.
android:layout_gravity="fill" android:layout_width="1dp"
i have also tried playing with android:layout_weight and android:layout_gravity="fill_horizontal" . At this point having the text centered is optional (not preferred) as long as cell2 remains visible. A 50% width for both cells will not work, as cell2 will never be more than 4 characters and usually 2-3 characters.
The following shows a visual representation of the layout:
-------------------------
| cell1 | |
----------------| cell2 |
| cell3 | cell4 | |
-------------------------
cell1 is set to columnspan=2. cell2 is set to rowspan=2. All cells are a TextView.
This is my XML inside the Fragment:
<GridLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnCount="3"
android:rowCount="2">
<LinearLayout
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_columnSpan="2">
<TextView
android:id="@+id/main_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginLeft="16dp"
android:textAppearance="?android:attr/textAppearanceLarge"
android:visibility="gone"/>
<TextView
android:id="@+id/description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginLeft="16dp"
android:textAppearance="?android:attr/textAppearanceLarge"
android:visibility="visible"
android:maxLines="1"
android:ellipsize="end"
android:singleLine="true"/>
<TextView
android:id="@+id/data"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginLeft="16dp"
android:textAppearance="?android:attr/textAppearanceLarge"
android:visibility="gone"
android:textColor="@android:color/holo_green_light"/>
</LinearLayout>
<TextView
android:id="@+id/percent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textStyle="bold"
android:layout_rowSpan="2"/>
<TextView
android:id="@+id/count"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:layout_marginLeft="16dp"
android:textAppearance="?android:attr/textAppearanceMedium"/>
<TextView
android:id="@+id/date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:textAppearance="?android:attr/textAppearanceMedium"/>
</GridLayout>
Trying various combinations, with layout_width, layout_gravity and gravity I stumbled upon a combination which worked for me.
This is the XML which produced the layout i was searching for:
<GridLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnCount="3"
android:rowCount="2">
<LinearLayout
android:orientation="horizontal"
android:layout_width="1dp"
android:layout_height="wrap_content"
android:layout_gravity="fill"
android:layout_columnSpan="2"
android:layout_weight="0">
<TextView
android:id="@+id/main_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginLeft="16dp"
android:textAppearance="?android:attr/textAppearanceLarge"
android:visibility="gone"/>
<TextView
android:id="@+id/description"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginLeft="16dp"
android:textAppearance="?android:attr/textAppearanceLarge"
android:visibility="visible"
android:maxLines="1"
android:ellipsize="end"
android:layout_weight="1"
android:gravity="center"/>
<TextView
android:id="@+id/data"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginLeft="16dp"
android:textAppearance="?android:attr/textAppearanceLarge"
android:visibility="gone"
android:maxLines="1"
android:ellipsize="end"
android:layout_weight="1"
android:gravity="center"
android:textColor="@android:color/holo_green_light"/>
</LinearLayout>
<TextView
android:id="@+id/percent"
android:layout_width="30dp"
android:minEms="3"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textStyle="bold"
android:layout_rowSpan="2"
android:gravity="right"
android:layout_marginLeft="16dp"/>
<TextView
android:id="@+id/count"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:layout_marginLeft="16dp"
android:textAppearance="?android:attr/textAppearanceMedium"/>
<TextView
android:id="@+id/date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:textAppearance="?android:attr/textAppearanceMedium"/>
</GridLayout>