Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[flutter] When using the spine_flutter package with Flutter3.27.0, the image quality of spine decreases #2719

Open
yoshimatashn opened this issue Dec 25, 2024 · 1 comment
Assignees
Labels

Comments

@yoshimatashn
Copy link

yoshimatashn commented Dec 25, 2024

spine_flutter ver: 4.2.33
spine file ver: 4.2.38

  • When using Flutter 3.22.2, the image quality deteriorated when the spine_flutter version was greater than 4.2.22.

Steps to reproduce

  1. Use Flutter3.27.0
  2. Use Impeller

Expected results

Display spine without reducing image quality

Actual results

The image quality of the spine decreases

Code sample

AndroidManifest.xml
<meta-data
                android:name="io.flutter.embedding.android.EnableImpeller"
                android:value="false" /> // No change whether you opt out or not
Info.plist
	<key>FLTEnableImpeller</key>
	<false/> // No change whether you opt out or not
Test.dart
class Test extends ConsumerState<***> {
  late String _atlasPath;
  late String _skeletonPath;
  late SpineWidgetController controller;
  bool isInitialized = false;

  @override
  void initState() {
    super.initState();
    controller = SpineWidgetController(onInitialized: (controller) {
      controller.skeleton.setScaleX(***);
      controller.skeleton.setScaleY(***);
      isInitialized = true;
    _atlasPath =
        ".atlas.txt";
    _skeletonPath =
        ".skel";
  }

 @override
  Widget build(BuildContext context) {
    return SpineWidget.fromAsset(_atlasPath, _skeletonPath, controller);
  }

Flutter Doctor output

Doctor output
[✓] Flutter (Channel stable, 3.27.0, on macOS 15.2 24C101 darwin-arm64, locale ja-JP)
    • Flutter version 3.27.0 on channel stable at /Users
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision *** (2 weeks ago), 2024-12-10 14:23:39 -0800
    • Engine revision ***
    • Dart version 3.6.0
    • DevTools version 2.40.2

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at /Users
    • Platform android-34, build-tools 34.0.0
    • Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build ***)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 15.4)
    • Xcode at /Applications/Xcode_15.4.app/Contents/Developer
    • Build 15F31d
    • CocoaPods version 1.16.2

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2022.3)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build ***)

[✓] VS Code (version 1.96.2)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.102.0

[✓] Connected device (5 available)
    • SOG08 (mobile)                 • android-arm64  • Android 14 (API 34)
    • iPhone SE (mobile)             • ios            • iOS 18.1.1
    • macOS (desktop)               • macos                     • darwin-arm64   • macOS 15.2  darwin-arm64
    • Mac Designed for iPad (desktop) • mac-designed-for-ipad     • darwin         • macOS 15.2  darwin-arm64
    • Chrome (web)                    • chrome                    • web-javascript • Google Chrome ***

[✓] Network resources
    • All expected network resources are available.

• No issues found!
@yoshimatashn yoshimatashn changed the title When using the spine_flutter package with Flutter3.27.0, the image quality of spine decreases when Impeller is turned on. When using the spine_flutter package with Flutter3.27.0, the image quality of spine decreases Dec 25, 2024
@davidetan davidetan changed the title When using the spine_flutter package with Flutter3.27.0, the image quality of spine decreases [flutter] When using the spine_flutter package with Flutter3.27.0, the image quality of spine decreases Dec 26, 2024
@badlogic
Copy link
Collaborator

badlogic commented Jan 7, 2025

Please iilustrate the image quality loss with screenshots. You are not experiencing the issue with older Flutter SDK versions?

It looks like with Flutter 3.27.0, they removed the option to render via Skia in iOS:
https://docs.google.com/spreadsheets/d/1AebMvprRkxP-D6ndx920lbvDBbhg-sNNRJ64XY2P2t0/edit?gid=0#gid=0

Apparently, Impeller still does not match rendering of Skia.

I suspect that they are handling texture filtering modes differently in Impeller. Could you please try to set Atlas.filterQuality to FilterQuality.medium or FilterQuality.high?

https://github.com/EsotericSoftware/spine-runtimes/blob/4.2/spine-flutter/lib/spine_flutter.dart#L104
https://api.flutter.dev/flutter/dart-ui/FilterQuality.html

@badlogic badlogic self-assigned this Jan 7, 2025
@badlogic badlogic added the bug label Jan 7, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Development

No branches or pull requests

2 participants