1. 程式人生 > >RxDataSources與TableView中實現介面展示(二)

RxDataSources與TableView中實現介面展示(二)

通過按鈕重新整理介面引數,設定延時為2s


//  ViewController.swift
//  RxSwiftTest
//
//  Created by travey on 2018/11/5.
//  Copyright © 2018年 ZhouShijie. All rights reserved.


import UIKit
import RxSwift
import RxCocoa
import SnapKit
import RxDataSources

    class ViewController: UIViewController {

        let disposeBag = DisposeBag()
        var tableView: UITableView!
        var refreshbtn: UIButton! // 建立一個重新整理按鈕

        // 通過重新整理按鈕的流,產生隨機數
        // 自定義函式,返回的型別是一個Observable,這個Observable是一個數組,每個陣列裝的元素型別是一個SectionModel型別,SectionModel型別裡面有兩個變數,一個是標題,一個是下面的cell,cell用一個數組展示,並且要求標題是String型別的,cell裡面元素的型別是Int型別的
        func getRandomResult() -> Observable<[SectionModel<String, Int>]> {
            print("正在請求資料......")
            let items = Array(repeating: 0, count: 10).map{ _ in
                Int(arc4random())
            }
            let observable = Observable.just([SectionModel(model: "Zhou", items: items)])
            return observable.delay(2, scheduler: MainScheduler.instance)
        }


        override func viewDidLoad() {

            // UI設定
            tableView = UITableView(frame: CGRect(x: 0, y: 200, width: view.bounds.width, height: view.bounds.height - 200), style: .plain)
            tableView!.register(UITableViewCell.self, forCellReuseIdentifier: "cell")
            refreshbtn = UIButton()
            refreshbtn.setTitle("重新整理", for: .normal)
            refreshbtn.setTitleColor(UIColor.black, for: .normal)
            refreshbtn.frame = CGRect(x: 0, y: 0, width: view.bounds.width / 3, height: 50)
            refreshbtn.center = CGPoint(x: view.bounds.width / 2, y: 100)
            refreshbtn.layer.borderWidth = 1
            view.addSubview(refreshbtn)
            view.addSubview(tableView)

            // 通過重新整理按鈕,產生隨機流,儲存到randomResult變數中
            let randomResult = refreshbtn.rx.tap.asObservable()
                .throttle(1, scheduler: MainScheduler.instance) // 如果一秒內點選多次,取最後一次
                .startWith(()) // 確保一開始的時候就有值
                .flatMapLatest(getRandomResult) // 通過自定義函式轉化成隨機數
                .share(replay: 1) // 確保只發送一次

            // 創造資料來源,資料來源的型別是SectionModel<String, Int>型別
            let dataSource = RxTableViewSectionedReloadDataSource
            <SectionModel<String, Int>>(
            configureCell: {
                ds, tv, indexPath, element in
                let cell = tv.dequeueReusableCell(withIdentifier: "cell")
                cell?.textLabel?.text = "現在的索引是\(indexPath.row),內容為\(element)"
                return cell!
            }
            )

            // 繫結
            randomResult.bind(to: tableView.rx.items(dataSource: dataSource)).disposed(by: disposeBag)
        }
    }


 

加上一個停止按鈕,按了以後就不更新了


//  ViewController.swift
//  RxSwiftTest
//
//  Created by travey on 2018/11/5.
//  Copyright © 2018年 ZhouShijie. All rights reserved.


import UIKit
import RxSwift
import RxCocoa
import SnapKit
import RxDataSources

    class ViewController: UIViewController {

        let disposeBag = DisposeBag()
        var tableView: UITableView!
        var refreshbtn: UIButton! // 建立一個重新整理按鈕
        var stopbtn:UIButton!

        // 通過重新整理按鈕的流,產生隨機數
        // 自定義函式,返回的型別是一個Observable,這個Observable是一個數組,每個陣列裝的元素型別是一個SectionModel型別,SectionModel型別裡面有兩個變數,一個是標題,一個是下面的cell,cell用一個數組展示,並且要求標題是String型別的,cell裡面元素的型別是Int型別的
        func getRandomResult() -> Observable<[SectionModel<String, Int>]> {
            print("正在請求資料......")
            let items = Array(repeating: 0, count: 10).map{ _ in
                Int(arc4random())
            }
            let observable = Observable.just([SectionModel(model: "Zhou", items: items)])
            return observable.delay(2, scheduler: MainScheduler.instance)
        }


        override func viewDidLoad() {

            // UI設定
            tableView = UITableView(frame: CGRect(x: 0, y: 200, width: view.bounds.width, height: view.bounds.height - 200), style: .plain)
            tableView!.register(UITableViewCell.self, forCellReuseIdentifier: "cell")
            
            refreshbtn = UIButton()
            refreshbtn.setTitle("重新整理", for: .normal)
            refreshbtn.setTitleColor(UIColor.black, for: .normal)
            refreshbtn.frame = CGRect(x: 0, y: 0, width: view.bounds.width / 3, height: 50)
            refreshbtn.center = CGPoint(x: view.bounds.width / 2, y: 100)
            refreshbtn.layer.borderWidth = 1
            view.addSubview(refreshbtn)
            view.addSubview(tableView)
            
            stopbtn = UIButton()
            stopbtn.setTitle("停止", for: .normal)
            stopbtn.setTitleColor(UIColor.black, for: .normal)
            stopbtn.frame = CGRect(x: 0, y: 0, width: view.bounds.width / 3, height: 50)
            stopbtn.center = CGPoint(x: view.bounds.width / 2, y: 160)
            stopbtn.layer.borderWidth = 1
            view.addSubview(stopbtn)
            

            // 通過重新整理按鈕,產生隨機流,儲存到randomResult變數中
            let randomResult = refreshbtn.rx.tap.asObservable()
                .throttle(1, scheduler: MainScheduler.instance) // 如果一秒內點選多次,取最後一次
                .startWith(()) // 確保一開始的時候就有值
                .flatMapLatest(getRandomResult) // 通過自定義函式轉化成隨機數
                .takeUntil(stopbtn.rx.tap) // 如果我按了停止,就停止更新
                .share(replay: 1) // 確保只發送一次

            // 創造資料來源,資料來源的型別是SectionModel<String, Int>型別
            let dataSource = RxTableViewSectionedReloadDataSource
            <SectionModel<String, Int>>(
            configureCell: {
                ds, tv, indexPath, element in
                let cell = tv.dequeueReusableCell(withIdentifier: "cell")
                cell?.textLabel?.text = "現在的索引是\(indexPath.row),內容為\(element)"
                return cell!
            }
            )

            // 繫結
            randomResult.bind(to: tableView.rx.items(dataSource: dataSource)).disposed(by: disposeBag)
        }
    }