"如何將漸變作為背景添加到我的 Flutter Web 應用程序的主體？"

Question

這是我嘗試過的：

body: Container(
          height: MediaQuery.of(context).size.height,
         width: MediaQuery.of(context).size.width,
          decoration: BoxDecoration(
            gradient:
            LinearGradient(colors: [Color(0xFFc2e59c), Color(0xFF64b3f4)]),
          )

我也嘗試不指定寬度和高度，但最終結果始終是一個不會完全填充主體的漸變 -

Answer 1

嘗試將代碼包裝在 Scaffold 中。 這是片段：

 Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        height: MediaQuery.of(context).size.height,
        width: MediaQuery.of(context).size.width,
        decoration: BoxDecoration(
          gradient:
          LinearGradient(colors: [Color(0xFFc2e59c), Color(0xFF64b3f4)]),
        )
      ),
   }

Answer 2

代碼片段：

@override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        width: double.infinity,
        height: MediaQuery.of(context).size.height,
        decoration: BoxDecoration(
          gradient: LinearGradient(
              colors: [
                Color(0xFFF6A064),
                Color(0xFFF24223),
                Color(0xFFEA7A6C),
                Color(0xFF27823),
              ],
              begin: Alignment.topCenter,
              end: Alignment.bottomCenter,
              stops: [0.0, 0.3, 0.6, 1.0],
              tileMode: TileMode.clamp),
        ),
        child: Center(
          child: Text(
           'Hello',
            style: TextStyle(fontSize: 29),
          ),
        ),
      ),
    );
  }