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

Color is not reacting to Theme changes #256

Closed
Ahmadre opened this issue May 28, 2020 · 5 comments
Closed

Color is not reacting to Theme changes #256

Ahmadre opened this issue May 28, 2020 · 5 comments

Comments

@Ahmadre
Copy link

Ahmadre commented May 28, 2020

Steps to reproduce

  1. Create (or get) a random Flare file with rive.app
  2. Export it as a binary file (.flr)
  3. Import it in Flutter by this snippet (by the way TinyColor is working with other Icons. So TinyColor isn't the problem here):
import 'package:flare_flutter/flare_actor.dart';
import 'package:flutter/material.dart';
import 'package:tinycolor/tinycolor.dart';

IconButton(
  icon: FlareActor(
    'assets/flare/AnimatedMenuButton.flr',
     color: TinyColor(Theme.of(context).scaffoldBackgroundColor).isLight() ? Colors.black : Colors.white,
     animation: 'idle',
     fit: BoxFit.contain,
  ),
  onPressed: toggleMenu,
),

Sidenote: I also tried:

color: Theme.of(context).brightness == Brightness.light ? Colors.black : Colors.white,

but none of them are working. It seeems, that FlareActor is ignoring Theme maybe?

  1. Have the theme and darkTheme setup in MaterialApp. Now ThemeMode will be: ThemeMode.system, which will automatically switch Brightness of the app.
  2. Go to settings (android or ios) and change your theme. It doesn't matter if you switch from dark -> light or from light -> dark.
  3. Now go back into the flutter app. Bam.

Expected results

FlareActor will detect ThemeMode switch and rerender the Color.

Actual results

Here's an example of my custom Menu-Button on the top left of my AppBar:

flare_error

Logs

[✓] Flutter (Channel master, 1.19.0-2.0.pre.145, on Mac OS X 10.15.5 19F96, locale
    de-DE)
 
[✓] Android toolchain - develop for Android devices (Android SDK version 28.0.3)
[✓] Xcode - develop for iOS and macOS (Xcode 11.5)
[✓] Chrome - develop for the web
[✓] Android Studio (version 3.5)
[✓] VS Code (version 1.45.1)
[✓] Connected device (3 available)

Thanks 😊

@Ahmadre
Copy link
Author

Ahmadre commented Jun 7, 2020

I did a workaround by exporting different flare assets with different colors. But then the color property is maybe useless.

@umberto-sonnino
Copy link
Contributor

Is your 'idle' animation looping? If possible, could you share your Rive file url?

@Ahmadre
Copy link
Author

Ahmadre commented Jul 4, 2020

@umberto-sonnino I would like to send you the file on an email address or something, but not on public. Would you write via my github account email?

@Ahmadre
Copy link
Author

Ahmadre commented Oct 14, 2020

Thanks! It works now :)

@alnitak
Copy link

alnitak commented Sep 27, 2021

So, how did you solved this? :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants