android时间轴效果实现

最新推荐文章于 2025-04-20 00:15:00 发布

原创

最新推荐文章于 2025-04-20 00:15:00 发布 · 1.2k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#android #时间轴 #物流效果

本文介绍了如何在Android中创建类似淘宝物流的时间轴效果。作者尝试避免使用自定义控件，而是通过ListView实现这一功能。时间轴由View表示，内容和时间置于LinearLayout中。为使时间轴长度与内容成正比，将LinearLayout的高度赋值给View。然而，由于LinearLayout初始高度为零，导致时间轴线在程序启动时不显示，需手动滑动屏幕两次才可显现。目前作者尚未解决这一问题。

最近剁手剁多了，天天盯着物流界面看，看到淘宝的物流效果就像整个类似的玩玩儿。

看了一些博客，不太是我想要的效果，而我想要的效果又是用自定义控件完成的，现阶段对自定义控件还比较头疼就不选择用自定义控件来完成。就自己写了个效果（有点bug），先上图。

比较丑比较粗糙，有效果就好。

首先我想要的效果是时间轴的长短跟内容是成正比的。

思路如下：

用ListView实现。
时间轴用View表示，相关信息和时间放在一个LinearLayout中，为了使View（时间轴）的长短跟内容成正比，我把LinearLayout的高赋值给View，但是也由此产生了一个bug，程序首先运行起来LinearLayout的高为零，所以时间轴那条竖线不会显示出来，必须用手滑两下测出LinearLayout的高才能使竖线显示出来，纠结了两天也没把这个问题给解决。。

接下来上代码：

首先ListView的item（item_time.xml）

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <RelativeLayout
        android:id="@+id/rl_point_view"
        android:layout_width="wrap_content"
        android:layout_height="5dp"
        android:layout_marginTop="10dp">
    </RelativeLayout>
    <ImageView
        android:id="@+id/iv_point"
        android:layout_width="wrap

最低0.47元/天解锁文章