防止布局溢出屏幕大小

时间:2017-10-04 15:37:33

标签: android android-layout android-fragments

我在一个包含3列和2行的片段中有一个GridLayout。第一个单元格中的文本长度不同。我将第一个单元格中的TextView设置为maxLines = 1和ellipsize = end。

我的问题是,每当文本达到一定长度时,与其相邻的第二个单元格会溢出屏幕。我假设设置GridLayout layout_width = match_parent会使网格保持在屏幕大小内,并且单元格1中的TextView会缩小 - 将单元格2保留在屏幕内。

我的目标是保持cell2可见并让cell1居中并且填补剩余的区域。

我尝试了此处建议的解决方案:https://stackoverflow.com/a/34099239/6368401 建议:

  

您需要使用fill layout_gravity并设置任意layout_width   或需要进行椭圆化的长文本视图上的宽度。

     

android:layout_gravity="fill" android:layout_width="1dp"

我也试过玩android:layout_weightandroid:layout_gravity="fill_horizontal"。只要cell2保持可见,此时文本居中是可选的(不是优选的)。两个单元格的宽度均为50%,因为cell2永远不会超过4个字符,通常为2-3个字符。

以下显示了布局的直观表示:

-------------------------
|     cell1     |       |
----------------| cell2 |
| cell3 | cell4 |       |
-------------------------

cell1设置为columnspan = 2。 cell2设置为rowspan = 2。所有单元格都是TextView。

这是片段中的我的XML:

<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>

2 个答案:

答案 0 :(得分:1)

有时为视图设置android:layout_width="match_parent"android:layout_weight="1",占用整个屏幕宽度并从屏幕移动另一个视图,可以做到这一点。因此,尝试对包含cell1,cell3,cell4。

的LinearLayout执行此操作

您也可以使用LinearLayout而不是GridLayout(您可以将视图和重力值设置为最适合您):

<LinearLayout
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <LinearLayout
        android:orientation="vertical"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1">

        <!-- Cell 1. --> 
        <TextView
           android:layout_width="wrap_content"
           android:layout_height="wrap_content" />

        <LinearLayout
            android:orientation="horizontal"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <!-- Cell 3. -->
            <TextView
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="wrap_content" />

            <!-- Cell 4. -->
            <TextView
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="wrap_content" />

        </LinearLayout>

    </LinearLayout>

    <!-- Cell 2. -->
    <TextView 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
</LinearLayout>

答案 1 :(得分:1)

尝试各种组合,包括layout_width,layout_gravity和gravity,我偶然发现了一个对我有用的组合。

这是生成我正在搜索的布局的XML:

<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>