Skip to content
Snippets Groups Projects
Commit 0728feb9 authored by Benoît Harrault's avatar Benoît Harrault
Browse files

Improve StyledButton widget

parent ee88e15c
Branches
Tags
1 merge request!70Resolve "Improve StyledButton widget"
Pipeline #6033 passed
Stage: build-debug
This commit is part of merge request !70. Comments created here will be created in the context of that merge request.
Show whitespace changes
Inline Side-by-side
android/gradle.properties
+ 2
− 2
View file @ 0728feb9
org.gradle.jvmargs=-Xmx1536M
android.useAndroidX=true
android.enableJetifier=true
app.versionName=1.0.56
app.versionCode=57
app.versionName=1.0.57
app.versionCode=58
lib/ui/widgets/styled_button.dart → lib/ui/helpers/styled_button.dart
+ 210
− 0
View file @ 0728feb9
import 'package:auto_size_text/auto_size_text.dart';
import 'package:flutter/material.dart';
import 'package:random/utils/color_extensions.dart';
......@@ -5,44 +6,29 @@ import 'package:random/utils/color_extensions.dart';
class StyledButton extends StatelessWidget {
const StyledButton({
super.key,
required this.caption,
required this.color,
required this.onPressed,
this.onLongPress,
required this.child,
});
final String caption;
final Color color;
final VoidCallback? onPressed;
final VoidCallback? onLongPress;
final Widget child;
@override
Widget build(BuildContext context) {
const double borderWidth = 4;
final Color borderColor = color.darken(40);
const double borderRadius = 10;
return GestureDetector(
onTap: onPressed,
child: Container(
width: 60,
height: 60,
decoration: BoxDecoration(
color: color,
border: Border.all(
color: borderColor,
width: borderWidth,
),
borderRadius: BorderRadius.circular(borderRadius),
),
child: CustomPaint(
painter: StyledButtonPainter(
baseColor: color,
),
child: Center(
child: Text(
factory StyledButton.text({
Key? key,
required VoidCallback? onPressed,
VoidCallback? onLongPress,
required String caption,
required Color color,
}) {
final Widget captionWidget = AutoSizeText(
caption,
maxLines: 1,
style: TextStyle(
inherit: true,
fontSize: 30,
fontWeight: FontWeight.w900,
color: color.darken(60),
shadows: [
......@@ -68,8 +54,86 @@ class StyledButton extends StatelessWidget {
),
],
),
);
return StyledButton(
color: color,
onPressed: onPressed,
onLongPress: onLongPress,
child: captionWidget,
);
}
factory StyledButton.icon({
Key? key,
required VoidCallback? onPressed,
VoidCallback? onLongPress,
required IconData icon,
required Color color,
required double iconSize,
}) {
return StyledButton(
color: color,
onPressed: onPressed,
onLongPress: onLongPress,
child: Icon(
icon,
color: color.darken(60),
size: iconSize,
shadows: [
Shadow(
blurRadius: 5.0,
color: color.lighten(60),
offset: const Offset(2, 2),
),
Shadow(
blurRadius: 5.0,
color: color.lighten(60),
offset: const Offset(2, -2),
),
Shadow(
blurRadius: 5.0,
color: color.lighten(60),
offset: const Offset(-2, 2),
),
Shadow(
blurRadius: 5.0,
color: color.lighten(60),
offset: const Offset(-2, -2),
),
],
),
);
}
@override
Widget build(BuildContext context) {
const double borderWidth = 4;
final Color borderColor = color.darken(40);
const double borderRadius = 10;
return Container(
margin: EdgeInsets.all(2),
padding: EdgeInsets.all(2),
decoration: BoxDecoration(
color: color,
border: Border.all(
color: borderColor,
width: borderWidth,
),
borderRadius: BorderRadius.circular(borderRadius),
),
child: CustomPaint(
painter: StyledButtonPainter(
baseColor: color,
),
child: MaterialButton(
onPressed: onPressed,
onLongPress: onLongPress,
padding: EdgeInsets.all(8),
materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
minWidth: 40,
child: child,
),
),
);
......
lib/ui/widgets/styles_widget.dart → lib/ui/helpers/styled_container.dart
+ 2
− 2
View file @ 0728feb9
import 'package:flutter/material.dart';
class StyledWidget extends StatelessWidget {
const StyledWidget({
class StyledContainer extends StatelessWidget {
const StyledContainer({
super.key,
required this.child,
this.borderWidth = 20,
......
lib/ui/screens/demo_page.dart
+ 50
− 11
View file @ 0728feb9
......@@ -6,8 +6,8 @@ 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/styled_button.dart';
import 'package:random/ui/widgets/styles_widget.dart';
import 'package:random/ui/helpers/styled_button.dart';
import 'package:random/ui/helpers/styled_container.dart';
import 'package:random/utils/tools.dart';
class DemoPage extends StatelessWidget {
......@@ -24,11 +24,11 @@ class DemoPage extends StatelessWidget {
const SizedBox(height: 8),
const AppHeader(text: 'TOP'),
const SizedBox(height: 20),
StyledWidget(
StyledContainer(
child: persistedCounterBlock(BlocProvider.of<DataCubit>(context)),
),
const SizedBox(height: 8),
StyledWidget(
StyledContainer(
borderRadius: 0,
borderWidth: 12,
// depth: 8,
......@@ -37,7 +37,7 @@ class DemoPage extends StatelessWidget {
child: testBlocConsumer(),
),
const SizedBox(height: 8),
StyledWidget(
StyledContainer(
borderRadius: 10,
borderWidth: 30,
depth: 20,
......@@ -54,44 +54,83 @@ class DemoPage extends StatelessWidget {
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
StyledButton(
caption: 'A',
StyledButton.text(
caption: 'ABC',
color: Colors.yellow,
onPressed: () {
printlog('A');
},
),
StyledButton(
StyledButton.text(
caption: '❤️‍🔥',
color: Colors.red,
onPressed: () {
printlog('fire!');
},
),
StyledButton(
StyledButton.text(
caption: '⭐',
color: Colors.green,
onPressed: () {
printlog('star!');
},
),
StyledButton(
StyledButton.text(
caption: '🧁',
color: Colors.blue,
onPressed: () {
printlog('Cupcake');
},
),
StyledButton.icon(
icon: UniconsLine.setting,
color: Colors.purple,
iconSize: 20,
onPressed: () {
printlog('icon');
},
),
],
),
const SizedBox(height: 8),
StyledButton(
StyledButton.text(
caption: 'BUTTON - LARGE',
color: Colors.orange,
onPressed: () {
printlog('large button');
},
),
const SizedBox(height: 8),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
TextButton(
child: Text('ABC'),
onPressed: () {
printlog('TextButton');
},
),
OutlinedButton(
child: Text('❤️‍🔥'),
onPressed: () {
printlog('OutlinedButton');
},
),
FilledButton(
child: Text('⭐'),
onPressed: () {
printlog('FilledButton');
},
),
ElevatedButton(
child: Text('🧁'),
onPressed: () {
printlog('ElevatedButton');
},
),
],
),
],
),
);
......
pubspec.lock
+ 22
− 14
View file @ 0728feb9
......@@ -17,6 +17,14 @@ packages:
url: "https://pub.dev"
source: hosted
version: "2.11.0"
auto_size_text:
dependency: "direct main"
description:
name: auto_size_text
sha256: "3f5261cd3fb5f2a9ab4e2fc3fba84fd9fcaac8821f20a1d4e71f557521b22599"
url: "https://pub.dev"
source: hosted
version: "3.0.0"
bloc:
dependency: transitive
description:
......@@ -37,10 +45,10 @@ packages:
dependency: transitive
description:
name: camera_android_camerax
sha256: "7cd93578ad201dcc6bb5810451fb00d76a86bab9b68dceb68b8cbd7038ac5846"
sha256: e65d0d29a298926c63b0f009c5e045735a3ac183f5ae61a07ad826d8007a6018
url: "https://pub.dev"
source: hosted
version: "0.6.8+3"
version: "0.6.9+1"
camera_avfoundation:
dependency: transitive
description:
......@@ -186,10 +194,10 @@ packages:
dependency: "direct dev"
description:
name: flutter_lints
sha256: "3f41d009ba7172d5ff9be5f6e6e6abb4300e263aab8866d2a0842ed2a70f8f0c"
sha256: "5398f14efa795ffb7a33e9b6a08798b26a180edac4ad7db3f231e40f82ce11e1"
url: "https://pub.dev"
source: hosted
version: "4.0.0"
version: "5.0.0"
flutter_localizations:
dependency: transitive
description: flutter
......@@ -252,10 +260,10 @@ packages:
dependency: transitive
description:
name: lints
sha256: "976c774dd944a42e83e2467f4cc670daef7eed6295b10b36ae8c85bcbf828235"
sha256: "3315600f3fb3b135be672bf4a178c55f274bebe368325ae18462c89ac1e3b413"
url: "https://pub.dev"
source: hosted
version: "4.0.0"
version: "5.0.0"
material_color_utilities:
dependency: transitive
description:
......@@ -465,10 +473,10 @@ packages:
dependency: transitive
description:
name: synchronized
sha256: "51b08572b9f091f8c3eb4d9d4be253f196ff0075d5ec9b10a884026d5b55d7bc"
sha256: "69fe30f3a8b04a0be0c15ae6490fc859a78ef4c43ae2dd5e8a623d45bfcf9225"
url: "https://pub.dev"
source: hosted
version: "3.3.0+2"
version: "3.3.0+3"
term_glyph:
dependency: transitive
description:
......@@ -505,26 +513,26 @@ packages:
dependency: transitive
description:
name: web
sha256: d43c1d6b787bf0afad444700ae7f4db8827f701bc61c255ac8d328c6f4d52062
sha256: cd3543bd5798f6ad290ea73d210f423502e71900302dde696f8bff84bf89a1cb
url: "https://pub.dev"
source: hosted
version: "1.0.0"
version: "1.1.0"
win32:
dependency: transitive
description:
name: win32
sha256: "68d1e89a91ed61ad9c370f9f8b6effed9ae5e0ede22a270bdfa6daf79fc2290a"
sha256: "4d45dc9069dba4619dc0ebd93c7cec5e66d8482cb625a370ac806dcc8165f2ec"
url: "https://pub.dev"
source: hosted
version: "5.5.4"
version: "5.5.5"
xdg_directories:
dependency: transitive
description:
name: xdg_directories
sha256: faea9dee56b520b55a566385b84f2e8de55e7496104adada9962e0bd11bcff1d
sha256: "7a3f37b05d989967cdddcbb571f1ea834867ae2faa29725fd085180e0883aa15"
url: "https://pub.dev"
source: hosted
version: "1.0.4"
version: "1.1.0"
sdks:
dart: ">=3.5.0 <4.0.0"
flutter: ">=3.24.0"
pubspec.yaml
+ 3
− 2
View file @ 0728feb9
......@@ -3,7 +3,7 @@ description: A random application, for testing purpose only.
publish_to: "none"
version: 1.0.56+57
version: 1.0.57+58
environment:
sdk: "^3.0.0"
......@@ -13,6 +13,7 @@ dependencies:
sdk: flutter
# base
auto_size_text: ^3.0.0
easy_localization: ^3.0.1
equatable: ^2.0.5
flutter_bloc: ^8.1.1
......@@ -29,7 +30,7 @@ dependencies:
path: ^1.9.0
dev_dependencies:
flutter_lints: ^4.0.0
flutter_lints: ^5.0.0
flutter:
uses-material-design: true
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please to comment