Wyatt-FOSS/wyatt-packages
Wyatt-FOSS/wyatt-packages
6
2
Fork 0
Code Issues 20 Pull Requests 4 Actions Packages Projects Releases Activity

feat(ui): add some useful text customization in TextWrapper (closes #149)
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse Source
This commit is contained in:
Hugo Pointcheval 2023-02-21 18:05:56 +01:00
parent 6037e13f50
commit a68da15cdc
Signed by: hugo
GPG Key ID: 3AAC487E131E00BC
17 changed files with 148 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/wyatt_ui_components/example/lib/components/custom_app_bar.dart
View File

@ -11,7 +11,7 @@ class CustomAppBar extends AppBarComponent with $CustomAppBarCWMixin {
@override
Widget build(BuildContext context) => AppBar(
title: Text(
super.title?.text ?? '',
super.title?.data ?? '',
),
);
}

2
packages/wyatt_ui_components/example/lib/components/custom_error_widget.dart
View File

@ -12,6 +12,6 @@ class CustomErrorWidget extends ErrorWidgetComponent
@override
Widget build(BuildContext context) => ColoredBox(
color: Colors.red,
child: Center(child: Text(error?.text ?? 'Error')),
child: Center(child: Text(error?.data ?? 'Error')),
);
}

79
packages/wyatt_ui_components/lib/src/core/utils/text_wrapper.dart
View File

@ -21,16 +21,87 @@ import 'package:wyatt_ui_components/wyatt_wyatt_ui_components.dart';
/// a [Text] or a [RichText].
class TextWrapper {
const TextWrapper(
this.text, {
this.data, {
this.style,
this.gradientColors,
this.textAlign,
this.textDirection,
this.softWrap,
this.overflow,
this.maxLines,
this.selectionColor,
});
const TextWrapper.text(this.text)
const TextWrapper.text(this.data)
: style = null,
gradientColors = null;
gradientColors = null,
textAlign = null,
textDirection = null,
softWrap = null,
overflow = null,
maxLines = null,
selectionColor = null;
final String text;
/// Text to be displayed
final String data;
/// Style of the text
final TextStyle? style;
/// Colors of the gradient, if any
final MultiColor? gradientColors;
/// How the text should be aligned horizontally.
final TextAlign? textAlign;
/// The directionality of the text.
///
/// This decides how [textAlign] values like [TextAlign.start] and
/// [TextAlign.end] are interpreted.
///
/// This is also used to disambiguate how to render bidirectional text. For
/// example, if the [data] is an English phrase followed by a Hebrew phrase,
/// in a [TextDirection.ltr] context the English phrase will be on the left
/// and the Hebrew phrase to its right, while in a [TextDirection.rtl]
/// context, the English phrase will be on the right and the Hebrew phrase on
/// its left.
///
/// Defaults to the ambient [Directionality], if any.
final TextDirection? textDirection;
/// Whether the text should break at soft line breaks.
///
/// If false, the glyphs in the text will be positioned as if there was
/// unlimited horizontal space.
final bool? softWrap;
/// How visual overflow should be handled.
///
/// If this is null [TextStyle.overflow] will be used, otherwise the value
/// from the nearest [DefaultTextStyle] ancestor will be used.
final TextOverflow? overflow;
/// An optional maximum number of lines for the text to span, wrapping if
/// necessary.
/// If the text exceeds the given number of lines, it will be truncated
/// according to [overflow].
///
/// If this is 1, text will not wrap. Otherwise, text will be wrapped at the
/// edge of the box.
///
/// If this is null, but there is an ambient [DefaultTextStyle] that specifies
/// an explicit number for its [DefaultTextStyle.maxLines], then the
/// [DefaultTextStyle] value will take precedence. You can use a [RichText]
/// widget directly to entirely override the [DefaultTextStyle].
final int? maxLines;
/// The color to use when painting the selection.
///
/// This is ignored if [SelectionContainer.maybeOf] returns null
/// in the [BuildContext] of the [Text] widget.
///
/// If null, the ambient [DefaultSelectionStyle] is used (if any); failing
/// that, the selection color defaults to [DefaultSelectionStyle.defaultColor]
/// (semi-transparent grey).
final Color? selectionColor;
}

16
packages/wyatt_ui_kit/lib/src/components/buttons/file_selection_button/file_selection_button_screen.dart
View File

@ -182,8 +182,14 @@ class FileSelectionButtonScreen
/// More infos in `ThemeResolver` class
if (title != null) ...[
Text(
title!.text,
title!.data,
style: title!.style ?? style.title,
textAlign: title!.textAlign,
textDirection: title!.textDirection,
softWrap: title!.softWrap,
overflow: title!.overflow,
maxLines: title!.maxLines,
selectionColor: title!.selectionColor,
).toGradient(
gradientColors: style.foregroundColors,
),
@ -203,8 +209,14 @@ class FileSelectionButtonScreen
if (subTitle != null) ...[
const Gap(5),
Text(
subTitle!.text,
subTitle!.data,
style: subTitle!.style ?? style.subTitle,
textAlign: title!.textAlign,
textDirection: title!.textDirection,
softWrap: title!.softWrap,
overflow: title!.overflow,
maxLines: title!.maxLines,
selectionColor: title!.selectionColor,
).toGradient(
gradientColors: style.foregroundColors,
),

8
packages/wyatt_ui_kit/lib/src/components/buttons/flat_button/flat_button_screen.dart
View File

@ -180,8 +180,14 @@ class FlatButtonScreen extends CubitScreen<ButtonCubit, ButtonState> {
/// More infos in ThemeResolver class
if (label != null) ...[
Text(
label!.text,
label!.data,
style: label!.style ?? style.label,
textAlign: label!.textAlign,
textDirection: label!.textDirection,
softWrap: label!.softWrap,
overflow: label!.overflow,
maxLines: label!.maxLines,
selectionColor: label!.selectionColor,
).toGradient(
gradientColors: style.foregroundColors,
)

8
packages/wyatt_ui_kit/lib/src/components/buttons/symbol_button/symbol_button_screen.dart
View File

@ -193,8 +193,14 @@ class SymbolButtonScreen
if (label != null) ...[
Gap(style.padding?.horizontal ?? 10),
Text(
label!.text,
label!.data,
style: label!.style ?? style.label,
textAlign: label!.textAlign,
textDirection: label!.textDirection,
softWrap: label!.softWrap,
overflow: label!.overflow,
maxLines: label!.maxLines,
selectionColor: label!.selectionColor,
).toGradient(
gradientColors: style.foregroundColors,
),

2
packages/wyatt_ui_kit/lib/src/components/cards/information_card/information_card.dart
View File

@ -77,7 +77,7 @@ class InformationCard extends InformationCardComponent
if (body != null) ...[
const Gap(_bodyTopSpacing),
CardText(
body!.text,
body!,
textType: TextType.body,
style: body!.style,
gradientColors: body!.gradientColors,

4
packages/wyatt_ui_kit/lib/src/components/cards/information_card/widgets/information_card_titles.dart
View File

@ -41,7 +41,7 @@ class InformationCardTitles extends StatelessWidget {
children: [
if (title != null) ...[
CardText(
title!.text,
title!,
textType: TextType.title,
style: title!.style,
gradientColors: title!.gradientColors,
@ -50,7 +50,7 @@ class InformationCardTitles extends StatelessWidget {
if (subtitle != null) ...[
const Gap(_titlesLineSpacing),
CardText(
subtitle!.text,
subtitle!,
textType: TextType.subtitle,
style: subtitle!.style,
gradientColors: subtitle!.gradientColors,

4
packages/wyatt_ui_kit/lib/src/components/cards/portfolio_card/portfolio_card.dart
View File

@ -70,7 +70,7 @@ class PortfolioCard extends PortfolioCardComponent with $PortfolioCardCWMixin {
const Gap(20),
],
CardText(
description!.text,
description!,
textType: TextType.body,
style: description!.style,
gradientColors: description!.gradientColors,
@ -105,7 +105,7 @@ class PortfolioCard extends PortfolioCardComponent with $PortfolioCardCWMixin {
const Gap(20),
],
CardText(
description!.text,
description!,
textType: TextType.body,
style: description!.style,
gradientColors: description!.gradientColors,

12
packages/wyatt_ui_kit/lib/src/components/cards/portfolio_card/widgets/portfolio_card_header.dart
View File

@ -64,7 +64,7 @@ class PortfolioCardHeader extends StatelessWidget {
children: [
if (keyword != null)
...keyword!.map(
(e) => Container(
(word) => Container(
margin: const EdgeInsets.all(3),
padding: const EdgeInsets.all(6),
decoration: BoxDecoration(
@ -75,8 +75,14 @@ class PortfolioCardHeader extends StatelessWidget {
borderRadius: BorderRadius.circular(8),
),
child: Text(
e.text,
style: e.style ?? context.textTheme.bodySmall,
word.data,
style: word.style ?? context.textTheme.bodySmall,
textAlign: word.textAlign,
textDirection: word.textDirection,
softWrap: word.softWrap,
overflow: word.overflow,
maxLines: word.maxLines,
selectionColor: word.selectionColor,
),
),
),

6
packages/wyatt_ui_kit/lib/src/components/cards/quote_card/quote_card.dart
View File

@ -71,7 +71,7 @@ class QuoteCard extends QuoteCardComponent with $QuoteCardCWMixin {
),
if (quote != null) ...[
CardText(
quote!.text,
quote!,
textType: TextType.body,
style: quote!.style,
gradientColors: quote!.gradientColors,
@ -102,7 +102,7 @@ class QuoteCard extends QuoteCardComponent with $QuoteCardCWMixin {
children: [
if (name != null) ...[
CardText(
name!.text,
name!,
textType: TextType.body,
style: name!.style,
gradientColors: name!.gradientColors,
@ -110,7 +110,7 @@ class QuoteCard extends QuoteCardComponent with $QuoteCardCWMixin {
],
if (subtitle != null) ...[
CardText(
subtitle!.text,
subtitle!,
textType: TextType.subtitle,
style: subtitle!.style,
gradientColors: subtitle!.gradientColors,

2
packages/wyatt_ui_kit/lib/src/components/cards/skill_card/skill_card.dart
View File

@ -67,7 +67,7 @@ class SkillCard extends SkillCardComponent with $SkillCardCWMixin {
const Gap(25),
if (description != null) ...[
CardText(
description!.text,
description!,
textType: TextType.body,
style: description!.style,
gradientColors: description!.gradientColors,

2
packages/wyatt_ui_kit/lib/src/components/cards/skill_card/widgets/skill_card_header.dart
View File

@ -64,7 +64,7 @@ class SkillCardHeader extends StatelessWidget {
children: [
if (title != null) ...[
CardText(
title!.text,
title!,
textType: TextType.title,
style: title!.style,
gradientColors: title!.gradientColors,

8
packages/wyatt_ui_kit/lib/src/components/cards/skill_card/widgets/skill_card_skills.dart
View File

@ -37,7 +37,7 @@ class SkillCardSkills extends StatelessWidget {
Widget build(BuildContext context) => Column(
children: skills!
.map(
(e) => Row(
(skill) => Row(
children: [
Icon(
leadingIcon ?? Icons.check,
@ -47,10 +47,10 @@ class SkillCardSkills extends StatelessWidget {
const Gap(10),
Expanded(
child: CardText(
e.text,
skill,
textType: TextType.body,
style: e.style,
gradientColors: e.gradientColors,
style: skill.style,
gradientColors: skill.gradientColors,
),
),
],

13
packages/wyatt_ui_kit/lib/src/components/cards/widgets/card_text.dart
View File

@ -26,16 +26,17 @@ enum TextType {
class CardText extends StatelessWidget {
const CardText(
this.data, {
this.text, {
required this.textType,
this.style,
this.gradientColors,
super.key,
});
final TextWrapper text;
final TextType textType;
final TextStyle? style;
final MultiColor? gradientColors;
final String data;
TextStyle? _getStyle(BuildContext context) {
if (style != null) {
@ -56,7 +57,13 @@ class CardText extends StatelessWidget {
@override
Widget build(BuildContext context) => Text(
data,
text.data,
style: _getStyle(context),
textAlign: text.textAlign,
textDirection: text.textDirection,
softWrap: text.softWrap,
overflow: text.overflow,
maxLines: text.maxLines,
selectionColor: text.selectionColor,
).toGradient(gradientColors: gradientColors);
}

6
packages/wyatt_ui_kit/lib/src/components/text_inputs/text_input_screen.dart
View File

@ -315,14 +315,14 @@ class TextInputScreen extends CubitScreen<TextInputCubit, TextInputState> {
labelStyle: style.labelStyle,
)
: null,
hintText: hint?.text,
hintText: hint?.data,
hintStyle: hint?.style,
prefixIcon: prefixIcon,
prefixText: prefixText?.text,
prefixText: prefixText?.data,
prefixStyle: prefixText?.style,
prefixIconColor: style.prefixIconColor,
suffixIcon: suffixIcon,
suffixText: suffixText?.text,
suffixText: suffixText?.data,
suffixStyle: suffixText?.style,
suffixIconColor: style.suffixIconColor,
enabled: state.controlState != ControlState.disabled,

8
packages/wyatt_ui_kit/lib/src/components/text_inputs/widgets/label_widget.dart
View File

@ -31,7 +31,13 @@ class LabelWidget extends StatelessWidget {
@override
Widget build(BuildContext context) => Text(
label?.text ?? '',
label?.data ?? '',
style: labelStyle,
textAlign: label!.textAlign,
textDirection: label!.textDirection,
softWrap: label!.softWrap,
overflow: label!.overflow,
maxLines: label!.maxLines,
selectionColor: label!.selectionColor,
);
}