diff --git a/android/gradle.properties b/android/gradle.properties index e848b208522bf7b0f09a52cc3e05b646f3151c4f..0d6ab806a45a68cb914b72e3caae2d9f99622045 100644 --- a/android/gradle.properties +++ b/android/gradle.properties @@ -1,5 +1,5 @@ org.gradle.jvmargs=-Xmx1536M android.useAndroidX=true android.enableJetifier=true -app.versionName=1.0.53 -app.versionCode=54 +app.versionName=1.0.54 +app.versionCode=55 diff --git a/lib/ui/screens/demo_page.dart b/lib/ui/screens/demo_page.dart index 06b0cbe3f57ea01b271a7a2c8d94faa757fae773..94dcb729310c1027311d7771c2ba2f88a6a6102a 100644 --- a/lib/ui/screens/demo_page.dart +++ b/lib/ui/screens/demo_page.dart @@ -6,6 +6,7 @@ import 'package:random/config/theme.dart'; import 'package:random/cubit/data_cubit.dart'; import 'package:random/cubit/settings_cubit.dart'; import 'package:random/ui/widgets/header_app.dart'; +import 'package:random/ui/widgets/styles_widget.dart'; class DemoPage extends StatelessWidget { const DemoPage({super.key}); @@ -29,6 +30,30 @@ class DemoPage extends StatelessWidget { fakeApiCall(), const SizedBox(height: 20), const AppHeader(text: 'BOTTOM'), + const StyledWidget( + child: SizedBox.square( + dimension: 40, + child: Center(child: Text('default')), + ), + ), + const SizedBox(height: 8), + const StyledWidget( + borderRadius: 0, + borderWidth: 12, + // depth: 8, + lowerColor: Colors.red, + upperColor: Colors.yellow, + child: Center(child: Text('custom 1')), + ), + const SizedBox(height: 8), + const StyledWidget( + borderRadius: 10, + borderWidth: 20, + depth: 20, + lowerColor: Colors.blueGrey, + upperColor: Colors.blue, + child: Center(child: Text('custom 2')), + ), ], ), ); diff --git a/lib/ui/widgets/styles_widget.dart b/lib/ui/widgets/styles_widget.dart new file mode 100644 index 0000000000000000000000000000000000000000..72f3670d44a0f0546aaef6ab51b248d1b707f58f --- /dev/null +++ b/lib/ui/widgets/styles_widget.dart @@ -0,0 +1,66 @@ +import 'package:flutter/material.dart'; + +class StyledWidget extends StatelessWidget { + const StyledWidget({ + super.key, + required this.child, + this.borderWidth = 10, + this.borderRadius = 4, + this.depth = 5, + this.lowerColor, + this.upperColor, + }); + + final Widget child; + final double borderWidth; + final double borderRadius; + final int depth; + final Color? lowerColor; + final Color? upperColor; + + Widget nestedContainers({ + required Widget child, + required int containerDepth, + required Color lowerColor, + required Color upperColor, + }) { + final double singleBorderWidth = borderWidth / depth; + final Color borderColor = + Color.lerp(upperColor, lowerColor, (containerDepth / depth - 0.5).abs() * 2) ?? + Colors.white; + + final double radius = borderRadius + borderRadius * (containerDepth / depth); + + return Container( + decoration: BoxDecoration( + color: borderColor, + border: Border.all( + color: borderColor, + width: singleBorderWidth, + ), + borderRadius: BorderRadius.circular(radius), + ), + child: containerDepth == 0 + ? Padding( + padding: const EdgeInsets.all(8), + child: child, + ) + : nestedContainers( + child: child, + containerDepth: containerDepth - 1, + lowerColor: lowerColor, + upperColor: upperColor, + ), + ); + } + + @override + Widget build(BuildContext context) { + return nestedContainers( + child: child, + containerDepth: depth, + lowerColor: lowerColor ?? Theme.of(context).colorScheme.onPrimary, + upperColor: upperColor ?? Theme.of(context).colorScheme.onSecondary, + ); + } +} diff --git a/pubspec.yaml b/pubspec.yaml index 7c22ee5f24e721a674c33fe96eff74db01594809..7e90b14560012a1c4cd151db8dfe1844b7539142 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -3,7 +3,7 @@ description: A random application, for testing purpose only. publish_to: "none" -version: 1.0.53+54 +version: 1.0.54+55 environment: sdk: "^3.0.0"