當腳手架背景顏色為低陰影時，列表視圖出現在頂部小部件后面

Question

我在將淺色 colors 應用於腳手架時注意到一個問題，

我有一個包含幾個小部件和擴展列表視圖的列，

向上滾動列表視圖時，它顯示在列的頂部小部件后面

我附上了一張圖片，

有什么解決方案可以阻止 listview 的這種行為

Widget build(BuildContext context) {

      var size = MediaQuery.of(context).size;
      return SafeArea(
        child: Scaffold(
          backgroundColor: Colors.blue.shade50,
          body: Column(
            children: [
              Padding(
                padding: const EdgeInsets.all(20.0),
                child: Container(
                  height: 100,
                  color: Colors.green,
                  child: Center(child: Text('Balance Card'),),
                ),
              ),
              Padding(
                padding: const EdgeInsets.all(20.0),
                child: Container(
                  height: 100,
                  color: Colors.red,
                  child: Center(child: Text('History Card'),),
                ),
              ),


              Expanded(
                child: ListView.builder(
                    itemCount: 100,
                    itemBuilder: (context,index){
                      return ListTile(
                        tileColor: Colors.white,
                        title: Text(index.toString()),
                      );
                    }),
              ),
            ],
          ),

        ),
      );
    }

圖像：

Answer 1

  Widget build(BuildContext context) {
var size = MediaQuery.of(context).size;
return SafeArea(
  child: Scaffold(
    body: Column(
      children: [
        Container(
          color: Colors.blue.shade50,
          child: Column(
            children: [
              Padding(
                padding: const EdgeInsets.all(20.0),
                child: Container(
                  height: 100,
                  color: Colors.green,
                  child: const Center(
                    child: Text('Balance Card'),
                  ),
                ),
              ),
              Padding(
                padding: const EdgeInsets.all(20.0),
                child: Container(
                  height: 100,
                  color: Colors.red,
                  child: const Center(
                    child: Text('History Card'),
                  ),
                ),
              ),
            ],
          ),
        ),
        Expanded(
          child: ListView.builder(
              itemCount: 100,
              itemBuilder: (context, index) {
                return ListTile(
                  tileColor: Colors.white,
                  title: Text(index.toString()),
                );
              }),
        ),
      ],
    ),
  ),
);}

我想你想要這樣的樣子。你能查一下嗎？