首页 > 解决方案 > 如何创建类似于图像中的布局?

问题描述

我想要这样的图像在此处输入图像描述 但是当文本的长度不相等时,TextViews 之间的距离正在发生变化,并且当单词太多时转到下一行。

在此处输入图像描述

我创建的布局的 xml 代码是:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:padding="10dp"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

<LinearLayout
        
                android:padding="10dp"
                android:orientation="horizontal"
                android:minWidth="25px"
                android:minHeight="25px"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"                
                android:id="@+id/linearLayout1" >
                <TextView
                    android:textSize="12dp"
                    android:gravity="center_vertical |right"
                    android:drawableRight="@drawable/shape_rectangle"
                    android:drawablePadding="5dp"                    
                    android:layout_weight="33.66"
                    android:text=" text"
                    android:layout_width="wrap_content"
                    android:layout_height="match_parent"
                    android:id="@+id/textView3" />

                <TextView
                    android:textSize="12dp"
                    android:gravity="center_vertical |right"
                    android:drawableRight="@drawable/shape_rectangle"
                    android:drawablePadding="5dp"                    
                    android:layout_weight="33.66"
                    android:text="some text"
                    android:layout_width="wrap_content"
                    android:layout_height="match_parent"
                    android:id="@+id/textView2" />

                <TextView
                    android:textSize="12dp"
                    android:ellipsize="end"
                   android:gravity="center_vertical |right"
                    android:drawableRight="@drawable/shape_rectangle"
                    android:drawablePadding="5dp"                    
                    android:layout_weight="33.66"
                   android:text="some text with more word"
                    android:layout_width="wrap_content"
                    android:layout_height="match_parent"
                    android:id="@+id/textView1" />
        
            </LinearLayout>

            <View        
                android:background="#CCC"
                android:layout_width="match_parent"
                android:layout_height="2dp"/>

</LinearLayout>

如何在所有屏幕尺寸上使用差异文本和稳定外观的布局?

标签: androidlayout

解决方案


你需要设置 android:layout_width="match_parent"你所有的TextViews,如果所有的权重都相同,你可以为每个人设置 1,重要的是比例,而不是数字本身。

<TextView
            ...
            android:singleLine="true"
            android:ellipsize="end"
            android:layout_weight="1"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:id="@+id/textView1" />

编辑:将android:singleLineandroid:singleLineattribute添加到答案以匹配问题标准。


推荐阅读