Make your app more alive with beautiful animated icons.
Add the dependency to pubspec.yaml or enter the following command into your terminal:
flutter pub add use_widgetsNext I will provide a super simple example of how to use one of the animated icons:
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:use_widgets/use_widgets/use_widgets.dart';
class HomePage extends StatelessWidget {
const HomePage({super.key});
@override
Widget build(BuildContext context) {
return HookBuilder(builder: (context) {
final menuIsOpen = useState(false);
return Scaffold(
backgroundColor: const Color(0xff202020),
appBar: AppBar(
backgroundColor: Colors.black,
leading: InkWell(
onTap: () {
menuIsOpen.value = !menuIsOpen.value;
},
child: MenuV2( // Here we use one of the animated icons
isOpen: menuIsOpen.value,
color: Colors.white,
),
),
),
body: Center(),
),
}),
}
}
The underlying lottie icons are from https://useanimations.com/.
All the free files available in useAnimations are distributed under Creative Commons (CC) Attribution (BY) unless stated otherwise.
The resources (animations) can be used for personal and commercial usage within Web and Mobile Applications.
You may modify the resources according to your requirements and use them in any or all of your personal or commercial projects. For example, you may include this resource on a website or mobile application you will be designing for a client.
You are required to attribute or link to useanimations.com in any of projects.
useAnimations (useanimations.com) will not be responsible for any outcome that may occur during the use of their resources.
Files from useAnimations can be shared as long as the useAnimations are credited appropriately.