Flutter 程序不会在真实的 Android 设备上显示部分代码

Question

在我的 flutter 项目中，我所显示的代码主体在我的模拟器中运行良好，但在真正的 Android 设备上它只是一个灰屏。

底部的列表视图可以在不同的文件中正常工作，所以我认为问题不在于列表视图

body: Column(
        children: [
          Container(
            height: MediaQuery.of(context).size.height / 8,
            color: Colors.red,
            child: Expanded( 
              child:Padding( 
              padding: EdgeInsets.all(5),
            child: Row(
              children: [
                Expanded( 
                  child: Padding(
                  padding: EdgeInsets.all(2),
                  child: Column(
                  children: [
                    GestureDetector( 
                      onTap: ()  
                      },
                    child:CircleAvatar(
                      radius: 30,
                      backgroundColor: Colors.blue,
                      backgroundImage: AssetImage("assets/images/Frühstück.jpg" 
                        ),
                        ),
                        Text("Frühstück")
                         ]
                       ),
                    )
                     ),
                  Expanded( 
                  child: Padding(
                  padding: EdgeInsets.all(2),
                  child: Column(
                  children: [
                    GestureDetector(
                      onTap: () {
                        print("111");
                      },
                    child:CircleAvatar(
                      radius: 30,
                      backgroundColor: Colors.blue,
                      backgroundImage: AssetImage("assets/images/Frühstück.jpg"),
                        ),
                         ),
                         Text("Frühstück")
                         ]
                       ),
                    )
                     ),
                    Expanded( 
                  child: Padding(
                  padding: EdgeInsets.all(2),
                  child: Column(
                  children: [
                    GestureDetector(
                      onTap:() {
                        
                      },
                    child:CircleAvatar(
                      
                      radius: 30,
                      backgroundColor: Colors.blue,
                      backgroundImage: AssetImage("assets/images/Frühstück.jpg"),
                        ),
                         ),
                        Text("Frühstück")
                         ]
                       ),
                    )
                     )
                  ],
                )
                 )
                 )
                ),
                Expanded(
                child: ListView.builder(
                itemCount: displayed_meal_list.length,
                itemBuilder: (context, index) => ListTile(
                contentPadding: EdgeInsets.all(10),
                leading: Image(image: AssetImage(displayed_meal_list[index].meal_image!)),
                title: Text(displayed_meal_list[index].meal_title!),
                subtitle: Text("${displayed_meal_list[index].meal_time!} min" ),
                 ) 
              )
              ),

              ],
            ),

这是我的模拟器所显示的内容：

这是我的真实设备所显示的：

我感谢任何帮助。

我不知道问题出在哪里

Answer 1

...代码在我的模拟器中运行良好，但在真正的 Android 设备上它只是一个灰屏。

这是因为您在

Debug

模式下出现某种类型的错误。

如果您检查代码日志，您将看到错误：

Incorrect use of ParentDataWidget.

这是因为，在您的代码中，您使用

Expanded

作为

Container

的子级：

Column(
          children: [
            Container(
              // <-- 1. You have a Container here,
              height: MediaQuery.of(context).size.height / 8,
              color: Colors.red,
              child: Expanded(
                // <-You have an Expanded widget here, but the
                // Expanded should be used inside a Row, Column, or Flex.
                child: Padding(
                  padding: EdgeInsets.all(5),

如果您想使用

Container

，则必须使用

Expanded

。

另请参阅

• 容器在释放模式下显示灰色框（颤动）
• 父数据小部件的使用不正确。扩展的小部件必须放置在弹性小部件内