ExamのUI実装

要求

受験ビュー

出題ビュー

ノートビューを間違えました

デルの実施方法

既存の方法ですべての画面にストーリーボードを作成し、コードを加えて完成しようとします.

に質問

これまでのやり方で進められてきた、ずっと感じていた問題が、今回の実施でさらに深刻になってきたと感じました.
ずっと感じていた問題は、コード、UI、ビューコントローラの過剰な重複です.
また、ストーリーボードから抜け出す考えも生まれました.
3つのニーズは、似たようなフレームワーク、似たような機能を持っています.
まったく同じ機能もたくさんあるので、できるだけ繰り返さないようにしたいと思います.

改善された方法-1

UIで最も簡単な共通要素は何ですか?

上端UINavigationBar

上部左側の選択円問題番号ボタンと、このボタンをクリックしたときに現れる末端風車

.

下の前の質問、次の質問ボタン

これらの共通点は、ExamRootViewControllerにおいて達成され得る.
3つの要件のビューコントローラはExamRootViewControllerを継承しています.
これで、基本フレームワークが手配されます.

1の問題

単純UIの共通点はそうですが、これらの共通点以外に、どんな類似点がありますか?

題、写真、作成ビューボタン

このビューは悪くないですが、違います.違うけど、似すぎます.
各ビューにレイアウトコンストレイントを追加する場合は、[前の問題](Previous Problems)ボタンと[次の問題](Next Problems)ボタンをクリックします.
アニメはどうやって?アニメーションをどのように切り替えませんか?

改善された方法-2

これをContainerViewと呼び、プロトコルとして定義します.

enum ExamType { case create, take, history }

protocol ContainerView: UIView { ... }

class CreateQuestionContainerView: UIView, ContainerView { ... }
class TakeExamContainerView: UIView, ContainerView { ... }
class ExamHistoryContainerView: UIView, ContainerView { ... }

さらに、ExamTypeおよびQuestionも受信し、対応するContainerViewに戻ります.ContainerViewFactoryが定義されています.

class ContainerViewFactory {
    public static func getContainerView(of type: ExamType, question: Question?) -> ContainerView {
        ...
    }
}

したがって、ContainerViewを使用する人にとっては、ExamTypeおよびQuestionが投げ出される限りである.
対応するContainerViewが得られた.
得られたビューでアニメーションを実現でき、変換が非常に便利です.