Ensure logo has fixed size instead of expansion

threefoldtech · Jan 29, 2025 · 7d01102 · 7d01102
1 parent f017804
commit 7d01102
Show file tree

Hide file tree

Showing 2 changed files with 67 additions and 64 deletions.
diff --git a/app/lib/screens/main_screen.dart b/app/lib/screens/main_screen.dart
@@ -65,7 +65,8 @@ class _AppState extends State<MainScreen> {
           mainAxisAlignment: MainAxisAlignment.center,
           crossAxisAlignment: CrossAxisAlignment.center,
           children: [
-            const Expanded(
+            const SizedBox(
+              height: 200,
               child: Hero(
                 tag: 'logo',
                 child: HomeLogoWidget(
@@ -75,34 +76,32 @@ class _AppState extends State<MainScreen> {
             ),
             const SizedBox(height: 50),
             Container(
-              padding: const EdgeInsets.only(left: 12, right: 12),
+              padding: const EdgeInsets.symmetric(horizontal: 12),
               child: Text(
                 updateMessage != null
                     ? updateMessage.toString()
                     : errorMessage.toString(),
                 style: Theme.of(context).textTheme.bodyMedium!.copyWith(
-                    fontWeight: FontWeight.bold,
-                    color: errorMessage != null
-                        ? Theme.of(context).colorScheme.error
-                        : Theme.of(context).colorScheme.onSurface),
+                      fontWeight: FontWeight.bold,
+                      color: errorMessage != null
+                          ? Theme.of(context).colorScheme.error
+                          : Theme.of(context).colorScheme.onSurface,
+                    ),
               ),
             ),
-            const SizedBox(
-              height: 40,
-            ),
+            const SizedBox(height: 40),
             Visibility(
-                maintainSize: true,
-                maintainAnimation: true,
-                maintainState: true,
-                visible: errorMessage != null,
-                child: ElevatedButton(
-                  child: const Text(
-                    'RETRY',
-                  ),
-                  onPressed: () async {
-                    await pushScreens();
-                  },
-                ))
+              maintainSize: true,
+              maintainAnimation: true,
+              maintainState: true,
+              visible: errorMessage != null,
+              child: ElevatedButton(
+                child: const Text('RETRY'),
+                onPressed: () async {
+                  await pushScreens();
+                },
+              ),
+            ),
           ],
         ),
       ),

diff --git a/app/lib/widgets/home_logo.dart b/app/lib/widgets/home_logo.dart
@@ -7,61 +7,65 @@ class HomeLogoWidget extends StatelessWidget {
   const HomeLogoWidget({super.key, required this.animate});
 
   @override
-  Widget build(BuildContext context) {
-    return Column(
-      mainAxisAlignment: MainAxisAlignment.center,
-      crossAxisAlignment: CrossAxisAlignment.center,
-      children: [
-        Center(
-          child: animate
-              ? Column(
-                  children: [
-                    Lottie.asset(
+Widget build(BuildContext context) {
+  return Column(
+    mainAxisAlignment: MainAxisAlignment.center,
+    crossAxisAlignment: CrossAxisAlignment.center,
+    children: [
+      Center(
+        child: animate
+            ? Column(
+                mainAxisSize: MainAxisSize.min,
+                children: [
+                  SizedBox(
+                    width: 50,
+                    height: 50,
+                    child: Lottie.asset(
                       'assets/tfloading.json',
                       repeat: true,
                       animate: true,
-                      width: 50,
-                      height: 50,
                     ),
-                    const SizedBox(
-                      height: 10,
-                    ),
-                    Text(
-                      'THREEFOLD',
-                      style: Theme.of(context)
-                          .textTheme
-                          .headlineSmall!
-                          .copyWith(
-                              color: Theme.of(context).colorScheme.onSurface,
-                              fontWeight: FontWeight.bold),
-                    ),
-                  ],
-                )
-              : SvgPicture.asset(
+                  ),
+                  const SizedBox(height: 10),
+                  Text(
+                    'THREEFOLD',
+                    style: Theme.of(context).textTheme.headlineSmall!.copyWith(
+                          color: Theme.of(context).colorScheme.onSurface,
+                          fontWeight: FontWeight.bold,
+                        ),
+                  ),
+                ],
+              )
+            : SizedBox(
+                height: 50,
+                child: SvgPicture.asset(
                   'assets/TF_logo.svg',
                   alignment: Alignment.center,
                   colorFilter: ColorFilter.mode(
                     Theme.of(context).colorScheme.onSurface,
                     BlendMode.srcIn,
                   ),
                 ),
+              ),
+      ),
+      SizedBox(
+        height: MediaQuery.of(context).size.height * 0.04,
+        width: MediaQuery.of(context).size.width * 0.6,
+        child: Divider(
+          thickness: 2,
+          color: Theme.of(context).colorScheme.primary,
         ),
-        SizedBox(
-          height: MediaQuery.of(context).size.height * 0.04,
-          width: MediaQuery.of(context).size.width * 0.6,
-          child: Divider(
-            thickness: 2,
-            color: Theme.of(context).colorScheme.primary,
-          ),
-        ),
-        Text(
-          'CONNECT',
-          style: Theme.of(context).textTheme.titleLarge!.copyWith(
+      ),
+      Text(
+        'CONNECT',
+        style: Theme.of(context).textTheme.titleLarge!.copyWith(
               color: Theme.of(context).colorScheme.onSurface,
               letterSpacing: 10,
-              fontWeight: FontWeight.bold),
-        ),
-      ],
-    );
-  }
+              fontWeight: FontWeight.bold,
+            ),
+      ),
+    ],
+  );
+}
+
 }