From 322d5b6abffcdd2f3a7c693da57c74af586ff021 Mon Sep 17 00:00:00 2001 From: LongCat is Looong <31859944+LongCatIsLooong@users.noreply.github.com> Date: Mon, 26 Apr 2021 22:30:47 -0700 Subject: [PATCH 1/3] add TextLeadingDistribution to webui TextStyle --- .../src/engine/canvaskit/canvaskit_api.dart | 2 ++ lib/web_ui/lib/src/engine/canvaskit/text.dart | 34 +++++++++++++++++-- lib/web_ui/lib/src/engine/text/paragraph.dart | 1 - lib/web_ui/lib/src/ui/text.dart | 1 + .../test/canvaskit/canvas_golden_test.dart | 23 +++++++++++++ .../test/canvaskit/canvaskit_api_test.dart | 4 +++ 6 files changed, 62 insertions(+), 3 deletions(-) diff --git a/lib/web_ui/lib/src/engine/canvaskit/canvaskit_api.dart b/lib/web_ui/lib/src/engine/canvaskit/canvaskit_api.dart index b20a2df6a671f..6654cc50db589 100644 --- a/lib/web_ui/lib/src/engine/canvaskit/canvaskit_api.dart +++ b/lib/web_ui/lib/src/engine/canvaskit/canvaskit_api.dart @@ -1661,6 +1661,7 @@ class SkTextStyleProperties { external set letterSpacing(double? value); external set wordSpacing(double? value); external set heightMultiplier(double? value); + external set halfLeading(bool? value); external set locale(String? value); external set fontFamilies(List? value); external set fontStyle(SkFontStyle? value); @@ -1675,6 +1676,7 @@ class SkStrutStyleProperties { external set fontStyle(SkFontStyle? value); external set fontSize(double? value); external set heightMultiplier(double? value); + external set halfLeading(bool? value); external set leading(double? value); external set strutEnabled(bool? value); external set forceStrutHeight(bool? value); diff --git a/lib/web_ui/lib/src/engine/canvaskit/text.dart b/lib/web_ui/lib/src/engine/canvaskit/text.dart index f39eadefa0692..f0551c9869a86 100644 --- a/lib/web_ui/lib/src/engine/canvaskit/text.dart +++ b/lib/web_ui/lib/src/engine/canvaskit/text.dart @@ -37,6 +37,7 @@ class CkParagraphStyle implements ui.ParagraphStyle { _fontFamily = fontFamily, _fontSize = fontSize, _height = height, + _leadingDistribution = textHeightBehavior?.leadingDistribution, _fontWeight = fontWeight, _fontStyle = fontStyle; @@ -47,6 +48,7 @@ class CkParagraphStyle implements ui.ParagraphStyle { final double? _height; final ui.FontWeight? _fontWeight; final ui.FontStyle? _fontStyle; + final ui.TextLeadingDistribution? _leadingDistribution; static SkTextStyleProperties toSkTextStyleProperties( String? fontFamily, @@ -73,7 +75,7 @@ class CkParagraphStyle implements ui.ParagraphStyle { return skTextStyle; } - static SkStrutStyleProperties toSkStrutStyleProperties(ui.StrutStyle value) { + static SkStrutStyleProperties toSkStrutStyleProperties(ui.StrutStyle value, ui.TextHeightBehavior? paragraphHeightBehavior) { EngineStrutStyle style = value as EngineStrutStyle; final SkStrutStyleProperties skStrutStyle = SkStrutStyleProperties(); skStrutStyle.fontFamilies = @@ -87,6 +89,17 @@ class CkParagraphStyle implements ui.ParagraphStyle { skStrutStyle.heightMultiplier = style._height; } + switch (style._leadingDistribution ?? paragraphHeightBehavior?.leadingDistribution) { + case null: + break; + case ui.TextLeadingDistribution.even: + skStrutStyle.halfLeading = true; + break; + case ui.TextLeadingDistribution.proportional: + skStrutStyle.halfLeading = false; + break; + } + if (style._leading != null) { skStrutStyle.leading = style._leading; } @@ -147,7 +160,7 @@ class CkParagraphStyle implements ui.ParagraphStyle { } if (strutStyle != null) { - properties.strutStyle = toSkStrutStyleProperties(strutStyle); + properties.strutStyle = toSkStrutStyleProperties(strutStyle, textHeightBehavior); } properties.textStyle = toSkTextStyleProperties( @@ -161,6 +174,7 @@ class CkParagraphStyle implements ui.ParagraphStyle { fontFamily: _fontFamily, fontSize: _fontSize, height: _height, + leadingDistribution: _leadingDistribution, fontWeight: _fontWeight, fontStyle: _fontStyle, ); @@ -184,6 +198,7 @@ class CkTextStyle implements ui.TextStyle { double? letterSpacing, double? wordSpacing, double? height, + ui.TextLeadingDistribution? leadingDistribution, ui.Locale? locale, CkPaint? background, CkPaint? foreground, @@ -205,6 +220,7 @@ class CkTextStyle implements ui.TextStyle { letterSpacing, wordSpacing, height, + leadingDistribution, locale, background, foreground, @@ -228,6 +244,7 @@ class CkTextStyle implements ui.TextStyle { this.letterSpacing, this.wordSpacing, this.height, + this.leadingDistribution, this.locale, this.background, this.foreground, @@ -249,6 +266,7 @@ class CkTextStyle implements ui.TextStyle { final double? letterSpacing; final double? wordSpacing; final double? height; + final ui.TextLeadingDistribution? leadingDistribution; final ui.Locale? locale; final CkPaint? background; final CkPaint? foreground; @@ -275,6 +293,7 @@ class CkTextStyle implements ui.TextStyle { letterSpacing: other.letterSpacing ?? letterSpacing, wordSpacing: other.wordSpacing ?? wordSpacing, height: other.height ?? height, + leadingDistribution: other.leadingDistribution ?? leadingDistribution, locale: other.locale ?? locale, background: other.background ?? background, foreground: other.foreground ?? foreground, @@ -367,6 +386,17 @@ class CkTextStyle implements ui.TextStyle { properties.heightMultiplier = height; } + switch (leadingDistribution) { + case null: + break; + case ui.TextLeadingDistribution.even: + properties.halfLeading = true; + break; + case ui.TextLeadingDistribution.proportional: + properties.halfLeading = false; + break; + } + if (locale != null) { properties.locale = locale.toLanguageTag(); } diff --git a/lib/web_ui/lib/src/engine/text/paragraph.dart b/lib/web_ui/lib/src/engine/text/paragraph.dart index 7254b7b3bd4bb..d8890573e9794 100644 --- a/lib/web_ui/lib/src/engine/text/paragraph.dart +++ b/lib/web_ui/lib/src/engine/text/paragraph.dart @@ -1210,7 +1210,6 @@ class EngineStrutStyle implements ui.StrutStyle { List? fontFamilyFallback, double? fontSize, double? height, - //TODO(LongCatIsLooong): implement leadingDistribution. ui.TextLeadingDistribution? leadingDistribution, double? leading, ui.FontWeight? fontWeight, diff --git a/lib/web_ui/lib/src/ui/text.dart b/lib/web_ui/lib/src/ui/text.dart index 779b2903cb617..cbf932b1e3b61 100644 --- a/lib/web_ui/lib/src/ui/text.dart +++ b/lib/web_ui/lib/src/ui/text.dart @@ -285,6 +285,7 @@ abstract class TextStyle { letterSpacing: letterSpacing, wordSpacing: wordSpacing, height: height, + leadingDistribution: leadingDistribution, locale: locale, background: background as engine.CkPaint?, foreground: foreground as engine.CkPaint?, diff --git a/lib/web_ui/test/canvaskit/canvas_golden_test.dart b/lib/web_ui/test/canvaskit/canvas_golden_test.dart index 61af79826de4c..ff6035ca6520a 100644 --- a/lib/web_ui/test/canvaskit/canvas_golden_test.dart +++ b/lib/web_ui/test/canvaskit/canvas_golden_test.dart @@ -357,6 +357,27 @@ void testMain() { await testTextStyle('height', height: 2); }); + test('text styles - leading distribution', () async { + await testTextStyle('half leading', height: 20, fontSize: 10, leadingDistribution: ui.TextLeadingDistribution.even); + await testTextStyle( + 'half leading inherited from paragraph', + height: 20, + fontSize: 10, + paragraphTextHeightBehavior: ui.TextHeightBehavior( + leadingDistribution: ui.TextLeadingDistribution.even, + ), + ); + await testTextStyle( + 'half leading', + height: 20, + fontSize: 10, + leadingDistribution: ui.TextLeadingDistribution.proportional, + paragraphTextHeightBehavior: ui.TextHeightBehavior( + leadingDistribution: ui.TextLeadingDistribution.even, + ), + ); + }); + // TODO(yjbanov): locales specified in text styles don't work: // https://github.com/flutter/flutter/issues/74687 // TODO(yjbanov): spaces are not rendered correctly: @@ -1118,6 +1139,7 @@ Future testTextStyle( double? letterSpacing, double? wordSpacing, double? height, + ui.TextLeadingDistribution? leadingDistribution, ui.Locale? locale, CkPaint? background, CkPaint? foreground, @@ -1169,6 +1191,7 @@ Future testTextStyle( letterSpacing: letterSpacing, wordSpacing: wordSpacing, height: height, + leadingDistribution: leadingDistribution, locale: locale, background: background, foreground: foreground, diff --git a/lib/web_ui/test/canvaskit/canvaskit_api_test.dart b/lib/web_ui/test/canvaskit/canvaskit_api_test.dart index 8b16d86da26e0..ef568fa05891a 100644 --- a/lib/web_ui/test/canvaskit/canvaskit_api_test.dart +++ b/lib/web_ui/test/canvaskit/canvaskit_api_test.dart @@ -1289,6 +1289,7 @@ void _paragraphTests() { ..letterSpacing = 5 ..wordSpacing = 10 ..heightMultiplier = 2.5 + ..halfLeading = true ..locale = 'en_CA' ..fontFamilies = ['Roboto', 'serif'] ..fontStyle = (SkFontStyle() @@ -1310,6 +1311,7 @@ void _paragraphTests() { ..weight = canvasKit.FontWeight.Bold) ..fontSize = 23 ..heightMultiplier = 5 + ..halfLeading = true ..leading = 6 ..strutEnabled = true ..forceStrutHeight = false; @@ -1338,6 +1340,8 @@ void _paragraphTests() { SkPaint()); builder.addText('!'); builder.pop(); + builder.pushStyle(canvasKit.TextStyle(SkTextStyleProperties()..halfLeading = true)); + builder.pop(); final SkParagraph paragraph = builder.build(); paragraph.layout(55); expect(paragraph.getAlphabeticBaseline(), From 5b8818f9eb349af6d52b57fb19206b09141b14fc Mon Sep 17 00:00:00 2001 From: LongCat is Looong <31859944+LongCatIsLooong@users.noreply.github.com> Date: Wed, 28 Apr 2021 12:58:24 -0700 Subject: [PATCH 2/3] review --- lib/web_ui/lib/src/engine/canvaskit/text.dart | 3 ++- lib/web_ui/test/canvaskit/canvas_golden_test.dart | 2 +- 2 files changed, 3 insertions(+), 2 deletions(-) diff --git a/lib/web_ui/lib/src/engine/canvaskit/text.dart b/lib/web_ui/lib/src/engine/canvaskit/text.dart index f0551c9869a86..26d3b61d4d114 100644 --- a/lib/web_ui/lib/src/engine/canvaskit/text.dart +++ b/lib/web_ui/lib/src/engine/canvaskit/text.dart @@ -89,7 +89,8 @@ class CkParagraphStyle implements ui.ParagraphStyle { skStrutStyle.heightMultiplier = style._height; } - switch (style._leadingDistribution ?? paragraphHeightBehavior?.leadingDistribution) { + final ui.TextLeadingDistribution? effectiveLeadingDistribution = style._leadingDistribution ?? paragraphHeightBehavior?.leadingDistribution; + switch (effectiveLeadingDistribution) { case null: break; case ui.TextLeadingDistribution.even: diff --git a/lib/web_ui/test/canvaskit/canvas_golden_test.dart b/lib/web_ui/test/canvaskit/canvas_golden_test.dart index ff6035ca6520a..8e97aee6ae72a 100644 --- a/lib/web_ui/test/canvaskit/canvas_golden_test.dart +++ b/lib/web_ui/test/canvaskit/canvas_golden_test.dart @@ -368,7 +368,7 @@ void testMain() { ), ); await testTextStyle( - 'half leading', + 'half leading overrides paragraph style half leading', height: 20, fontSize: 10, leadingDistribution: ui.TextLeadingDistribution.proportional, From b7945869be72b57efcbd793243e1345058708b99 Mon Sep 17 00:00:00 2001 From: LongCat is Looong <31859944+LongCatIsLooong@users.noreply.github.com> Date: Thu, 6 May 2021 13:16:38 -0700 Subject: [PATCH 3/3] update goldens hash --- lib/web_ui/dev/goldens_lock.yaml | 2 +- lib/web_ui/test/canvaskit/canvas_golden_test.dart | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/lib/web_ui/dev/goldens_lock.yaml b/lib/web_ui/dev/goldens_lock.yaml index 42792bdf12073..515175910a354 100644 --- a/lib/web_ui/dev/goldens_lock.yaml +++ b/lib/web_ui/dev/goldens_lock.yaml @@ -1,2 +1,2 @@ repository: https://github.com/flutter/goldens.git -revision: 4a8da9f65353bda26a73e12838797f20cfdedc40 +revision: 4d00d1a0f1c0bc123814919a45ef2c2f57ed21ec diff --git a/lib/web_ui/test/canvaskit/canvas_golden_test.dart b/lib/web_ui/test/canvaskit/canvas_golden_test.dart index 8e97aee6ae72a..f60863100a3de 100644 --- a/lib/web_ui/test/canvaskit/canvas_golden_test.dart +++ b/lib/web_ui/test/canvaskit/canvas_golden_test.dart @@ -368,7 +368,7 @@ void testMain() { ), ); await testTextStyle( - 'half leading overrides paragraph style half leading', + 'text style half leading overrides paragraph style half leading', height: 20, fontSize: 10, leadingDistribution: ui.TextLeadingDistribution.proportional,