Flutter app UI disappears after restarting once in apk release

Issue

After downloading the app through the apk release, in the first time, it works normally. But once you close the app and open it again, the ui elements disappears. It has a very strange behavior, if I restart the device, it works in the first time the app is open (after the restart), and after closing it, it doens’t work again.

This only happens in the release version, debugging works as expected.

Screen opening the app for the first time, or after restarting the device Screen after restarting the app

I am using Getx, I don’t see a relation since I have already develop other apps with this structure. This is the code of the first page loaded.

return Container(
      constraints: BoxConstraints(minWidth: Get.width, minHeight: Get.height),
      decoration: BoxDecoration(
        color: Theme.of(context).primaryColor,
        image: DecorationImage(
          opacity: 0.35,
          repeat: ImageRepeat.repeat,
          image: AssetImage(AppConstants.assets.background_image),
        ),
      ),
      child: Scaffold(
        backgroundColor: Colors.transparent,
        body: Container(
          child: SingleChildScrollView(
            child: Column(
              mainAxisSize: MainAxisSize.min,
              children: [
                SizedBox(
                  width: Get.width,
                  height: Get.height * 0.45,
                  child: Center(
                    child: Padding(
                      padding: const EdgeInsets.only(top: 80.0),
                      child: SizedBox(
                        width: Get.width * 0.8,
                        height: Get.height * 0.3,
                        child: Image.asset(AppConstants.assets.logo_image),
                      ),
                    ),
                  ),
                ),
                SizedBox(
                  height: Get.height * 0.55,
                  child: TabBarView(
                    controller: controller.tabController,
                    physics: NeverScrollableScrollPhysics(),
                    children: [
                      TelephoneTab(),
                      CodeTab(),
                    ],
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );

I have tried removing the background image by removing the Container before the Scaffold entirely, removing every element in the UI and adding just a small button in the middle. Updating my kotlin.

Tried running with flutter run --release. No logs.

May be the same thing as this.

Flutter doctor is fine.

Solution

The problem seems to be something related to the Scaffold and the Container with the background image. Elements outside the Scaffold were drawn as usual.

I changed the first page of the app in order to go directly to the HomePage and it worked fine, even logging out to the LoginPage.

Then I tried creating a SplashPage before the LoginPage, initially, I used the same structure with the Container, BoxDecoration, and Scaffold. The problem was happening again, but this time in the SplashPage, everything inside the Scaffold was invisible with the same behavior as mentioned above.

After that, I simply define the extendBody as true in the Scaffold of the SplashPage and the problem stopped occurring.

I don’t exactly understand what this changes. Feel free to add an explanation to this answer.

Answered By – Eduardo Nonemacher

Answer Checked By – Mary Flores (FlutterFixes Volunteer)

Leave a Reply

Your email address will not be published. Required fields are marked *