Closed addaedans closed 4 years ago
You can take a look here at Flare-Flutter caching strategies: https://github.com/2d-inc/Flare-Flutter/blob/sync_load/loading_strategies.md
If you can provide a better example with files and code I can make probably give you a better suggestion..!
We just recently introduced a FlareCacheBuilder which can help you preload flr files for certain sections of your app!
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.grey,
appBar: AppBar(title: Text(widget.title)),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
mainAxisSize: MainAxisSize.min,
children: [
Expanded(
child: FlareCacheBuilder(
["assets/Filip.flr"],
builder: (BuildContext context, bool isWarm) {
return !isWarm
? Container(child: Text("Loading..."))
: FlareActor(
"assets/Filip.flr",
alignment: Alignment.center,
fit: BoxFit.contain,
animation: _animationName,
);
},
),
)
],
),
),
);
}
Perfect. Thank you very much for this!
Luigi Rosso notifications@github.com ezt írta (időpont: 2019. nov. 7., Cs, 2:56):
We just recently introduced a FlareCacheBuilder https://github.com/2d-inc/Flare-Flutter/blob/stable/flare_flutter/lib/flare_cache_builder.dart which can help you preload flr files for certain sections of your app!
Widget build(BuildContext context) { return Scaffold( backgroundColor: Colors.grey, appBar: AppBar(title: Text(widget.title)), body: Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, mainAxisSize: MainAxisSize.min, children: [ Expanded( child: FlareCacheBuilder( ["assets/Filip.flr"], builder: (BuildContext context, bool isWarm) { return !isWarm ? Container(child: Text("Loading...")) : FlareActor( "assets/Filip.flr", alignment: Alignment.center, fit: BoxFit.contain, animation: _animationName, ); }, ), ) ], ), ), ); }
— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/2d-inc/Flare-Flutter/issues/180?email_source=notifications&email_token=AGKX7SMJXKFPKST46BGTG5TQSNYWFA5CNFSM4JFCNIKKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEDIUAGY#issuecomment-550584347, or unsubscribe https://github.com/notifications/unsubscribe-auth/AGKX7SNGL4PFN2IR7CONBIDQSNYWFANCNFSM4JFCNIKA .
Np! I'm closing the issue, for now, feel free to re-open if you run into any issues with this!
How to cache the same animation globally?
@luigi-rosso i have try your example but i get error
The element type 'String' can't be assigned to the list type 'AssetProvider'.
FlareCacheBuilder( ["assets/images/justplay.flr"], builder: (BuildContext context, bool isWarm) {return FlatButton( onPressed: () => voices .textAreaControl .text .length > 2 ? listinOnPlay() : null, padding: EdgeInsets.all(0), child: FlareActor( 'assets/images/justplay.flr', fit: BoxFit.contain, animation: "Play", color: const Color( 0xff1f93a6), ), );} ),
@addaedans can you provide me example of what you did
@luigi-rosso i have try your example but i get error
The element type 'String' can't be assigned to the list type 'AssetProvider'.
FlareCacheBuilder( ["assets/images/justplay.flr"], builder: (BuildContext context, bool isWarm) {return FlatButton( onPressed: () => voices .textAreaControl .text .length > 2 ? listinOnPlay() : null, padding: EdgeInsets.all(0), child: FlareActor( 'assets/images/justplay.flr', fit: BoxFit.contain, animation: "Play", color: const Color( 0xff1f93a6), ), );} ),
You are trying to cache animations old way — it's not working anymore since v2.0.1, here is proper way how to make it: https://github.com/2d-inc/Flare-Flutter/issues/224#issuecomment-576169853
Loading Strategies are not yet updated, there is open PR to fix it https://github.com/2d-inc/Flare-Flutter/pull/240
Hello. By any chance there's way to pre cache bulk globally? Thanks.
Hello. By any chance there's way to pre cache bulk globally? Thanks.
You can warm up the cache globally in the main() function:
Future<void> preCache() async {
await cachedActor(
AssetFlare(bundle: rootBundle, name: 'assets/file_1.flr'),
);
await cachedActor(
AssetFlare(bundle: rootBundle, name: 'assets/file_2.flr'),
);
await cachedActor(
AssetFlare(bundle: rootBundle, name: 'assets/file_n.flr'),
);
...
}
void main() async {
WidgetsFlutterBinding.ensureInitialized();
FlareCache.doesPrune = false;
preCache.then((_) {
runApp(MyApp());
});
}
However, this adds an additional 3 or more seconds to your app startup time.
You can warm up the cache globally in the main() function:
I've used your way and found out that with many files needed to be pre-cached, it takes really long time and I tried finding a way to speed it up, and I found one! It's a very small modification to your code but that cuts time twice in production. For my test, I have 5 .flr
files that I needed to preload. If I 'chained' await
functions, it took 10 seconds to preload all of them. In a release, it took 0.24 seconds (yes, a quarter). With my way, it took 8 seconds in debugging and 0.11 seconds in release (tested multiple times). In fact, without any 'warming up', it took 4 seconds in debugging and not noticeable in a release. Here is the updated suggestion:
Future<void> preCache() async {
final futures = List<Future>();
futures.add(cachedActor(
AssetFlare(bundle: rootBundle, name: 'assets/file_1.flr'),
));
futures.add(cachedActor(
AssetFlare(bundle: rootBundle, name: 'assets/file_2.flr'),
));
futures.add(cachedActor(
AssetFlare(bundle: rootBundle, name: 'assets/file_n.flr'),
));
try {
await Future.wait(futures);
} catch (e) {
print(e);
}
...
}
I have a program that dinamically changes the icons/animations in Cards, but at the first time the Flare animations starts with around 1 sec delay. The Icons appear immediatly. Can I preload/cache the animation before building a widget somehow?