[FIXED] UI missing in Flutter APK

Issue

I've been trying since two days to resolve this weird issue.

In debug mode my app running good but in release apk UI not rendering. I've checked all possible solutions but can't fix it. As some UI is also missing from first screen.

Here is My app

Here is my First screen code

   class ChooseLanguage extends StatefulWidget {
  const ChooseLanguage({Key? key}) : super(key: key);

  @override
  State<ChooseLanguage> createState() => _ChooseLanguageState();
}

class _ChooseLanguageState extends State<ChooseLanguage> {
  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Scaffold(
        body: BackgroundImage(
          image: 'assets/images/mainBg.png',
          child: Padding(
            padding: EdgeInsets.symmetric(horizontal: Dimensions.width20),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Image.asset("assets/images/marhaba.png"),
                SizedBox(height: Dimensions.height150),
                const BigText(
                    text: 'Choose your language', color: Colors.white),
                SizedBox(height: Dimensions.height10),
                Image.asset("assets/images/choose_lang.png",
                    width: Dimensions.width230),
                SizedBox(height: Dimensions.height20),
                Row(
                    mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                    children: [
                      ElevatedButton(
                          onPressed: () {
                            Get.to(() => const LoginAs());
                          },
                          child: const Text('English')),
                      ElevatedButton(
                          onPressed: () {}, child: const Text('Arabic')),
                    ])
              ],
            ),
          ),
        ),
      ),
    );
  }
}

After Tapping On English Button Code

class LoginAs extends StatefulWidget {
  const LoginAs({Key? key}) : super(key: key);

  @override
  State<LoginAs> createState() => _LoginAsState();
}

class _LoginAsState extends State<LoginAs> {
  @override
  Widget build(BuildContext context) {
    return SafeArea(
        child: Scaffold(
      body: BackgroundImage(
        image: 'assets/images/mainBg.png',
        child: Padding(
          padding: EdgeInsets.symmetric(horizontal: 15),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              const BigText(text: 'Are You', color: Colors.white),
              SizedBox(height: 20),
              GestureDetector(
                onTap: () {
                  Get.to(() => const BottomNav());
                },
                child: const BigRoundedContainer(
                    image: "assets/images/visitor.png", text: 'Visitor'),
              ),
              SizedBox(height: 20),
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceAround,
                children: [
                  GestureDetector(
                    onTap: () {
                      Get.to(() => const ChooseAuth());
                    },
                    child: const BigRoundedContainer(
                        image: "assets/images/agency.png", text: 'Agency'),
                  ),
                  GestureDetector(
                    onTap: () {
                      Get.to(() => const ChooseAuth());
                    },
                    child: const BigRoundedContainer(
                        image: "assets/images/freelancer.png",
                        text: 'Freelancer'),
                  ),
                ],
              ),
              SizedBox(height:40),
              Image.asset("assets/images/enjoy.png", width: 200)
            ],
          ),
        ),
      ),
    ));
  }
}

BigRoundedContainer.dart

   class BigRoundedContainer extends StatelessWidget {
  final String image, text;

  const BigRoundedContainer({Key? key, required this.image, required this.text})
      : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      width: Dimensions.width130,
      height: Dimensions.height130,
      decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(Dimensions.radius30),
          color: Colors.white),
      child: Padding(
        padding: EdgeInsets.only(bottom: Dimensions.height10),
        child: Column(mainAxisAlignment: MainAxisAlignment.center, children: [
          Expanded(
            child: Image.asset(image, color: AppColors.fIconsAndTextColor),
          ),
          SmallText(text: text, size: Dimensions.height20),
        ]),
      ),
    );
  }
}

Edited

Logcat error

    Please configure Android SDK
2022-07-22 14:49:03.128 16923-16948/com.example.media_adv E/: [ZeroHung]zrhung_get_config: Get config failed for wp[0x0102]
2022-07-22 14:49:04.129 16923-16948/com.example.media_adv E/: [ZeroHung]zrhung_get_config: Get config failed for wp[0x0102]

error in logcat Please configure Android SDK

Here is my screenshot of project structure

Solution

My UI wasn't shown in release APK but in build APK it was ok. In first screen, which I've put in the question, I've a Text() and image, even the Text() wasn't displayed. So I resolve this issue by adding these lines in the main.dart. After that my UI shown. I don't know why should I've to delay it. If anyone can explain it I'll be grateful for him/her. Thanks.

void main() async{
  WidgetsFlutterBinding.ensureInitialized();
  await Future.delayed(const Duration(milliseconds: 300));
  runApp(const MyApp());
}

Answered By - samina
Answer Checked By - Gilberto Lyons (JavaFixing Admin)