Android时间轴视图布局问题

时间:2018-04-18 10:38:39

标签: android android-layout

我在我的应用程序中创建一个时间线视图。在布局中,我在两个点​​之间获得了太多的空间。

我采取了Recyclerview。我正在使用此布局作为其项目。以下是我当前的输出和代码。

我的输出:

enter image description here

预期输出(忽略此颜色。我只想要这样的视图)

enter image description here

我的代码:

<?xml version="1.0" encoding="utf-8"?>
    <layout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto">

        <data>

            <import type="android.view.View" />

            <variable
                name="obj"
                type="com.smartcompliant.model.ComplaintProgressModel" />
        </data>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:orientation="vertical">

            <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="horizontal">

                <LinearLayout
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="20dp"
                    android:layout_marginTop="25dp"
                    android:orientation="vertical">

                    <TextView
                        android:background="@drawable/complaint_status"
                        android:layout_width="20dp"
                        android:layout_height="20dp"
                        android:textColor="@color/colorGreen" />


                    <View
                        android:layout_width="2dp"
                        android:layout_height="match_parent"
                        android:layout_gravity="center_horizontal"
                        android:background="@color/colorPrimaryCompHistory"
                        android:layout_marginTop="@dimen/margin_5"
                        android:visibility="@{obj.isLast ? View.VISIBLE : View.GONE}" />
                </LinearLayout>



                <LinearLayout
                    android:layout_width="0dp"
                    app:cardElevation="@dimen/margin_5"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="@dimen/margin_15"
                    android:layout_weight="1"
                    android:background="@drawable/line_box"
                    android:orientation="horizontal">


                    <ImageView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:backgroundTint="@color/colorTextHint"
                        android:layout_marginLeft="@dimen/margin_5"
                        android:layout_gravity="center_vertical"
                        android:src="@drawable/ic_left" />

                    <LinearLayout
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginLeft="@dimen/margin_10"
                        android:orientation="vertical">

                        <TextView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:text="@{obj.title1}"
                            android:textStyle="bold"
                            android:layout_marginTop="@dimen/margin_5"
                            android:textSize="@dimen/font_14"
                            android:padding="@dimen/margin_5"
                            android:textColor="@color/colorTextHint" />

                        <TextView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_marginTop="@dimen/margin_5"
                            android:layout_marginLeft="@dimen/margin_5"
                            android:text="@{obj.title2}"
                            android:layout_marginBottom="@dimen/margin_10"
                            android:textSize="@dimen/font_12"
                            android:textColor="@color/colorTextHint" />


                    </LinearLayout>


                </LinearLayout>


            </LinearLayout>

        </LinearLayout>
    </layout>

如果您需要任何其他代码,请告诉我。请提出建议。谢谢!

2 个答案:

答案 0 :(得分:2)

在这里,我没有为它制作RecycleView,我只是复制粘贴多行的代码。

enter image description here

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="100dp"
    android:orientation="vertical">

    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="20dp"
            android:id="@+id/ll_dots"
            android:orientation="vertical">

            <TextView
                android:layout_width="20dp"
                android:layout_height="20dp"
                 android:layout_marginTop="4dp"
                android:background="@drawable/drawable_btn_green"
                android:textColor="@color/colorPrimary" />


            <View
                android:layout_width="2dp"
                android:layout_height="match_parent"
                android:layout_gravity="center_horizontal"
                android:layout_marginTop="4dp"
                android:background="@color/colorPrimary"
                android:visibility="@{obj.isLast ? View.VISIBLE : View.GONE}" />
        </LinearLayout>


        <LinearLayout

            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginLeft="15dp"
            android:layout_weight="1"
            android:layout_toRightOf="@+id/ll_dots"
            android:id="@+id/ll_one"
            android:layout_centerInParent="true"
            android:background="@drawable/grey_round_rect"
            android:orientation="horizontal">


            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_vertical"
                android:layout_marginLeft="5dp"
                android:backgroundTint="@color/Green"
                android:src="@mipmap/ic_launcher" />

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dp"
                android:orientation="vertical">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="5dp"
                    android:padding="5dp"
                    android:text="@{obj.title1}"
                    android:textColor="@color/gray_dark"
                    android:textSize="14sp"
                    android:textStyle="bold" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginBottom="10dp"
                    android:layout_marginLeft="5dp"
                    android:layout_marginTop="5dp"
                    android:text="@{obj.title2}"
                    android:textColor="@color/gray_dark"
                    android:textSize="12sp" />


            </LinearLayout>


        </LinearLayout>


    </RelativeLayout>

</LinearLayout>

答案 1 :(得分:2)

您可以使用@ Evin1 _&#39; s answer建议使用负边距。

对于第一个项目可见性问题,这可能过于手动,但您可以为RecyclerView提供padding-top。