調(diào)整UITableView手勢跟隨頁面整體滑動總結(jié)

img

產(chǎn)品中經(jīng)常出現(xiàn)手勢滑動的需求财异,但是結(jié)合tableview的手勢就會出現(xiàn)沖突猪瞬,下面是一些tableview結(jié)合全局手勢的實踐方案。

gif

頁面滑動

  • 給頁面添加滑動手勢

      let pan = UIPanGestureRecognizer()
      pan.rx.event.subscribe(onNext: { [weak self] (recognizer: UIPanGestureRecognizer) in
          self?.panGestureStationTogetherAction(recognizer)
      }).addDisposableTo(disposeBag)
      lineListView?.stationHeaderDetailView.addGestureRecognizer(pan)
    
  • 手勢處理方式

// MARK: 站點滑動手勢統(tǒng)一處理
func panGestureStationTogetherAction(_ recognizer: UIPanGestureRecognizer) {
    let wself = self
    guard let gestureView = wself.lineListView else {return}
    
    if recognizer.state == .began || recognizer.state == .changed {
        let movement = recognizer.translation(in: wself.view)
        var old_rect = gestureView.frame
        let listViewEmptyHeight = gestureView.getEmptyHeight()
        let stationDetailHeight: CGFloat = 68.0
        if recognizer.state == .began {
            old_rect.origin.y = old_rect.origin.y - listViewEmptyHeight - stationDetailHeight
        }
        else {
            old_rect.origin.y = old_rect.origin.y + movement.y
        }
        if old_rect.origin.y < 0 {
            gestureView.frame = wself.view.bounds
        }
        else if old_rect.origin.y > wself.view.bounds.height {
            gestureView.frame = CGRect.init(x: 0, y: wself.view.bounds.height, width: wself.view.bounds.width, height: wself.view.bounds.height)
        }
        else {
            gestureView.frame = old_rect
        }
        
        recognizer.setTranslation(CGPoint.zero, in: wself.view)
    }
    else if recognizer.state == .ended || recognizer.state == .cancelled {
        let halfPoint = wself.view.bounds.height*1/4
        if gestureView.frame.origin.y > halfPoint {
            gestureView.dismiss()
        }
        else {
            gestureView.show(superView: wself.view)
        }
    }
}

滑動時候.began || recognizer.state == .changed是在滑動手勢沒有停止的時候,這個時候可以動態(tài)調(diào)整ListViewy

    guard let gestureView = wself.lineListView else {return}

lineListView是被處理的view太颤,并不一定是滑動的view,滑動view可以使任何一個view盹沈,把手勢的變化統(tǒng)一傳到這里就好了panGestureStationTogetherAction龄章。

let movement = recognizer.translation(in: wself.view)

獲取手勢滑動離原位置的CGPoint,這樣我們就有了移動的x乞封,y做裙。

        if recognizer.state == .began {
            old_rect.origin.y = old_rect.origin.y - listViewEmptyHeight - stationDetailHeight
        }
        else {
            old_rect.origin.y = old_rect.origin.y + movement.y
        }

開始狀態(tài),初始化ListViewframe肃晚,changed狀態(tài)锚贱,獲取當前最新的frame的y加上最新的移動的y,old_rect.origin.y = old_rect.origin.y + movement.y

        recognizer.setTranslation(CGPoint.zero, in: wself.view)

改變frame之后关串,重置手勢CGPoint為zero

    else if recognizer.state == .ended || recognizer.state == .cancelled {
        let halfPoint = wself.view.bounds.height*1/4
        if gestureView.frame.origin.y > halfPoint {
            gestureView.dismiss()
        }
        else {
            gestureView.show(superView: wself.view)
        }
    }

當手勢結(jié)束或取消的時候惋鸥,處理ListView的彈出或者下沉動畫。

func show(superView: UIView) {
    showBlock?()
    tableView.setContentOffset(CGPoint.zero, animated: false)
    UIView.animate(withDuration: 0.3) {
        self.frame = superView.bounds
    }
    
}

@objc func dismiss() {
    dismissBlock?()
    tableView.setContentOffset(CGPoint.zero, animated: false)
    UIView.animate(withDuration: 0.3) {
        self.frame = CGRect.init(x: 0, y: self.bounds.height - 268, width: self.bounds.width, height: self.bounds.height)
    }
}

TableView滑動結(jié)合頁面滑動處理

    //linelistview_tableview滑動
    lineListView?.tableView.panGestureRecognizer.rx.event.subscribe(onNext: { [weak self] (recognizer: UIPanGestureRecognizer) in
        guard let foffy = self?.lineListView?.frame.origin.y else {return}
        guard let offy = self?.lineListView?.tableView.contentOffset.y else {return}
        
        if foffy > CGFloat(0.0) || offy < CGFloat(0.0) {
            self?.lineListView?.tableView.setContentOffset(CGPoint.zero, animated: false)
            self?.panGestureStationTogetherAction(recognizer)
        }
        
    }).addDisposableTo(disposeBag)

tableview是繼承scrollview完成的封裝悍缠。scrollview自帶panGestureRecognizer手勢卦绣,所以可以直接獲取scrollview手勢的動態(tài)變化。由于封裝的手勢處理可以給任何滑動手勢用飞蚓,所以可以直接把tableview滑動手勢直接傳給統(tǒng)一手勢處理方法滤港。

        guard let foffy = self?.lineListView?.frame.origin.y else {return}
        foffy > CGFloat(0.0)

1、判斷滑動的ListView的frame的y值是否已經(jīng)超出規(guī)定范圍,超出就不再處理滑動溅漾,我的實現(xiàn)是小于0就不再處理滑動山叮。

        guard let offy = self?.lineListView?.tableView.contentOffset.y else {return}
       offy < CGFloat(0.0)

2、tableview的偏移量必須是小于0的這也才能處理滑動添履,不然會造成tableviewlistview一起滑動的效果屁倔,很不自然。

上面1暮胧、2條件必須放在一起使用锐借,才能保證滑動手勢和view本身的手勢完美結(jié)合

      tableView.setContentOffset(CGPoint.zero, animated: false)

滑動傳遞之后要記得把tableview的偏移量設(shè)為zero,這樣可以解決快速滑動時出現(xiàn)的小bug往衷。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末钞翔,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子席舍,更是在濱河造成了極大的恐慌布轿,老刑警劉巖,帶你破解...
    沈念sama閱讀 219,039評論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件来颤,死亡現(xiàn)場離奇詭異汰扭,居然都是意外死亡,警方通過查閱死者的電腦和手機福铅,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,426評論 3 395
  • 文/潘曉璐 我一進店門东且,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人本讥,你說我怎么就攤上這事÷撤耄” “怎么了拷沸?”我有些...
    開封第一講書人閱讀 165,417評論 0 356
  • 文/不壞的土叔 我叫張陵,是天一觀的道長薯演。 經(jīng)常有香客問我撞芍,道長,這世上最難降的妖魔是什么跨扮? 我笑而不...
    開封第一講書人閱讀 58,868評論 1 295
  • 正文 為了忘掉前任序无,我火速辦了婚禮,結(jié)果婚禮上衡创,老公的妹妹穿的比我還像新娘帝嗡。我一直安慰自己,他們只是感情好璃氢,可當我...
    茶點故事閱讀 67,892評論 6 392
  • 文/花漫 我一把揭開白布哟玷。 她就那樣靜靜地躺著,像睡著了一般一也。 火紅的嫁衣襯著肌膚如雪巢寡。 梳的紋絲不亂的頭發(fā)上喉脖,一...
    開封第一講書人閱讀 51,692評論 1 305
  • 那天,我揣著相機與錄音抑月,去河邊找鬼树叽。 笑死,一個胖子當著我的面吹牛谦絮,可吹牛的內(nèi)容都是我干的题诵。 我是一名探鬼主播,決...
    沈念sama閱讀 40,416評論 3 419
  • 文/蒼蘭香墨 我猛地睜開眼挨稿,長吁一口氣:“原來是場噩夢啊……” “哼仇轻!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起奶甘,我...
    開封第一講書人閱讀 39,326評論 0 276
  • 序言:老撾萬榮一對情侶失蹤篷店,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后臭家,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體疲陕,經(jīng)...
    沈念sama閱讀 45,782評論 1 316
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,957評論 3 337
  • 正文 我和宋清朗相戀三年钉赁,在試婚紗的時候發(fā)現(xiàn)自己被綠了蹄殃。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 40,102評論 1 350
  • 序言:一個原本活蹦亂跳的男人離奇死亡你踩,死狀恐怖诅岩,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情带膜,我是刑警寧澤吩谦,帶...
    沈念sama閱讀 35,790評論 5 346
  • 正文 年R本政府宣布,位于F島的核電站膝藕,受9級特大地震影響式廷,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜芭挽,卻給世界環(huán)境...
    茶點故事閱讀 41,442評論 3 331
  • 文/蒙蒙 一滑废、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧袜爪,春花似錦蠕趁、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,996評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春倔韭,著一層夾襖步出監(jiān)牢的瞬間术浪,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,113評論 1 272
  • 我被黑心中介騙來泰國打工寿酌, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留胰苏,地道東北人。 一個月前我還...
    沈念sama閱讀 48,332評論 3 373
  • 正文 我出身青樓醇疼,卻偏偏與公主長得像硕并,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子秧荆,可洞房花燭夜當晚...
    茶點故事閱讀 45,044評論 2 355

推薦閱讀更多精彩內(nèi)容