'Widgets not rendered when building Flutter apk

So I've been working on flutter for quite some time but recently, after i changed my laptop, I encountered a strange problem.

When i run the app in debug mode on emulator or on my physical device, it runs well but when i build an apk(debug and release both), it fails to render some widgets.This time i have a card and I've shown some data on it but i see some grey color instead of my data

How it should appear: Working app screenshot

How it appears on app installed from built apk:

Error app screenshot

Here's the code to card widget that has the prroblem (I've saved user's information on Globals.currentUser and passing it to profile page as User)

ExpandablePanel(
            collapsed: Container(
              height: 170,
              child: Card(
                shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(20)
                ),
                elevation: 8,
                child: Center(
                  child: Expanded(
                    child: Table(
                      children: [
                        TableRow(
                          children: [
                            Expanded(child: Text('Name',style: GoogleFonts.comfortaa(),)),
                            Expanded(child: Text('${widget.user.data['name']}',style: GoogleFonts.comfortaa(),)),
                          ],
                        ),
                        TableRow(
                            children: [
                              SizedBox(height: 8,),
                              SizedBox(height: 8,),
                            ]
                        ),
                        TableRow(
                          children: [
                            Expanded(child: Text('Country',style: GoogleFonts.comfortaa(),)),
                            Expanded(child: Text('${widget.user.data['country']}',style: GoogleFonts.comfortaa(),)),
                          ],
                        ),
                        TableRow(
                            children: [
                              SizedBox(height: 8,),
                              SizedBox(height: 8,),
                            ]
                        ),
                        TableRow(
                          children: [
                            Expanded(child: Text('City',style: GoogleFonts.comfortaa(),)),
                            Expanded(child: Text('${widget.user.data['city']}',style: GoogleFonts.comfortaa(),)),
                          ],
                        ),
                        TableRow(
                            children: [
                              SizedBox(height: 8,),
                              SizedBox(height: 8,),
                            ]
                        ),
                        TableRow(
                          children: [
                            Expanded(child: Text('Username',style: GoogleFonts.comfortaa(),)),
                            Expanded(child: Text ('${widget.user.data['username']}',style: GoogleFonts.comfortaa(),)),
                          ],
                        ),
                        TableRow(
                            children: [
                              SizedBox(height: 8,),
                              SizedBox(height: 8,),
                            ]
                        ),
                      ],
                    ),
                  ),
                ),
              ),
            ),
            header: Padding(
                padding: EdgeInsets.fromLTRB(20, 10, 20, 10),
                child: Text("About me",style: GoogleFonts.poppins(fontSize: 20,fontWeight: FontWeight.w400),)),
          )

Solution 1:^[1]

It seems that your app reads an external database to get the data it needs however you didn't add the Internet permission in your main AndroidManifest.xml file at android\app\src\main\AndroidManifest.xml.

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.new_app">
    <!-- Add the following line
    -->
    <uses-permission android:name="android.permission.INTERNET"/>
</manifest>

Internet permission is added by flutter in the debug and profile manifests which are used by default when the app is running on debug mode on your emulator

Solution 2:^[2]

I fixed it!

I'm not sure what it was but i was using table and Expanded widget together So i removed the table and used rows wrapped in a column without the expanded and it ran well

Solution 3:^[3]

I had a similar problem with a Listview widget inside an Expanded widget. I solved it by replacing Expanded with Container with width and height. (In some phones this error showed when debugging, but some it only showed after flutter build apk install)

Expanded(
    child: ListView.builder())

Caused gray output but,

Container(
    height: height,
    width: width,
    child: ListView.builder())

Worked fine.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1	ByteMe
Solution 2	Abdul Rehman
Solution 3	such19

'Widgets not rendered when building Flutter apk

Solution 1:[1]

Solution 2:[2]

Solution 3:[3]

Sources

Related Questions

Solution 1:^[1]

Solution 2:^[2]

Solution 3:^[3]