3

我正在尝试实现水平时间线。所以我已经编写了设计水平线的代码，但我能够弄清楚我将如何在该行的上方和下方编写文本。

还有一件事我不想使用任何其他库。

目标图像T

我已经尝试通过自定义视图来解决它，因为这里的人已经被建议但被击中了。

时间线段.xml

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

    <TextView
       android:padding="3dp"
        android:textAlignment="textEnd"
        android:text="Top"
        android:id="@+id/top_data"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

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


        <TextView
            android:layout_gravity="center"
            android:layout_weight="0.5"
            android:background="@color/alphabet_a"
            android:layout_width="wrap_content"
            android:layout_height="2dp" />

        <ImageView
            android:background="@drawable/circle1"
            android:layout_width="15dp"
            android:layout_height="15dp" />

        <TextView
            android:layout_weight="0.5"
            android:layout_gravity="center"
            android:background="@color/alphabet_a"
            android:layout_width="wrap_content"
            android:layout_height="2dp" />

    </LinearLayout>


    <TextView
        android:padding="3dp"
        android:gravity="center"
        android:text="bottom"
        android:id="@+id/bottom_data"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

</LinearLayout>
</merge>

时间线段.java

public class timeline_segement extends LinearLayout {

    View rootView;
    TextView upperText;
    TextView startLine;
    TextView endLine;
    ImageView circleView;
    TextView bottomText;

    public timeline_segement(Context context) {
        super(context);
        init(context);
    }

    public timeline_segement(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context);
    }

    public timeline_segement(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init(context);
    }


    private void init(Context context) {

      rootView=inflate(context, R.layout.timeline_segment, this );

      upperText=(TextView) rootView.findViewById(R.id.top_data);
      bottomText=(TextView) rootView.findViewById(R.id.bottom_data);

      upperText.setText("Top");
      bottomText.setText("Bottom");

    }

    public  void setUpperText(String string)
    {
        upperText.setText(string);
    }

    public void setBottomText(String string)
    {
        bottomText.setText(string);
    }

}
4

1 回答 1

1

决定回答是因为评论框有点限制。这是我的评论：

您需要一个自定义视图来实现这一点。您可以合成现成的视图或完全自定义

如果您选择合成视图，那么您首先要逐级分解该图像。在最高级别，它是带有 ' 的水平布局TimelineCell（或您选择的任何名称）。

ATimelineCell基本上是一个垂直LinearLayout的，一个右对齐TextView，一个View画线，另一个居中对齐TextView。

然后，您可以以编程方式创建这些并将它们添加到父水平LinearLayout.

但是，如果您选择完全自定义，您将必须处理所有组件的测量、布局和绘图，包括行上方和下方的文本。

看看这个链接，很好地介绍了 android 上的自定义视图

于 2016-12-04T12:02:22.533 回答