状態管理とビューデータバインディング

Swift, SwiftBond, MVVM, UI Stack

Transcript

1. ঢ়ଶ؅ཧͱ
   ϏϡʔσʔλόΠϯσΟϯά
   yohei SUGIGAMI
   11/23 potatotips@FiNC
   

   View Slide

2. View Slide

3. Sync Messenger
   8FC %FTLUPQ"QQ "OESPJE BOEJ04
   ϏδωείϛϡχέʔγϣϯಛԽϝοηʔδϯάαʔϏε
   

   View Slide

4. Sync Messenger iOS
   4XJGU .77. '31 1SPNJTF

   Ϟμϯͳཁૉٕज़Λશྗ౤ೖ
   

   View Slide

5. ΞϓϦͷίʔυ
   ෳࡶʹͳ͍ͬͯ·ͤΜ͔
   

   View Slide

6. ঢ়ଶͱUIελοΫͰ੔ཧ͠Α͏
   )PXUPpYBCBEVTFSJOUFSGBDF
   ೔ຊޠ༁όου6*Λվળ͢Δํ๏ʕ6*ͷʮͭͷঢ়ଶʯΛߟ͑Δ
   w ϒϥϯΫεςʔτ
   w ϩʔσΟϯάεςʔτ
   w ύʔγϟϧεςʔτ
   w Τϥʔεςʔτ
   w ཧ૝εςʔτ
   ̍ը໘Ͱଟ༷ͳঢ়ଶͱΓɺͦΕʹ߹Θͤͨը໘Λ
   දࣔ͢ΔϩδοΫ͕ෳࡶͩͱίʔυ͕ΧΦεܥʹ
   

   View Slide

7. ؅ཧͱ෼཭
   ঢ়ଶΛ؅ཧ
   var state: State
   enum State {
   case Blank
   case Loading
   case Partial
   case Error
   case Ideal
   }
   6*ελοΫຖʹϏϡʔΛ෦඼Խͯ͠෼཭
   let blankView = BlankView()
   let loadingView = LoadingView()
   let partialView = PartialView()
   let errorView = ErrorView()
   let idealView = IdealView() or UITableView() etc …
   ͍ͩͿίʔυ੔ཧͰ͖ͦ͏
   

   View Slide

8. ঢ়ଶͱը໘ΛࣗಈͰ࿈ಈ͍ͨ͠ʂ
   ঢ়ଶ͕มΘΔͱ6*ελοΫͷදࣔ΋
   ࿈ಈͯࣗ͠ಈͰը໘ͷදࣔ΋มߋ͍ͨ͠
   state = .Blank
   blankView.hidden = false
   㱺
   

   View Slide

9. ͦΕ
   ϏϡʔσʔλόΠϯσΟϯάͰʂ
   with SwiftBond
   

   View Slide

10. 4UBUF3FRVFTUJOH 4UBUF&SSPS
    JUFNT<>
    4UBUF/POF
    *OEJDBUPS7JFX 3FUSZ7JFX
    /P%BUB7JFX
    ViewDataBinding
    

    View Slide

11. ViewDataBinding
    4UBUF3FRVFTUJOH 4UBUF&SSPS
    JUFNT<JUFN JUFN JUFN ʜ>
    4UBUF/POF
    *OEJDBUPS7JFX 3FUSZ7JFX
    /P%BUB7JFX
    

    View Slide

12. Code with SwiftBond
    final class RequestListViewModel {
    let items: DynamicArray = DynamicArray([])
    var requestListState = Dynamic(.None)
    var noDataFirstViewHidden: Dynamic {
    let a = indicatorViewHidden.map { $0 == false }
    let b = requestListFirstState.map { $0 == .Error }
    return reduce(a, b) { $0 || $1 == true }
    }
    var indicatorViewHidden: Dynamic {
    let a = requestListFirstState.map { $0 != RequestListState.Requesting }
    let b = items.map { count($0) > 0 }
    return reduce(a, b) { $0 || $1 == true }
    }
    var retryViewHidden: Dynamic {
    let a = requestListFirstState.map { $0 != RequestListState.Error }
    let b = items.map { count($0) > 0 }
    return reduce(a, b) { $0 || $1 == true }
    }
    3FRVFTU4UBUFͱ*UFNTͷঢ়ଶͷΑΔڍಈΛએݴ

    

    View Slide

13. final class ContactsViewController: UIViewController {
    var tableViewDataSourceBond: UITableViewDataSourceBond!
    let viewModel = ContactsViewModel()
    let indicatorView = InstantiateFromNib(IndicatorView)
    let retryView = InstantiateFromNib(RetryView)
    let noDataView = InstantiateFromNib(NoDataView)
    override func viewDidLoad() {
    super.viewDidLoad()
    viewModel.requestList.indicatorViewHidden ->> indicatorView.dynHidden
    viewModel.requestList.retryViewHidden ->> retryView.dynHidden
    viewModel.requestList.noDataFirstViewHidden ->> noDataView.dynHidden
    }
    7JFX$POUSPMMFSͰ7JFX.PEFMͷ4XJGU#POEͱ7JFXΛ#JOEJOH
    Code with SwiftBond
    

    View Slide

14. final class RequestListViewModel {
    typealias RequestTask = Task, NSError>
    func requestFirst(task: RequestTask) -> RequestTask {
    self.requestListState.value = .Requesting
    task.success { [weak self] (collection: ResponseCollection) -> Void in
    self?.items.setArray(collection.items)
    self?.requestListState.value = .None
    }.failure { [weak self] (errorInfo: RequestTask.ErrorInfo) -> Void in
    self?.requestListState.value = .Error
    }
    return task
    }
    3FRVFTUͷ։࢝ɺਖ਼ৗ׬ྃɺҎ্׬ྃͰ4BUFΛߋ৽
    ਖ਼ৗ׬ྃ࣌ʹJUFNTΛߋ৽
    Code with SwiftBond
    

    View Slide

15. final class RequestListViewModel {
    lazy var stateChangedObserver = Bond { [weak self] state in
    switch state {
    case .Requesting:
    UIApplication.sharedApplication().networkActivityIndicatorVisible = true
    default:
    UIApplication.sharedApplication().networkActivityIndicatorVisible = false
    }
    }
    init() {
    requestListState ->| stateChangedObserver
    }
    OFUXPSL"DUJWJUZ*OEJDBUPS7JTJCMFΛ4UBUFͰ#JOEJOH
    Code with SwiftBond
    

    View Slide

16. ·ͱΊ
    ɾΞϓϦΛঢ়ଶͱελοΫͰ؅ཧ
    ɾ͋Δঢ়ଶʹ͓͚Δը໘දࣔϩδοΫΛ
    ɹએݴతʹهड़
    ɾঢ়ଶ͕มԽͨ͠Βࣗಈతʹը໘දࣔ΋
    ɹมߋ͞ΕΔΑ͏ʹ
    

    View Slide

17. ߋʹৄࡉΛQiitaʹ΋ॻ͖·ͨ͠
    IUUQRJJUBDPNTVTJFZZJUFNTBGCCEGG
    

    View Slide

18. Enjoy happy coding!
    

    View Slide