做電商類型的小程序一定會碰到編寫物流信息的時候，一般頁面如下圖
難點在於只有一條信息時候的頁面樣式
以及多條信息最后一條信息的頁面樣式
之前沒做過這一塊的東西，所以剛碰到的時候想了老半天orz。后來上個廁所的時候一下子想通了，然后就想在這里做個記錄，分享給大家。
先給個我的想法圖給大家：
我把一條信息分為左右兩塊區域，左邊顯示進度線，右邊顯示文字信息。然后將左邊的進度線分為上下兩部分，如圖所示，上為紅色，下為藍色。 然后灰色的點和橘色點用圖片。
樣式寫完之后就是根據不同條件來顯示不同的樣式。
比如只有1條信息的時候，線都不顯示，然后有多條信息的時候就把最后一條藍色的線隱藏。
這其中有個要注意的地方就是需要給右邊物流文字信息的區域給一個最大高度，然后控制最多顯示兩行信息，多余的顯示省略號，不然的話左邊的線就不好設置顯示的樣式，有的短，有的長的。
如果還有其它問題的話可以留言在下面，然后可以一起研究一下。
OK，記錄完畢。 如果需要代碼的可以留言在下面，我看到信息后就發你。
更新：代碼已上傳至github，可自取。 https://github.com/muou2125/logistics