feat(ui): update default extension implementation
Some checks failed
continuous-integration/drone/pr Build is failing

This commit is contained in:
Hugo Pointcheval 2023-04-28 16:08:10 +02:00
parent 4ebb679a29
commit 01a5619dc5
Signed by: hugo
GPG Key ID: 3AAC487E131E00BC
8 changed files with 59 additions and 57 deletions

View File

@ -55,11 +55,11 @@ class FileSelectionButtonThemeExtensionDefault
focusedStyle: style, focusedStyle: style,
hoveredStyle: style.copyWith( hoveredStyle: style.copyWith(
backgroundColors: backgroundColors:
MultiColor.single(theme.colorScheme.primary.withOpacity(0.92)), MultiColor.single(theme.colorScheme.primary.withOpacity(0.80)),
), ),
tappedStyle: style.copyWith( tappedStyle: style.copyWith(
backgroundColors: backgroundColors:
MultiColor.single(theme.colorScheme.primary.withOpacity(0.92)), MultiColor.single(theme.colorScheme.primary.withOpacity(0.75)),
), ),
selectedStyle: style, selectedStyle: style,
disabledStyle: style.copyWith( disabledStyle: style.copyWith(

View File

@ -43,7 +43,7 @@ class SimpleIconButtonThemeExtensionDefault
radius: (theme.buttonTheme.shape is RoundedRectangleBorder) radius: (theme.buttonTheme.shape is RoundedRectangleBorder)
? (theme.buttonTheme.shape as RoundedRectangleBorder).borderRadius ? (theme.buttonTheme.shape as RoundedRectangleBorder).borderRadius
: null, : null,
padding: theme.buttonTheme.padding, padding: const EdgeInsets.all(5),
foregroundColors: foregroundColor, foregroundColors: foregroundColor,
backgroundColors: backgroundColor, backgroundColors: backgroundColor,
animationDuration: Duration.zero, animationDuration: Duration.zero,
@ -54,11 +54,11 @@ class SimpleIconButtonThemeExtensionDefault
focusedStyle: style, focusedStyle: style,
hoveredStyle: style.copyWith( hoveredStyle: style.copyWith(
backgroundColors: backgroundColors:
MultiColor.single(theme.colorScheme.primary.withOpacity(0.92)), MultiColor.single(theme.colorScheme.primary.withOpacity(0.80)),
), ),
tappedStyle: style.copyWith( tappedStyle: style.copyWith(
backgroundColors: backgroundColors:
MultiColor.single(theme.colorScheme.primary.withOpacity(0.92)), MultiColor.single(theme.colorScheme.primary.withOpacity(0.75)),
), ),
disabledStyle: style.copyWith( disabledStyle: style.copyWith(
foregroundColors: foregroundColors:

View File

@ -37,10 +37,11 @@ class SymbolButtonThemeExtensionDefault extends SymbolButtonThemeExtension {
factory SymbolButtonThemeExtensionDefault.from(ThemeData theme) { factory SymbolButtonThemeExtensionDefault.from(ThemeData theme) {
final backgroundColor = MultiColor.single(theme.colorScheme.primary); final backgroundColor = MultiColor.single(theme.colorScheme.primary);
final foregroundColor = MultiColor.single(theme.colorScheme.onPrimary); final foregroundColor = MultiColor.single(theme.colorScheme.onPrimary);
final textColor = MultiColor.single(theme.textTheme.bodyMedium?.color);
final style = SymbolButtonStyle( final style = SymbolButtonStyle(
labelStyle: labelStyle:
theme.textTheme.labelLarge?.copyWith(color: foregroundColor.color), theme.textTheme.labelLarge?.copyWith(color: textColor.color),
dimension: theme.buttonTheme.height * 1.5, dimension: theme.buttonTheme.height * 1.5,
radius: (theme.buttonTheme.shape is RoundedRectangleBorder) radius: (theme.buttonTheme.shape is RoundedRectangleBorder)
? (theme.buttonTheme.shape as RoundedRectangleBorder).borderRadius ? (theme.buttonTheme.shape as RoundedRectangleBorder).borderRadius
@ -56,11 +57,11 @@ class SymbolButtonThemeExtensionDefault extends SymbolButtonThemeExtension {
focusedStyle: style, focusedStyle: style,
hoveredStyle: style.copyWith( hoveredStyle: style.copyWith(
backgroundColors: backgroundColors:
MultiColor.single(theme.colorScheme.primary.withOpacity(0.92)), MultiColor.single(theme.colorScheme.primary.withOpacity(0.80)),
), ),
tappedStyle: style.copyWith( tappedStyle: style.copyWith(
backgroundColors: backgroundColors:
MultiColor.single(theme.colorScheme.primary.withOpacity(0.92)), MultiColor.single(theme.colorScheme.primary.withOpacity(0.75)),
), ),
disabledStyle: style.copyWith( disabledStyle: style.copyWith(
foregroundColors: foregroundColors:
@ -71,6 +72,8 @@ class SymbolButtonThemeExtensionDefault extends SymbolButtonThemeExtension {
selectedStyle: style.copyWith( selectedStyle: style.copyWith(
backgroundColors: backgroundColors:
MultiColor.single(theme.colorScheme.primary.withOpacity(0.92)), MultiColor.single(theme.colorScheme.primary.withOpacity(0.92)),
borderColors: textColor,
stroke: 3,
), ),
); );
} }

View File

@ -45,15 +45,15 @@ class CardThemeExtensionDefault extends CardThemeExtension {
factory CardThemeExtensionDefault.from(ThemeData theme) => factory CardThemeExtensionDefault.from(ThemeData theme) =>
CardThemeExtensionDefault( CardThemeExtensionDefault(
radius: const BorderRadius.all(Radius.circular(12)), radius: const BorderRadius.all(Radius.circular(12)),
padding: theme.cardTheme.margin ?? const EdgeInsets.all(4), padding: theme.cardTheme.margin ?? const EdgeInsets.all(15),
backgroundColors: MultiColor.single(theme.cardTheme.color), backgroundColors: MultiColor.single(theme.cardColor),
borderColors: MultiColor.single(theme.cardTheme.color), borderColors: MultiColor.single(theme.canvasColor),
minSize: const Size(330, 0), minSize: const Size(330, 0),
maxSize: const Size(390, double.infinity), maxSize: const Size(390, double.infinity),
titleStyle: theme.textTheme.titleLarge, titleStyle: theme.textTheme.titleLarge,
subtitleStyle: theme.textTheme.titleMedium, subtitleStyle: theme.textTheme.titleMedium,
bodyStyle: theme.textTheme.bodyMedium, bodyStyle: theme.textTheme.bodyMedium,
stroke: 1, stroke: 0,
shadow: null, shadow: null,
); );

View File

@ -26,38 +26,40 @@ class RichTextBuilders extends DemoPage {
String get title => 'RichTextBuilders'; String get title => 'RichTextBuilders';
@override @override
Widget build(BuildContext context) => ListView( Widget build(BuildContext context) => SelectionArea(
cacheExtent: 1000, child: ListView(
children: [ cacheExtent: 1000,
const Gap(20), children: [
Align( const Gap(20),
child: Text( Align(
title, child: Text(
style: Theme.of(context).textTheme.titleLarge, title,
style: Theme.of(context).textTheme.titleLarge,
),
), ),
), const Gap(20),
const Gap(20), const Padding(
const Padding( padding: EdgeInsets.all(8),
padding: EdgeInsets.all(8), child: RichTextBuilder(
child: RichTextBuilder( text: '''
text: ''' Innovation, Expertise et Accompagnement...
Innovation, Expertise et Accompagnement... Notre agence de développement Wyatt Studio met tout en oeuvre pour vous aider à <gradient-blue>concrétiser vos idées</gradient-blue> de solutions informatiques et mobiles.
Notre agence de développement Wyatt Studio met tout en oeuvre pour vous aider à <gradient-blue>concrétiser vos idées</gradient-blue> de solutions informatiques et mobiles.
Vous aussi, comme beaucoup dautres <gradient-blue>agences ou startups</gradient-blue>, faites nous confiance pour la réalisation de votre projet dès maintenant !
Vous aussi, comme beaucoup dautres <gradient-blue>agences ou startups</gradient-blue>, faites nous confiance pour la réalisation de votre projet dès maintenant ! ''',
''', ),
), ),
), const Gap(20),
const Gap(20), const Padding(
const Padding( padding: EdgeInsets.all(8),
padding: EdgeInsets.all(8), child: RichTextBuilder(
child: RichTextBuilder( text: '''
text: ''' Je peux être <blue>bleu</blue>, ou même <gradient-red>rouge en dégradé</gradient-red>. À vrai dire <green>je peux</green> être <gradient-blue>un peu</gradient-blue> n'importe quelle couleur.
Je peux être <blue>bleu</blue>, ou même <gradient-red>rouge en dégradé</gradient-red>. À vrai dire <green>je peux</green> être <gradient-blue>un peu</gradient-blue> n'importe quelle couleur. ''',
''', ),
), ),
), const Gap(20),
const Gap(20), ],
], ),
); );
} }

View File

@ -52,7 +52,9 @@ class CardThemeExtensionImpl extends CardThemeExtension {
borderColors: WyattColors.lightGradient, borderColors: WyattColors.lightGradient,
titleStyle: theme.textTheme.titleLarge, titleStyle: theme.textTheme.titleLarge,
subtitleStyle: theme.textTheme.titleMedium, subtitleStyle: theme.textTheme.titleMedium,
bodyStyle: theme.textTheme.bodyMedium, bodyStyle: theme.textTheme.bodyMedium?.copyWith(
height: 1.5,
),
minSize: const Size(330, 0), minSize: const Size(330, 0),
maxSize: const Size(390, double.infinity), maxSize: const Size(390, double.infinity),
shadow: BoxShadow( shadow: BoxShadow(
@ -76,7 +78,9 @@ class CardThemeExtensionImpl extends CardThemeExtension {
borderColors: WyattColors.grayGradient, borderColors: WyattColors.grayGradient,
titleStyle: theme.textTheme.titleLarge, titleStyle: theme.textTheme.titleLarge,
subtitleStyle: theme.textTheme.titleMedium, subtitleStyle: theme.textTheme.titleMedium,
bodyStyle: theme.textTheme.bodyMedium, bodyStyle: theme.textTheme.bodyMedium?.copyWith(
height: 1.5,
),
minSize: const Size(330, 0), minSize: const Size(330, 0),
maxSize: const Size(390, double.infinity), maxSize: const Size(390, double.infinity),
shadow: BoxShadow( shadow: BoxShadow(

View File

@ -16,6 +16,7 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:wyatt_ui_components/wyatt_ui_components.dart'; import 'package:wyatt_ui_components/wyatt_ui_components.dart';
import 'package:wyatt_ui_kit/src/core/design_system/colors.dart';
class LoaderThemeExtensionImpl extends LoaderThemeExtension { class LoaderThemeExtensionImpl extends LoaderThemeExtension {
const LoaderThemeExtensionImpl({ const LoaderThemeExtensionImpl({
@ -27,9 +28,8 @@ class LoaderThemeExtensionImpl extends LoaderThemeExtension {
theme ??= ThemeData.light(); theme ??= ThemeData.light();
return const LoaderThemeExtensionImpl( return const LoaderThemeExtensionImpl(
colors: MultiColor([ colors: MultiColor([
Color(0xFF436EF4), WyattColors.blue1,
Color(0xFF3C97FB), WyattColors.light,
Colors.transparent,
]), ]),
stroke: 15, stroke: 15,
); );
@ -37,10 +37,9 @@ class LoaderThemeExtensionImpl extends LoaderThemeExtension {
factory LoaderThemeExtensionImpl.dark({ThemeData? theme}) { factory LoaderThemeExtensionImpl.dark({ThemeData? theme}) {
theme ??= ThemeData.dark(); theme ??= ThemeData.dark();
return const LoaderThemeExtensionImpl( return LoaderThemeExtensionImpl(
colors: MultiColor([ colors: MultiColor([
Color(0xFF3C97FB), ...WyattColors.blueBtnGradient.colors,
Color(0xFF436EF4),
Colors.transparent, Colors.transparent,
]), ]),
stroke: 15, stroke: 15,

View File

@ -49,7 +49,6 @@ class RichTextBuilderThemeExtensionImpl extends RichTextBuilderThemeExtension {
static Map<String, TextStyle> stylesFor(ThemeData theme) => { static Map<String, TextStyle> stylesFor(ThemeData theme) => {
'gradient-blue': GradientTextStyle.from( 'gradient-blue': GradientTextStyle.from(
theme.textTheme.bodyMedium?.copyWith( theme.textTheme.bodyMedium?.copyWith(
fontSize: 20,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
height: 1.8, height: 1.8,
), ),
@ -60,7 +59,6 @@ class RichTextBuilderThemeExtensionImpl extends RichTextBuilderThemeExtension {
), ),
'gradient-red': GradientTextStyle.from( 'gradient-red': GradientTextStyle.from(
theme.textTheme.bodyMedium?.copyWith( theme.textTheme.bodyMedium?.copyWith(
fontSize: 20,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
height: 1.8, height: 1.8,
), ),
@ -71,7 +69,6 @@ class RichTextBuilderThemeExtensionImpl extends RichTextBuilderThemeExtension {
), ),
'gradient-green': GradientTextStyle.from( 'gradient-green': GradientTextStyle.from(
theme.textTheme.bodyMedium?.copyWith( theme.textTheme.bodyMedium?.copyWith(
fontSize: 20,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
height: 1.8, height: 1.8,
), ),
@ -81,7 +78,6 @@ class RichTextBuilderThemeExtensionImpl extends RichTextBuilderThemeExtension {
]), ]),
), ),
'blue': theme.textTheme.bodyMedium?.copyWith( 'blue': theme.textTheme.bodyMedium?.copyWith(
fontSize: 20,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
color: const Color(0xFF3C97FB), color: const Color(0xFF3C97FB),
height: 1.8, height: 1.8,
@ -90,7 +86,6 @@ class RichTextBuilderThemeExtensionImpl extends RichTextBuilderThemeExtension {
color: Color(0xFF3C97FB), color: Color(0xFF3C97FB),
), ),
'red': theme.textTheme.bodyMedium?.copyWith( 'red': theme.textTheme.bodyMedium?.copyWith(
fontSize: 20,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
color: const Color(0xFFF44464), color: const Color(0xFFF44464),
height: 1.8, height: 1.8,
@ -99,7 +94,6 @@ class RichTextBuilderThemeExtensionImpl extends RichTextBuilderThemeExtension {
color: Color(0xFFF44464), color: Color(0xFFF44464),
), ),
'green': theme.textTheme.bodyMedium?.copyWith( 'green': theme.textTheme.bodyMedium?.copyWith(
fontSize: 20,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
color: const Color(0xFF00D16C), color: const Color(0xFF00D16C),
height: 1.8, height: 1.8,