Whoocus

TextField(
              style: TextStyle(
                color: Colors.black,
              ),
              decoration: InputDecoration(
                filled: true,
                fillColor: Colors.white,
                icon: Icon(
                  Icons.location_city,
                  color: Colors.white,
                ),
                hintText: 'Enter Name',
                hintStyle: TextStyle(
                  color: Colors.grey,
                ),
                border: OutlineInputBorder(
                  borderRadius: BorderRadius.all(
                    Radius.circular(10.0),
                  ),
                  borderSide: BorderSide.none,
                ),
              ),
            ),

Theme(
  data: Theme.of(context).copyWith(splashColor: Colors.transparent),
  child: TextField(
    autofocus: false,
    style: TextStyle(fontSize: 22.0, color: Color(0xFFbdc6cf)),
    decoration: InputDecoration(
      filled: true,
      fillColor: Colors.white,
      hintText: 'Username',
      contentPadding:
          const EdgeInsets.only(left: 14.0, bottom: 8.0, top: 8.0),
      focusedBorder: OutlineInputBorder(
        borderSide: BorderSide(color: Colors.white),
        borderRadius: BorderRadius.circular(25.7),
      ),
      enabledBorder: UnderlineInputBorder(
        borderSide: BorderSide(color: Colors.white),
        borderRadius: BorderRadius.circular(25.7),
      ),
    ),
  ),
);

thenを使用 (非同期処理)

void main(){
  print("A");
  futurePrint(Duration(milliseconds: 2000), "B")
    .then((status) => print(status));
  print("C");
  futurePrint(Duration(milliseconds: 1000), "D")
    .then((status) => print(status));
  print("E");
}

Future<String> futurePrint(Duration dr, String msg){
  return Future.delayed(dr).then((onValue) => msg);
}

//A
//C
//E
//D
//B

async / await を使用 (同期処理)

void main() async {
  print("A");
  await futurePrint(Duration(milliseconds: 2000), "B")
    .then((status) => print(status));
  print("C");
  await futurePrint(Duration(milliseconds: 1000), "D")
    .then((status) => print(status));
  print("E");
}

Future<String> futurePrint(Duration dr, String msg){
  return Future.delayed(dr).then((onValue) => msg);
}

//A
//B
//C
//D
//E

Flutter を勉強し始めた。

そこで少しハマったところを覚え書きとして記載しておく。

下記のコードでも両方動作する。

Widget build(BuildContext context) {
  return MaterialApp(
    home: Scaffold(
      appBar: AppBar(
        title: const Text('Sample Page'),
      ),
    ),
  );
}

Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      title: const Text('Sample Page'),
    ),
  );
}

上記2つは動作するのだが、その違いは大きい。例えば、前画面から上記のページを下記にて呼んだ場合、前者はナビゲータバーの戻るボタンが表示されない。つまり、ページのスタックに積まれるのはAppレベルではないため階層が異なる。

Navigator.push(context, MaterialPageRoute(builder: (context) => NextPage()));

少しづつだが理解を深めたいと思う。