11月5日 進捗日記[自分用]

作業内容

内部処理の実装
 ・スコアの計算
 ・リセットボタンの実装

学習した内容

・TextFieldのリセットの仕方
・TextFieldを数字のみ受け付けるようにする

TextFieldのリセットの仕方

TextField内でcontroller: 引数を定義する。
controller:に指定した変数を.clear()すれば初期化できる。

child: TextField(
                      //ここで、コントローラの引数を指定する。
                     controller: _controller_scratch0,
                     keyboardType: TextInputType.number,
                     inputFormatters: [FilteringTextInputFormatter.digitsOnly],
                     onChanged: (value){
                       setState(() {
                         _scratch[0] = int.parse(value);
                         add();
                       });
                     },
                     decoration: InputDecoration(
                       //外枠をつける
                       border: OutlineInputBorder(),
                       hintText: 'スクラッチ',
                     ),
                     style: TextStyle(
                       color: Colors.blueAccent,
                       fontSize: 20.0,
                     ),
                   ),
 
 void reset(){
   setState(() {
       //ここにリセット処理を記載
         for(int i=0; i <5; i++){
           _scratch[i] = 0;
         }
         //ここでTextFieldをリセットしている
         _controller_scratch0.clear();
         _controller_scratch1.clear();
         _controller_scratch2.clear();
         _controller_scratch3.clear();
         _controller_scratch4.clear();
       }
     );
     add();
   }              

TextFieldを数字のみ受け付けるようにする

TextField()内でkeyboardType: とinputFormatters:を指定する。
前者はキーボードを数字キーボードにする。(まあ、なくてもいい)
後者は入力を数字に制限する。(こいつが本命)

keyboardType: TextInputType.number,
inputFormatters: [FilteringTextInputFormatter.digitsOnly],

その他

値を更新しても、画面描き変わらないなぁーと思っていたら値を更新する際にsetState()をしてなかった。setState()は画面の描画を更新する。

現状

画像1

今後

画面と内部処理が概ね完成したので、次回からはFirebaseとの連携をやっていきたい。
どうやってFirebaseを使うかなどの調べごとの方が多くなりそう

この記事が気に入ったらサポートをしてみませんか?