前回は、本のスキャン＋登録を１つのページでできるようにしました。

ただ、snackbarで実装したため、ユーザーが登録ボタンを押さずに前のページに戻れてしまう、という不具合の元となっていました。今回は、Dialog BOXで登録できるようにします。

Dialogボックスの表示

こちらは、やはりCook Bookのサンプルコードを参照して実装しました。

ただし、バーコードのonDetect関数が、Future関数であったため、下記のようにSetStateの内部でshowDialogを呼ばないといけないようです。（理由は理解せず。。）

        setState(() {

          showDialog(
            context: context,
            barrierDismissible: false,
            builder: (context) {
              return AlertDialog(
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　・・・
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　）
                                }
                      )
                     }

ボタンの配置などを見直し

ログイン・ログアウトのボタンなどが雑な配置になっていたのでPopUp メニューに配置します。
英語ですが、下記のYouTubeがわかりやすいです。

あと、ログインの時のメール入力のキーボードが一般入力だと「個人的に」いけていないので、メールアドレス入力のキーボードにしておきます。

スキャナーの横向きに対応する

mobile_scannerは現状横向きを検知してくれないため、下記を参考にして横向きに（なんちゃって）対応しました。

（後日談）実装はできていると思うのですが、scannerの動作が不安定になったので一旦外しました。

あとで復活させるためにメモだけ残しておきます。

書影の著作権について

本の表紙の使用について下調べしています。「引用」と言える形であれば良いらしい。

Eメールの確認の実装

前回実装したログインでは、嘘や他人のメールアドレスでもログインできてしまうので、下記を参考に実装しました。
ちょっとコードが古かったので手直ししています。

特に、controllerを使用したパスワード長さチェックのところは下記を参考に。

  @override
  void initState() {
    super.initState();

    // Start listening to changes.
    _userPasswordController.addListener(_checkPassWordLength);
  }

  void _checkPassWordLength() {
    final text = _userPasswordController.text;
    if (text.length >= 6) {
      _pswdOK = true;
    } else {
      _pswdOK = false;
    }
  }

ログインに成功したらpopuntilでHomeに戻ります。

またパスワードの可視・不可視を切り替えるのは下記を参考に。

今の見た感じ

ログイン関係などかなりスッキリしてきました。一覧と個別のページをもう少し改修して公開の準備していきたいと思います。（まだまだかなー。みなさんどこまで作り込まれるのか。。）

今後やりたいこと

• ログイン画面（以下のページ参照。今回メール確認を追加しました。）

• 本一覧表示（以下のページ参照）

• ライセンス関係表示

• 書評保存

• UI/UXの修正（今回少し対応。継続中）

• 登録した本の削除（以下のページ参照）

• コードの整理（Classの再定義など）（以下のページ参照）

• 本の一覧の検索・並べ替え（以下のページ参照）

• GoogleBookAPIも使えるようにする

• 本の情報追加する

• 多言語化する

次はこちら