Skip to content

Commit b2b66b0

Browse files
Merge pull request #350 from StacDev/mn/stac-text-style-changes
BugFixes for Stac DSL
2 parents e7eabc4 + 835ac0a commit b2b66b0

File tree

25 files changed

+932
-265
lines changed

25 files changed

+932
-265
lines changed

examples/movie_app/assets/jsons/screens/onboarding_screen.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@
2222
"height": 500,
2323
"decoration": {
2424
"gradient": {
25+
"gradientType": "linear",
2526
"colors": [
2627
"#00050608",
2728
"#050608",
@@ -55,7 +56,7 @@
5556
"style": "displayMedium",
5657
"children": [
5758
{
58-
"data": "\nDatabase",
59+
"text": "\nDatabase",
5960
"style": {
6061
"color": "primary"
6162
}

examples/movie_app/lib/main.dart

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -98,14 +98,14 @@ final Map<String, dynamic> darkThemeJson = {
9898
"minimumSize": {"width": 120, "height": 40},
9999
"textStyle": {"fontSize": 16, "fontWeight": "w500", "height": 1.3},
100100
"padding": {"left": 10, "right": 10, "top": 8, "bottom": 8},
101-
"shape": {"borderRadius": 8},
101+
"shape": {"type": "roundedRectangleBorder", "borderRadius": 8},
102102
},
103103
"outlinedButtonTheme": {
104104
"minimumSize": {"width": 120, "height": 40},
105105
"textStyle": {"fontSize": 16, "fontWeight": "w500", "height": 1.3},
106106
"padding": {"left": 10, "right": 10, "top": 8, "bottom": 8},
107107
"side": {"color": "#95E183", "width": 1.0},
108-
"shape": {"borderRadius": 8},
108+
"shape": {"type": "roundedRectangleBorder", "borderRadius": 8},
109109
},
110110
"dividerTheme": {"color": "#24FFFFFF", "thickness": 1},
111111
};

packages/stac/lib/src/parsers/painting/stac_text_style_parser.dart

Lines changed: 61 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -4,28 +4,67 @@ import 'package:stac/src/utils/color_utils.dart';
44
import 'package:stac_core/stac_core.dart';
55

66
extension StacTextStyleParser on StacTextStyle {
7-
TextStyle parse(BuildContext context) {
8-
return TextStyle(
9-
inherit: inherit ?? true,
10-
color: color?.toColor(context),
11-
backgroundColor: backgroundColor.toColor(context),
12-
fontSize: fontSize,
13-
fontWeight: fontWeight?.parse,
14-
fontStyle: fontStyle?.parse,
15-
letterSpacing: letterSpacing,
16-
wordSpacing: wordSpacing,
17-
textBaseline: textBaseline?.parse,
18-
height: height,
19-
leadingDistribution: leadingDistribution?.parse,
20-
decorationColor: decorationColor?.toColor(context),
21-
decorationStyle: decorationStyle?.parse,
22-
decorationThickness: decorationThickness,
23-
debugLabel: debugLabel,
24-
fontFamily: fontFamily,
25-
fontFamilyFallback: fontFamilyFallback,
26-
package: package,
27-
overflow: overflow?.parse,
28-
);
7+
TextStyle? parse(BuildContext context) {
8+
switch (type) {
9+
case StacTextStyleType.theme:
10+
final themeStyle = (this as StacThemeTextStyle).textTheme;
11+
final textTheme = Theme.of(context).textTheme;
12+
switch (themeStyle) {
13+
case StacMaterialTextStyle.displayLarge:
14+
return textTheme.displayLarge;
15+
case StacMaterialTextStyle.displayMedium:
16+
return textTheme.displayMedium;
17+
case StacMaterialTextStyle.displaySmall:
18+
return textTheme.displaySmall;
19+
case StacMaterialTextStyle.headlineLarge:
20+
return textTheme.headlineLarge;
21+
case StacMaterialTextStyle.headlineMedium:
22+
return textTheme.headlineMedium;
23+
case StacMaterialTextStyle.headlineSmall:
24+
return textTheme.headlineSmall;
25+
case StacMaterialTextStyle.titleLarge:
26+
return textTheme.titleLarge;
27+
case StacMaterialTextStyle.titleMedium:
28+
return textTheme.titleMedium;
29+
case StacMaterialTextStyle.titleSmall:
30+
return textTheme.titleSmall;
31+
case StacMaterialTextStyle.bodyLarge:
32+
return textTheme.bodyLarge;
33+
case StacMaterialTextStyle.bodyMedium:
34+
return textTheme.bodyMedium;
35+
case StacMaterialTextStyle.bodySmall:
36+
return textTheme.bodySmall;
37+
case StacMaterialTextStyle.labelLarge:
38+
return textTheme.labelLarge;
39+
case StacMaterialTextStyle.labelMedium:
40+
return textTheme.labelMedium;
41+
case StacMaterialTextStyle.labelSmall:
42+
return textTheme.labelSmall;
43+
}
44+
case StacTextStyleType.custom:
45+
final style = this as StacCustomTextStyle;
46+
return TextStyle(
47+
inherit: style.inherit ?? true,
48+
color: style.color?.toColor(context),
49+
backgroundColor: style.backgroundColor?.toColor(context),
50+
fontSize: style.fontSize,
51+
fontWeight: style.fontWeight?.parse,
52+
fontStyle: style.fontStyle?.parse,
53+
letterSpacing: style.letterSpacing,
54+
wordSpacing: style.wordSpacing,
55+
textBaseline: style.textBaseline?.parse,
56+
height: style.height,
57+
leadingDistribution: style.leadingDistribution?.parse,
58+
decorationColor: style.decorationColor?.toColor(context),
59+
decorationStyle: style.decorationStyle?.parse,
60+
decorationThickness: style.decorationThickness,
61+
debugLabel: style.debugLabel,
62+
fontFamily: style.fontFamily,
63+
fontFamilyFallback: style.fontFamilyFallback,
64+
package: style.package,
65+
overflow: style.overflow?.parse,
66+
);
67+
}
2968
}
3069
}
3170

packages/stac/lib/src/parsers/widgets/stac_text/stac_text_parser.dart

Lines changed: 41 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,9 @@ import 'package:stac/src/framework/framework.dart';
44
import 'package:stac/src/parsers/painting/stac_text_style_parser.dart';
55
import 'package:stac/src/parsers/types/type_parser.dart';
66
import 'package:stac/src/utils/color_utils.dart';
7-
import 'package:stac_core/stac_core.dart';
7+
import 'package:stac_core/foundation/specifications/widget_type.dart';
8+
import 'package:stac_core/foundation/text/stac_text_style/stac_text_style.dart';
9+
import 'package:stac_core/widgets/text/stac_text.dart';
810
import 'package:stac_framework/stac_framework.dart';
911

1012
class StacTextParser extends StacParser<StacText> {
@@ -20,7 +22,7 @@ class StacTextParser extends StacParser<StacText> {
2022
Widget parse(BuildContext context, StacText model) {
2123
return Text.rich(
2224
_buildTextSpan(context, model),
23-
style: model.style?.parse(context),
25+
style: _resolveStyle(context, model.style, model.copyWithStyle),
2426
textAlign: model.textAlign?.parse,
2527
textDirection: model.textDirection?.parse,
2628
softWrap: model.softWrap,
@@ -36,12 +38,13 @@ class StacTextParser extends StacParser<StacText> {
3638
}
3739

3840
TextSpan _buildTextSpan(BuildContext context, StacText model) {
41+
var children = model.children ?? [];
3942
return TextSpan(
4043
text: model.data,
41-
children: model.children.map((child) {
44+
children: children.map((child) {
4245
return TextSpan(
4346
text: child.text,
44-
style: model.style?.parse(context),
47+
style: child.style?.parse(context),
4548
recognizer: child.onTap != null
4649
? (TapGestureRecognizer()
4750
..onTap = () => Stac.onCallFromJson(child.onTap, context))
@@ -50,4 +53,38 @@ class StacTextParser extends StacParser<StacText> {
5053
}).toList(),
5154
);
5255
}
56+
57+
TextStyle? _resolveStyle(
58+
BuildContext context,
59+
StacTextStyle? base,
60+
StacCustomTextStyle? override,
61+
) {
62+
final baseStyle = base?.parse(context);
63+
if (override == null) return baseStyle;
64+
65+
final overrideParsed = override.parse(context);
66+
if (overrideParsed == null) return baseStyle;
67+
if (baseStyle == null) return null;
68+
69+
return baseStyle.copyWith(
70+
inherit: override.inherit,
71+
color: overrideParsed.color,
72+
backgroundColor: overrideParsed.backgroundColor,
73+
fontSize: overrideParsed.fontSize,
74+
fontWeight: overrideParsed.fontWeight,
75+
fontStyle: overrideParsed.fontStyle,
76+
letterSpacing: overrideParsed.letterSpacing,
77+
wordSpacing: overrideParsed.wordSpacing,
78+
textBaseline: overrideParsed.textBaseline,
79+
height: overrideParsed.height,
80+
leadingDistribution: overrideParsed.leadingDistribution,
81+
decorationColor: overrideParsed.decorationColor,
82+
decorationStyle: overrideParsed.decorationStyle,
83+
decorationThickness: overrideParsed.decorationThickness,
84+
debugLabel: overrideParsed.debugLabel,
85+
fontFamily: overrideParsed.fontFamily,
86+
fontFamilyFallback: overrideParsed.fontFamilyFallback,
87+
overflow: overrideParsed.overflow,
88+
);
89+
}
5390
}

packages/stac_core/lib/foundation/decoration/stac_input_decoration/stac_input_decoration.g.dart

Lines changed: 6 additions & 6 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

packages/stac_core/lib/foundation/effects/stac_gradient/stac_gradient.dart

Lines changed: 129 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -40,8 +40,7 @@ enum StacTileMode {
4040
/// {@tool snippet}
4141
/// Dart Example:
4242
/// ```dart
43-
/// const StacGradient(
44-
/// gradientType: StacGradientType.linear,
43+
/// StacLinearGradient(
4544
/// colors: [StacColors.blue, StacColors.red],
4645
/// stops: [0.0, 1.0],
4746
/// begin: StacAlignment.topLeft,
@@ -80,6 +79,82 @@ class StacGradient {
8079
this.endAngle,
8180
});
8281

82+
/// Creates a linear gradient.
83+
///
84+
/// Example:
85+
/// ```dart
86+
/// StacLinearGradient(
87+
/// colors: [StacColors.blue, StacColors.red],
88+
/// begin: StacAlignment.topLeft,
89+
/// end: StacAlignment.bottomRight,
90+
/// stops: [0.0, 1.0],
91+
/// )
92+
/// ```
93+
const StacGradient.linear({
94+
required this.colors,
95+
this.stops,
96+
this.begin,
97+
this.end,
98+
this.tileMode,
99+
}) : gradientType = StacGradientType.linear,
100+
center = null,
101+
focal = null,
102+
focalRadius = null,
103+
radius = null,
104+
startAngle = null,
105+
endAngle = null;
106+
107+
/// Creates a radial gradient.
108+
///
109+
/// Example:
110+
/// ```dart
111+
/// StacRadialGradient(
112+
/// colors: [StacColors.blue, StacColors.red],
113+
/// center: StacAlignment.center,
114+
/// radius: 0.5,
115+
/// stops: [0.0, 1.0],
116+
/// )
117+
/// ```
118+
const StacGradient.radial({
119+
required this.colors,
120+
this.stops,
121+
this.center,
122+
this.focal,
123+
this.focalRadius,
124+
this.radius,
125+
this.tileMode,
126+
}) : gradientType = StacGradientType.radial,
127+
begin = null,
128+
end = null,
129+
startAngle = null,
130+
endAngle = null;
131+
132+
/// Creates a sweep gradient.
133+
///
134+
/// Example:
135+
/// ```dart
136+
/// StacSweepGradient(
137+
/// colors: [StacColors.blue, StacColors.red],
138+
/// center: StacAlignment.center,
139+
/// startAngle: 0.0,
140+
/// endAngle: 3.14159,
141+
/// stops: [0.0, 1.0],
142+
/// )
143+
/// ```
144+
const StacGradient.sweep({
145+
required this.colors,
146+
this.stops,
147+
this.center,
148+
this.startAngle,
149+
this.endAngle,
150+
this.tileMode,
151+
}) : gradientType = StacGradientType.sweep,
152+
begin = null,
153+
end = null,
154+
focal = null,
155+
focalRadius = null,
156+
radius = null;
157+
83158
/// The type of gradient (linear, radial, or sweep).
84159
final StacGradientType? gradientType;
85160

@@ -123,3 +198,55 @@ class StacGradient {
123198
/// Converts this [StacGradient] instance to a JSON map.
124199
Map<String, dynamic> toJson() => _$StacGradientToJson(this);
125200
}
201+
202+
/// A linear gradient that transitions colors along a straight line.
203+
///
204+
/// This is a convenience constructor for [StacGradient.linear] for a more Flutter-like API.
205+
/// Colors transition from [begin] to [end] alignment points.
206+
///
207+
/// Example:
208+
/// ```dart
209+
/// StacLinearGradient(
210+
/// colors: [StacColors.blue, StacColors.red],
211+
/// begin: StacAlignment.topLeft,
212+
/// end: StacAlignment.bottomRight,
213+
/// stops: [0.0, 1.0],
214+
/// )
215+
/// ```
216+
// ignore: constant_identifier_names
217+
const StacLinearGradient = StacGradient.linear;
218+
219+
/// A radial gradient that transitions colors in a circular pattern from center outward.
220+
///
221+
/// This is a convenience constructor for [StacGradient.radial] for a more Flutter-like API.
222+
/// Colors transition from the center point outward in a circular pattern.
223+
///
224+
/// Example:
225+
/// ```dart
226+
/// StacRadialGradient(
227+
/// colors: [StacColors.blue, StacColors.red],
228+
/// center: StacAlignment.center,
229+
/// radius: 0.5,
230+
/// stops: [0.0, 1.0],
231+
/// )
232+
/// ```
233+
// ignore: constant_identifier_names
234+
const StacRadialGradient = StacGradient.radial;
235+
236+
/// A sweep gradient that transitions colors in a circular sweep around a center point.
237+
///
238+
/// This is a convenience constructor for [StacGradient.sweep] for a more Flutter-like API.
239+
/// Colors transition in a circular sweep around the center point.
240+
///
241+
/// Example:
242+
/// ```dart
243+
/// StacSweepGradient(
244+
/// colors: [StacColors.blue, StacColors.red],
245+
/// center: StacAlignment.center,
246+
/// startAngle: 0.0,
247+
/// endAngle: 3.14159,
248+
/// stops: [0.0, 1.0],
249+
/// )
250+
/// ```
251+
// ignore: constant_identifier_names
252+
const StacSweepGradient = StacGradient.sweep;

packages/stac_core/lib/foundation/text/stac_text_span/stac_text_span.g.dart

Lines changed: 1 addition & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)