倒數計時

因為在讓啟動介面切換到下一個介面時，製造一個倒數的效果。

開始的時候，我們必須改成有狀態，才能倒數。

首先 我們需要倒數的計算變數
final cal=10;
int number =0;

再來是倒數的函數
會利用迴圈的方式來倒數

Future<void> _count() async {
    number = cal;
    for (var i = 0; i < cal; i++) {
      await Future.delayed(const Duration(seconds: 1), () {
        if (mounted == true) {
          setState(() {
            number--;
          });
        }
      });

      if (number == 0) {
        print('倒數結束');
      }
    }
  }

這樣啟動介面就完成了

再來是製作歡迎介面，
歡迎介面有三部分，文字、圖片、按鈕

文字程式碼:

Widget _buildView(){
    return Column(
      mainAxisAlignment:MainAxisAlignment.center,
      children:[
        //標題
        const Text(
            "Welcome to my house",
            style:const TextStyle(
              fontSize:20,
              fontWeight:FontWeight.bold,
              color:Colors.blue,

            ),
        ),

圖片程式碼:

Image.asset(
          AssetsImages.welJpg,
          height:450,
          width:double.infinity,
          fit:BoxFit.fitWidth,
        ),

按鈕程式碼:

Widget _btn(){
    return Row(
      children:[
        //skip
        TextButton(onPressed:(){},
          child:Text('Skip',
            style:TextStyle(
              fontSize:15,
              color:Colors.black,
              fontWeight:FontWeight.w200,
            ),
          ),
        ),
        //start

        const Spacer(),

        ElevatedButton(onPressed:(){},
          style:ButtonStyle(
            elevation:MaterialStateProperty.all(0),
            minimumSize:MaterialStateProperty.all(Size.zero),
           ),
          child:Text("Start",
          style:TextStyle(
            fontSize:16,
            color:Colors.white,


            fontWeight:FontWeight.w200,
          ),
          ),
        ),
      ],
    );
  }

這樣就做好一個歡迎視窗

接下來也是系列學過的，從啟動介面切換到歡迎介面，
Navigator.pushReplacement(context,MaterialPageRoute(builder: (context)=>WelcomePage()));

這樣就完成兩個介面。
最後是登入介面

就大功告成了