PageViewController をスワイプしかけて辞めると、次にスワイプした時にインデックスが２つカウントアップしてしまう事への回避方法

Question

やりたい事

UIPageViewController の子クラス PageViewController を作成し、extension の中で右にスワイプした時と左にスワイプさせたときで次のページもしくは前のページを表示させるようにしたいです。ページは要素数３つだけの配列にし、ループさせることでページがたくさんあるように見せようとしています。

困っていること

毎回綺麗にスワイプをすればほぼ思い通りに動くのですが、ページをめくりかけて「やっぱや〜めた」をすると、次にスワイプした時に２ページ分進んでしまいます。
理由が全く分からないわけではないのですが、「めくりかけてやっぱやめた」に対して page だけでなく index も変わらないようにするにはどうしたらいいのかが分からなくて困っています。回避する方法がありましたらご教授願います。

後、「ほぼ」と言いましたが、先へスワイプする時に一旦戻って進む事がある、もしくはその逆があります（print 文で確認）。

//
//  PageViewController.swift
//  ColorSample
//

import UIKit

let count: Int = 1 << (6 * 3)

class PageViewController: UIPageViewController {
    
    var eachViewControllers: [EachViewController] = []
    var red: [Int] = []
    var green: [Int] = []
    var blue: [Int] = []
    var rgba: [UIColor] = []
    var index: Int = 1
    var lastPage: Int = 1
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        self.dataSource = self
        
        // 1677万色の色の配列（要素数：count個）を作る
        for i in 0..<count {
            red.append(Int(arc4random_uniform(256)))
            green.append(Int(arc4random_uniform(256)))
            blue.append(Int(arc4random_uniform(256)))
            rgba.append(UIColor(red: CGFloat(red[i]) / 255.0, green: CGFloat(green[i]) / 255.0, blue: CGFloat(blue[i]) / 255.0, alpha: CGFloat(1.0)))
        }

        // EachViewController を3つだけ作る
        for i in 0..<3 {
            let eachViewController = EachViewController()
            eachViewController.setIndexTo(i)
            eachViewController.setBackgroundRgba(rgba[i])
            eachViewControllers.append(eachViewController)
        }
        
        // 1番目の EachViewController をセットする
        setViewControllers([eachViewControllers[1]], direction: .reverse, animated: false, completion: nil)
    }
    
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
    
}

extension PageViewController : UIPageViewControllerDataSource {
    
    // 次のページを表示する時に呼ばれる
    func pageViewController(_ pageViewController:
        UIPageViewController, viewControllerAfter viewController: UIViewController) -> UIViewController? {
        
        // ページを取得する
        let page = eachViewControllers.index(of: viewController as! EachViewController)!
        
        // インデックスをセットする
        index = (index + 1) % count
        
        // 前後ののページの値をセットする
        let nextPage = (page + 1) % 3
        let prevPage = (page + 2) % 3
        
        // デバッグ
        print("index: \(index), lastPage: \(lastPage) , page: >> [\(prevPage) -> \(page) -> \(nextPage)]")
        
        lastPage = nextPage

        // 新しく表示するページに変数をセットする
        eachViewControllers[lastPage].setBackgroundRgba(rgba[index])
        eachViewControllers[lastPage].setIndexTo(index)
        
        // 要らなくなったページをリリースする処理をここに入れる

        
        // 新しいページを返す
        return eachViewControllers[lastPage]
    }
    
    // 前のページを表示する時に呼ばれる
    func pageViewController(_ pageViewController: UIPageViewController, viewControllerBefore viewController:UIViewController) -> UIViewController? {
        
        // ページを取得する
        let page = eachViewControllers.index(of: viewController as! EachViewController)!
        
        // 前後ののページの値をセットする
        let nextPage = (page + 1) % 3
        let prevPage = (page + 2) % 3
        
        // インデックスをセットする
        index = (index - 1 + count) % count

        // デバッグ
        print("index: \(index), lastPage: \(lastPage) , page: << [\(prevPage) -> \(page) -> \(nextPage)]")

        lastPage = prevPage
        
        // 新しく表示するページに変数をセットする
        eachViewControllers[lastPage].setBackgroundRgba(rgba[index])
        eachViewControllers[lastPage].setIndexTo(index)
        
        // 要らなくなったページをリリースする処理をここに入れる

        
        // 新しいページを返す
        return eachViewControllers[lastPage]
    }
}

補足

言葉が足りませんでした。

        eachViewControllers[lastPage].setBackgroundRgba(rgba[lastPage])
        eachViewControllers[lastPage].setIndexTo(lastPage)

だと３ページ分しか表示できません。

やりたいのは

let count: Int = 1 << (6 * 3)

と定義したとても大きい数(count)だけのページを表示させたいのです。
（その、何番目なのかを index で持たせようとしています）

でも、
EachViewController クラスのインスタンスを count 個作るとメモリを喰って大変ですよね。
なので、添字が 0, 1, 2 の３つのインスタンスを

        for i in 0..<3 {
            let eachViewController = EachViewController()
            eachViewController.setIndexTo(i)
            eachViewController.setBackgroundRgba(rgba[i])
            eachViewControllers.append(eachViewController)
        }

の様に作り、
その背景色(rgba)及びページ番号(index)だけを書き換えて使いまわすことで大きい数のページがあるかのように見せたいという事です。

最初に eachViewControllers[0], eachViewControllers[1], eachViewControllers[2]を作って真ん中の eachViewControllers[1] を表示させておき、
１ページ進んだら[0], [1], [2]、から [1], [2], [0] へ（添字だけで書いてます）、さらに進んだら[2], [0], [1] と進めていくことで使いまわそうという考えです（戻る時も同様）。

どうしても言葉でうまく説明できないのがもどかしいのですが、少しでも伝わるでしょうか？

8/27 (14:03) 追記

コメントにも書きましたが、
pageViewController(_:didFinishAnimating:previousViewControllers:transitionCompleted:)
は使わずに、意図している動きが出来ているように見えています。

//  PageViewController.swift
extension PageViewController : UIPageViewControllerDataSource {

    // 次のページを表示する時に呼ばれる
    func pageViewController(_ pageViewController:
        UIPageViewController, viewControllerAfter viewController: UIViewController) -> UIViewController? {

        // ここにスワイプする前のページが入ってくるみたい（前回、スワイプ完了でも途中でやめても）
        let eachViewController = pageViewController.viewControllers?.first as! EachViewController
      
        // インデックスをインクリメントする
        index = (eachViewController.index + 1) % count
        
        // ページを取得する
        let page = eachViewControllers.index(of: viewController as! EachViewController)!

        // 次のページの値をセットする
        let nextPage = (page + 1) % 3
        
        // 新しく表示するページに変数をセットする
        eachViewControllers[nextPage].setBackgroundRgba(rgba[index])
        eachViewControllers[nextPage].setRgb(red: red[index], green: green[index], blue: blue[index])
        eachViewControllers[nextPage].setIndexTo(index)
        

        // 新しいページを返す
        return eachViewControllers[nextPage]
    }
}

で上手く行ってそうです。

let eachViewController = pageViewController.viewControllers?.first as! EachViewController
index = (eachViewController.index + 1) % count

がスワイプを途中でやめたときにインクリメントされない（経験則ですが）ようなので、
これを使ったのが良かったのかなと思っています。

勘違い等あるかも知れないので、閉めるのはまだにしておこうと思います。

気付いていない点、勘違いしてる点、
そもそもコードの書き方が汚い等ありましたら教えて下さい。

Answer 1

まず、EachViewControllerを使いまわしたいなら、最低２個あれば足りると思います。

次に、EachViewControllerにindexプロパティがあるのだから、PageViewControllerでindex変数を持つ必要はありません。
EachViewControllerのindexと、PageViewControllerのindexで整合が取れなくなってしまっているのが、今回の問題点です。
indexは以下のように更新すれば良いです。

eachViewController.index = (eachViewController.index + 1) % count

Comments

[taro_nii_chan]

なるほどです。

EachViewController は表に出てるのと、隠れてる裏のとの２つで良かったんですね。
PageViewController が index を持っていなければいけないというのも先入観でした。

動作確認済みです。
ありがとうございました。

Answer 2

どうしてこんなことをしようとしているのかわかりませんが、
ページ切り替え時に、新しく表示するEachViewControllerの背景色を
そのEachViewControllerが入っている配列番号に合わせてrgba配列から取り出したいなら、
そもそもindexという変数は不要で、

        eachViewControllers[lastPage].setBackgroundRgba(rgba[lastPage])
        eachViewControllers[lastPage].setIndexTo(lastPage)

のように、lastPageの番号の色を取り出したらいいと思うし、そもそも背景色の設定は
EachViewControllerの作成時に

        for i in 0..<3 {
            let eachViewController = EachViewController()
            eachViewController.setIndexTo(i)
            eachViewController.setBackgroundRgba(rgba[i])
            eachViewControllers.append(eachViewController)
        }

という形で配列番号に対応するする背景色を設定済みなので、
ページ切り替え時に背景色を設定し直す必要すらないように思います。

---

(8/24 21:40追記)

補足ありがとうございます。
やりたいことがわかりました。

そういうことであれば、
https://developer.apple.com/documentation/uikit/uipageviewcontrollerdelegate/1614090-pageviewcontroller
で説明されている、
UIPageViewControllerDelegateのpageViewController(_:didFinishAnimating:previousViewControllers:transitionCompleted:)メソッドを使うとうまくいくと思います。

現在実装しているUIPageViewControllerDataSourceのメソッドは、
次に表示するビューコントローラーを教えてくれと言っているだけであり、
それが呼ばれたからと言って必ずページ遷移するわけではありません。

上記で紹介したメソッドを使えば、画面遷移のアニメーションが完了したタイミングで呼ばれ、
次の画面に遷移した時は、transitionCompletedパラメータがtrue、
次に遷移するのをやめて戻した時は、transitionCompletedパラメータがfalse
で呼ばれます。
これを使うとうまくいくと思います。

また、
http://qiita.com/eKushida/items/d4fe95576a86f9e1d9fb
の「ページ番号の取得」の例にあるように、このタイミングでviewControllers.firstを取得すれば、
アニメーションが完了して現在表示されているビューコントローラーを得ることができますので、
そのビューコントローラーのプロパティにページ番号を入れておけば、
現在表示されているビューコントローラーのページ番号を知ることもできます。
このページ番号に相当しているのが、今回の質問ではindexなのだと思います。

---

(8/28 2:10追記)

確かに、EachViewControllerにindexを入れておけば、それで十分だと思います。

またStripeさんがおっしゃっている通り、それを使えばPageViewControllerの
indexプロパティは不要になるので、削除してしまえばよいと思います。

さらに、EachViewControllerを使い回す場合は2個で十分という話もありますが、
ページ切り替えに速度を求めないなら、使い回しでさえ不要で、ページ切り替え毎に
EachViewControllerを新しく作ればいいという話もあります。

(サンプル)

extension PageViewController : UIPageViewControllerDataSource {
    
    func pageViewController(_ pageViewController:
        UIPageViewController, viewControllerAfter viewController: UIViewController) -> UIViewController? {
        return nextPage(pageViewController, moveTo:1)
    }
    
    func pageViewController(_ pageViewController: UIPageViewController, viewControllerBefore viewController:UIViewController) -> UIViewController? {
        return nextPage(pageViewController, moveTo:-1)
    }
    
    func nextPage(_ pageViewController: UIPageViewController, moveTo:Int) -> EachViewController {
        let currentPage = pageViewController.viewControllers?.first as! EachViewController
        let newIndex = (currentPage.index + moveTo) % count
        let newPage = EachViewController()
        newPage.setBackgroundRgba(rgba[newIndex])
        newPage.setIndexTo(newIndex)
        return newPage
    }
}

Comments

[taro_nii_chan]

質問に補足を追加させていただきました。

[TakeOne]

補足ありがとうございます。
やりたいことがわかりましたので、回答を追記しました。

[taro_nii_chan]

おー、ありがとうございます。
そもそも使おうとしてるツール（メソッド）が違ってたんですね。
貴重な情報、ありがたいです。

続きは明日以降になると思いますが、
頑張ってみます。

[TakeOne]

UIPageViewControllerDataSourceのメソッドはもちろん必要なんですが、現在のページ番号(indexプロパティ)を更新するのはそのタイミングじゃなくて、didFinishAnimatingのメソッドが呼ばれたタイミングだということです。頑張ってみて下さい。

[taro_nii_chan]

意図した通りに動くようになりました。
pageViewController(_:didFinishAnimating:previousViewControllers:transitionCompleted:)は動きを追う上でとても役に立ちました。スワイプを初めた時、スワイプしきった時／しきらずに戻した時の動きの違いなど。
そして、結果的にそれは使わなくてもやりたい事が実現できていそうだと言うことが分かってきました。今日は遅いのでまた日を改めて詳しく途中経過報告致します。

[taro_nii_chan]

質問に追記いたしました。
よろしければご覧くださいませ。

[TakeOne]

回答追記しました。

[taro_nii_chan]

なるほどです。

実は EachViewController を２つないし３つで実行すると、スワイプを連打すると真っ白なページになることがありました。その場面でちょこっとスワイプしかけて戻ると色のついたページが表示されていました。それが使いまわしなしだと綺麗に表示されます。「ページ切り替えに速度を求めないなら」とのことでしたけど、むしろこっちの方が高速に対応してるように見えました。

なのでこれで行こうと思います。

この質問に回答していただいて私としてはとても勉強になりました。
お二人にベストアンサーをさしあげたい気持ちでいっぱいです。

ありがとうございました。