我一直试图为回收服务项目创建一个布局,但我在这方面遇到了困难。我会尽力解释我想要什么,到目前为止我得到了什么。
我的设计有一个按钮,一个文本视图,几个图像视图和一个包含一些图像视图的线性布局。下图很好地解释了这一点。
灰色元素有固定的宽度和位置(左边的按钮和右边带ivs的ll)。
绿色和红色的ivs有固定的宽度,但应该放在蓝色电视的右侧,除非蓝色电视太大,并试图将它们推到右侧灰色ll的顶部。在这种情况下,文本会缩短,并在结尾添加省略号。
绿色和红色ivs可能可见,也可能不可见(visibility=“true”或“gone”)。如果蓝色电视“不见了”(如果里面有足够的文字内容),它应该占据它们的空间。
我已经接近我想要的了:蓝色的电视和红色和绿色的ivs在一个带有gravity=left属性的线性布局中。蓝色电视具有省略号=结束属性。有一点仍然是错误的,那就是蓝色电视必须有一个maxwidth属性,这样它就不会把绿色/红色的ivs推到右边的灰色线上。所以,当红色或绿色的ivs“消失”时,右边有一个空白区域(在灰色线布局之前),因为蓝色电视的最大宽度限制了它。
有办法做到这一点吗?如何消除maxwidth属性,同时仍然防止textview内容将绿色和红色ivs推到右侧太远,并使灰色的linearlayout溢出?
我对constraintlayout没有任何经验(也是android开发的初学者)。有办法用它来达到这个目的吗?
这是我目前掌握的密码。
<LinearLayout
android:id="@+id/leiaute"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation="horizontal">
<Button
android:id="@+id/quad_done_undone"
android:layout_width="17.6dp"
android:layout_height="16dp"
android:layout_marginLeft="14dp"
android:src="@drawable/circulo_unchecked"/>
<LinearLayout
android:id="@+id/itemClickableArea"
android:layout_width="0dp"
android:layout_height="48dp"
android:layout_weight="1"
android:gravity="left|center_vertical"
android:orientation="horizontal"
android:background="?attr/selectableItemBackground">
<TextView
android:id="@+id/titulo"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:ellipsize="end"
android:fontFamily="sans-serif"
android:gravity="left|center_vertical"
android:maxLines="1"
android:maxWidth="210dp"
android:text="Lorem Ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua"
android:textColor="@color/preto"
android:textSize="13sp"
android:visibility="visible"/>
<ImageButton
android:id="@+id/descricao"
android:layout_width="16dp"
android:layout_height="13.5dp"
android:layout_marginLeft="16dp"
android:layout_marginTop="1dp"
android:background="@drawable/description_icon"/>
<ImageView
android:id="@+id/play"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_gravity="center_vertical"
android:layout_marginLeft="4dp"
android:layout_marginRight="4dp"
android:src="@drawable/play"
android:tint="@color/cinza3"
android:visibility="visible"/>
</LinearLayout>
<LinearLayout
android:layout_width="36dp"
android:layout_height="wrap_content"
android:layout_marginRight="6dp"
android:gravity="center_vertical|center_horizontal"
android:orientation="vertical">
<TextView
android:id="@+id/data_hora"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:fontFamily="sans-serif"
android:gravity="center"
android:maxLines="2"
android:textColor="@color/textList"
android:textSize="12sp"
tools:text="31 mar\n9:42"/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="3dp"
android:gravity="center_horizontal|center_vertical"
android:orientation="horizontal">
<ImageView
android:id="@+id/repeat"
android:layout_width="10dp"
android:layout_height="10dp"
android:layout_marginRight="2dp"
android:src="@drawable/repeat"
android:tint="@color/iconesList"/>
<ImageView
android:id="@+id/locale"
android:layout_width="10dp"
android:layout_height="10dp"
android:src="@drawable/locale"
android:tint="@color/iconesList"/>
<ImageView
android:id="@+id/alarm"
android:layout_width="10dp"
android:layout_height="10dp"
android:layout_marginLeft="2dp"
android:src="@drawable/alarm"
android:tint="@color/iconesList"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
最佳答案
您想做的事情可以通过TableLayout
和TableRow
轻松处理。有关布局示例,请参见以下XML。布局的关键是设置TextView
来保存要根据需要收缩的长文本,并添加一个android:shrinkColumns="1"
视图来填充额外的空间,这样当Space
收缩时,右侧的LinearLayout
不会向左移动。
此video显示当TextView
的内容更改并且其他视图设置为TextView
时发生的情况。
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:shrinkColumns="1">
<!-- TableLayout is needed to specify shrinkColumns. Ignore "Useless parent" error. -->
<TableRow
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:ignore="UselessParent">
<Button
android:layout_width="80dp"
android:layout_height="45dp"
android:text="Button"
tools:ignore="HardcodedText" />
<TextView
android:id="@+id/textView"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_marginEnd="8dp"
android:layout_marginRight="8dp"
android:background="@android:color/holo_blue_dark"
android:ellipsize="end"
android:gravity="center_vertical"
android:maxLines="1"
android:paddingEnd="8dp"
android:paddingLeft="8dp"
android:paddingRight="8dp"
android:paddingStart="8dp"
android:scrollHorizontally="true"
android:text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, etc."
android:textSize="20sp"
tools:ignore="HardcodedText" />
<TextView
android:id="@+id/imageView1"
android:layout_width="45dp"
android:layout_height="45dp"
android:layout_marginEnd="8dp"
android:layout_marginRight="8dp"
android:background="@android:color/holo_green_light"
android:gravity="center"
android:text="iv"
android:textSize="20sp"
android:visibility="visible"
tools:ignore="HardcodedText" />
<TextView
android:id="@+id/imageView2"
android:layout_width="45dp"
android:layout_height="45dp"
android:layout_marginEnd="8dp"
android:layout_marginRight="8dp"
android:background="@android:color/holo_red_dark"
android:gravity="center"
android:textSize="20sp"
android:visibility="visible"
tools:text="iv" />
<!-- Space to expand/shrink so TableRow is always width of the screen. -->
<Space
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="@android:color/transparent" />
<LinearLayout
android:layout_width="60dp"
android:layout_height="45dp"
android:background="@android:color/darker_gray"
android:orientation="horizontal" />
</TableRow>
</TableLayout>