Skip to content

Text in Hero glitches during transition #12463

@grabbou

Description

@grabbou

Steps to Reproduce

When animating between two pages that have Hero that wraps Text, the Text component will loose its styling for the in-transition state unless you explicitly provide it with fontFamily, textDecoration and color. Start and end is okay. I believe this could be related to the way we interpolate the style for the default values.

Here's the code that glitches:

var title = new Hero(
      tag: "${category.id}-title",
      child: new Text(
        category.name,
        style: const TextStyle(
          fontSize: 30.0,
        ),
        textAlign: TextAlign.center,
      ),
    );

and here's the one, that is not:

var title = new Hero(
      tag: "${category.id}-title",
      child: new Text(
        category.name,
        style: const TextStyle(
          fontSize: 30.0,
          fontWeight: FontWeight.normal,
          fontFamily: "Roboto",
          color: Colors.black,
          decoration: TextDecoration.none,
        ),
        textAlign: TextAlign.center,
      ),
    );

Note that I have explicitly overwritten properties that were lacking proper values during transition. Is that intentional?

Flutter Doctor

[✓] Flutter (on Mac OS X 10.12.6 16G29, locale en-PL, channel alpha)
    • Flutter at /Users/grabbou/Repositories/flutter
    • Framework revision 701d534ba9 (4 weeks ago), 2017-09-12 14:01:51 -0700
    • Engine revision 31d03de019
    • Tools Dart version 1.25.0-dev.11.0

[✓] Android toolchain - develop for Android devices (Android SDK 25.0.2)
    • Android SDK at /usr/local/Cellar/android-sdk
    • Platform android-25, build-tools 25.0.2
    • ANDROID_HOME = /usr/local/Cellar/android-sdk
    • Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 1.8.0_112-release-b06)

[-] iOS toolchain - develop for iOS devices (Xcode 9.0)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 9.0, Build version 9A235
    ✗ libimobiledevice and ideviceinstaller are not installed or require updating. To update, run:
        brew uninstall --ignore-dependencies libimobiledevice
        brew install --HEAD libimobiledevice
        brew install ideviceinstaller
    ✗ ios-deploy not installed. To install:
        brew install ios-deploy
    • CocoaPods version 1.2.0

[✓] Android Studio
    • Android Studio at /Applications/Android Studio 3.0 Preview.app/Contents
    • Java version OpenJDK Runtime Environment (build 1.8.0_152-release-915-b01)

[✓] Android Studio (version 2.3)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Java version OpenJDK Runtime Environment (build 1.8.0_112-release-b06)

[✓] Connected devices
    • Custom Phone, 6 0 0, API 23, 768x1280 • 192.168.56.101:5555 • android-x86 • Android 6.0 (API 23)

Metadata

Metadata

Assignees

No one assigned

    Labels

    f: material designflutter/packages/flutter/material repository.frameworkflutter/packages/flutter repository. See also f: labels.

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions