仿淘寶物流介面

c4ibD3發表於2018-06-06

大廠樣例

1 淘寶物流介面

仿淘寶物流介面

2 滴滴

仿淘寶物流介面

3 自己寫的

仿淘寶物流介面

起源

淘寶對於我來說,已經好久沒有去過這個物流的介面了,因為我根本就不關心。在我印象裡面,這個介面還是那種根據介面返回的物流資訊做介面展示。
那天,有一個朋友突然問我:“你知道淘寶的那個物流介面是怎麼做的嗎?” 看了之後我覺得挺神奇的。 我以為上面的地圖是做tableView的headerView。我朋友告訴我不是。可能是因為覺得回答的不是很好,我就敷衍的說:"你們有這個需求了啊?"是他同事做的專案有這個需求。之後這個事情就不了了之了.......
大概是三天後吧,他和我說,那個介面快做出來了,那個同事在google上找到了這麼一個demo,然後我就結果來看了一下。基本上差不多。然後我就開始寫了這麼一個小樣例。
目的並不是炫耀什麼,我估計很多人也都會,所以希望,不喜勿噴.......

The key of problem

我在看過那個demo之後,關鍵的就是判斷點選的是那個檢視。- (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event;

相關知識連結

  1. iOS 知識小集第 15 期 · 掘金首發
  2. 對UIView的hitTest: withEvent: 方法的理解
  3. 點選事件處理, 以及hitTest:withEvent:實現

行動起來

我的那個demo的結構也是很簡單的。
首先,我們做了一個一整個螢幕大小的MapView; 然後,新增一個tableView,也是整個螢幕的大小,然後對contentInset做了這設定;
這樣介面的佈局就完事兒了。
接下來就是實現那個方法的問題了,我自定義了一個tableView,然後在那裡面實現了這個方法

- (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event {
    id hitView = [super hitTest:point withEvent:event];
    if (point.y<0) {
        return nil;
    }
    return hitView;
}
複製程式碼

這樣 地圖和tableView的滑動問題就都解決了

依舊有個不解之謎,求大神指點

淘寶那個地圖路線那個,始終都會在上面顯示出來,而我的這個demo現實的一直都是在整個mapview的中心,而且滑動的時候,也可以跟隨華東的偏移量做相應的調整,有大神知道的歡迎來知道小弟。

傳送門

Demo

相關文章