Skip to content

Commit

Permalink
feat: Add missing parameters to InlineTextStyle (#3146)
Browse files Browse the repository at this point in the history
Add missing parameters to `InlineTextStyle`, such as `height` and
`shadows`.

Without this, it is not possible to configure such parameters in the new
text rendering pipeline. Since the other parameters are 1:1 to Flutter's
`TextStyle`, these missing fields seem to have been just an oversight.
  • Loading branch information
luanpotter authored May 5, 2024
1 parent 187c09f commit ce9392a
Show file tree
Hide file tree
Showing 3 changed files with 135 additions and 9 deletions.
10 changes: 10 additions & 0 deletions packages/flame/lib/src/text/renderers/text_paint.dart
Original file line number Diff line number Diff line change
Expand Up @@ -72,6 +72,16 @@ class TextPaint extends TextRenderer {
fontWeight: style.fontWeight,
fontStyle: style.fontStyle,
letterSpacing: style.letterSpacing,
wordSpacing: style.wordSpacing,
height: style.height,
leadingDistribution: style.leadingDistribution,
shadows: style.shadows,
fontFeatures: style.fontFeatures,
fontVariations: style.fontVariations,
decoration: style.decoration,
decorationColor: style.decorationColor,
decorationStyle: style.decorationStyle,
decorationThickness: style.decorationThickness,
);
}
}
64 changes: 56 additions & 8 deletions packages/flame/lib/src/text/styles/inline_text_style.dart
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,10 @@ import 'package:flame/text.dart';
import 'package:flutter/rendering.dart';
import 'package:meta/meta.dart';

/// A [FlameTextStyle] used to style an inline text element.
///
/// Note: the fields on this class are equivalent to the fields on Flutter's
/// [TextStyle] class; check its documentation for more details.
@immutable
class InlineTextStyle extends FlameTextStyle {
InlineTextStyle({
Expand All @@ -12,6 +16,16 @@ class InlineTextStyle extends FlameTextStyle {
this.fontWeight,
this.fontStyle,
this.letterSpacing,
this.wordSpacing,
this.height,
this.leadingDistribution,
this.shadows,
this.fontFeatures,
this.fontVariations,
this.decoration,
this.decorationColor,
this.decorationStyle,
this.decorationThickness,
});

final Color? color;
Expand All @@ -21,6 +35,16 @@ class InlineTextStyle extends FlameTextStyle {
final FontWeight? fontWeight;
final FontStyle? fontStyle;
final double? letterSpacing;
final double? wordSpacing;
final double? height;
final TextLeadingDistribution? leadingDistribution;
final List<Shadow>? shadows;
final List<FontFeature>? fontFeatures;
final List<FontVariation>? fontVariations;
final TextDecoration? decoration;
final Color? decorationColor;
final TextDecorationStyle? decorationStyle;
final double? decorationThickness;

late final TextRenderer renderer = asTextRenderer();

Expand All @@ -34,19 +58,43 @@ class InlineTextStyle extends FlameTextStyle {
fontWeight: other.fontWeight ?? fontWeight,
fontStyle: other.fontStyle ?? fontStyle,
letterSpacing: other.letterSpacing ?? letterSpacing,
wordSpacing: other.wordSpacing ?? wordSpacing,
height: other.height ?? height,
leadingDistribution: other.leadingDistribution ?? leadingDistribution,
shadows: other.shadows ?? shadows,
fontFeatures: other.fontFeatures ?? fontFeatures,
fontVariations: other.fontVariations ?? fontVariations,
decoration: other.decoration ?? decoration,
decorationColor: other.decorationColor ?? decorationColor,
decorationStyle: other.decorationStyle ?? decorationStyle,
decorationThickness: other.decorationThickness ?? decorationThickness,
);
}

TextPaint asTextRenderer() {
return TextPaint(
style: TextStyle(
color: color,
fontFamily: fontFamily,
fontSize: fontSize! * (fontScale ?? 1.0),
fontWeight: fontWeight,
fontStyle: fontStyle,
letterSpacing: letterSpacing,
),
style: asTextStyle(),
);
}

TextStyle asTextStyle() {
return TextStyle(
color: color,
fontFamily: fontFamily,
fontSize: fontSize! * (fontScale ?? 1.0),
fontWeight: fontWeight,
fontStyle: fontStyle,
letterSpacing: letterSpacing,
wordSpacing: wordSpacing,
height: height,
leadingDistribution: leadingDistribution,
shadows: shadows,
fontFeatures: fontFeatures,
fontVariations: fontVariations,
decoration: decoration,
decorationColor: decorationColor,
decorationStyle: decorationStyle,
decorationThickness: decorationThickness,
);
}
}
70 changes: 69 additions & 1 deletion packages/flame/test/text/text_paint_test.dart
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import 'dart:ui' show Color;
import 'dart:ui';

import 'package:flame/text.dart';
import 'package:flutter/rendering.dart' as flutter;
Expand All @@ -24,6 +24,26 @@ void main() {
fontWeight: flutter.FontWeight.bold,
color: Color(0xFF00FF00),
letterSpacing: 1.5,
wordSpacing: 2.5,
height: 3.5,
leadingDistribution: TextLeadingDistribution.even,
shadows: [
Shadow(
color: Color(0xFFFF0000),
offset: Offset(1, 1),
blurRadius: 1,
),
],
fontFeatures: [
flutter.FontFeature.alternativeFractions(),
],
fontVariations: [
flutter.FontVariation.slant(0.3),
],
decoration: TextDecoration.lineThrough,
decorationColor: Color(0xFF0000FF),
decorationStyle: TextDecorationStyle.dashed,
decorationThickness: 1.5,
);
final textPaint = TextPaint(style: flutterStyle);

Expand All @@ -33,13 +53,61 @@ void main() {
expect(inlineTextStyle.fontStyle, flutter.FontStyle.italic);
expect(inlineTextStyle.fontWeight, flutter.FontWeight.bold);
expect(inlineTextStyle.color, const Color(0xFF00FF00));
expect(inlineTextStyle.letterSpacing, 1.5);
expect(inlineTextStyle.wordSpacing, 2.5);
expect(inlineTextStyle.height, 3.5);
expect(
inlineTextStyle.leadingDistribution,
TextLeadingDistribution.even,
);
expect(inlineTextStyle.shadows, [
const Shadow(
color: Color(0xFFFF0000),
offset: Offset(1, 1),
blurRadius: 1,
),
]);
expect(inlineTextStyle.fontFeatures, [
const flutter.FontFeature.alternativeFractions(),
]);
expect(inlineTextStyle.fontVariations, [
const FontVariation.slant(0.3),
]);
expect(inlineTextStyle.decoration, TextDecoration.lineThrough);
expect(inlineTextStyle.decorationColor, const Color(0xFF0000FF));
expect(inlineTextStyle.decorationStyle, TextDecorationStyle.dashed);
expect(inlineTextStyle.decorationThickness, 1.5);

final newTextPaint = inlineTextStyle.asTextRenderer();
expect(newTextPaint.style.fontSize, 12);
expect(newTextPaint.style.fontFamily, 'Times');
expect(newTextPaint.style.fontStyle, flutter.FontStyle.italic);
expect(newTextPaint.style.fontWeight, flutter.FontWeight.bold);
expect(newTextPaint.style.color, const Color(0xFF00FF00));
expect(newTextPaint.style.letterSpacing, 1.5);
expect(newTextPaint.style.wordSpacing, 2.5);
expect(newTextPaint.style.height, 3.5);
expect(
newTextPaint.style.leadingDistribution,
TextLeadingDistribution.even,
);
expect(newTextPaint.style.shadows, [
const Shadow(
color: Color(0xFFFF0000),
offset: Offset(1, 1),
blurRadius: 1,
),
]);
expect(newTextPaint.style.fontFeatures, [
const flutter.FontFeature.alternativeFractions(),
]);
expect(newTextPaint.style.fontVariations, [
const FontVariation.slant(0.3),
]);
expect(newTextPaint.style.decoration, TextDecoration.lineThrough);
expect(newTextPaint.style.decorationColor, const Color(0xFF0000FF));
expect(newTextPaint.style.decorationStyle, TextDecorationStyle.dashed);
expect(newTextPaint.style.decorationThickness, 1.5);
},
);
});
Expand Down

0 comments on commit ce9392a

Please sign in to comment.