仿淘寶物流界面

大廠樣例

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