Introduction to flutter packages: This repo will teach you some of the popular packages that are available in pub.dev, & how to use them for fast application development.
Playlist URLs:
YouTube
YouTube: provider
YouTube: image_picker
YouTube: shimmer
YouTube: shared_preferences
YouTube: geolocator
YouTube: url_launcher
YouTube: webview_flutter
YouTube: video_player
YouTube: responsive_framework
YouTube: introduction_screen
YouTube: confetti
YouTube: connectivity_plus
YouTube: flutter_hooks
YouTube: flutter_slidable
YouTube: json_annotation
YouTube: file_picker
YouTube: share_plus
YouTube: cache_network_image
YouTube: flutter_local_notifications
YouTube: pixel_perfect
- Avatar Glow > StatelessWidget
- Google Fonts
- Liquid pull to Refresh > StatelessWidget > LiquidPullToRefresh > ListView
- Percent Indicator
- Carousel Slider > slideTransform: const CubeTransform() > CircularSlideIndicator
- Smooth Page Indicator > SmoothPageIndicator > (controller: _controller,count: 4) > JumpingDotEffect
- Font Awesome Flutter > FaIcon > FontAwesomeIcons.arrowUp
- Animations > Container transform
- Neon > text > color > fontSize > font: NeonFont.Cyberpunk > flickeringText: true
- Aurora > backgroundColor: Colors.black > Aurora > size > color list
- Card Swiper > itemCount > autoplay: true > autoplayDelay > Card
Require a model.dart > BannerImageModel > - Flutter Blurhash > BlurHash > hash (String) > image (from network)
- Flutter SVG > Container > SvgPicture.asset() or SvgPicture.network()
- Flutter Custom Clipper >
- Flutter TTS > StatefulWidget
- Flutter Highlight
- Syncfusion Charts
- Rflutter Alert > ElevatedButton > child > Alert > (context, title, desc).show()
- Settings UI > SettingsList > sections:[] > SettingsSection > SettingsTile
- Flutter Spinkit > SpinKitRotatingCircle(color: Colors.redAccent)
- Audioplayers > AudioCache audioCache > late AudioPlayer player > void playAudio() > void stopAudio()
- Go Router > MaterialApp.router > routeInformationParser: _router.routeInformationParser > routerDelegate: _router.routerDelegate
- HTTP > watch this YouTube video
- Onboarding > onboardingPagesList > PageModel > widget > Column > Container >
- Flutter Neumorphic > Github
- Math Expressions > Input type is string
- Clay Containers > ClayContainer > color > height >width
- Day Night Switcher > DayNightSwitcher / DayNightSwitcherIcon > dayBackgroundColor > isDarkModeEnabled > onStateChanged
- Provider > MultiProvider > ChangeNotifierProvider > create: (_) => Counter() > child: MyHomePage()
class Counter with ChangeNotifier > notifyListeners(); - Feather Icons > Icon(FeatherIcons.aperture)
- Simple Gradient Text > GradientTex() > colors: const []
- Image Picker > watch the video, or read the documentation for iOS support.
- Convex Bottom Bar > read the code
- Intro Slider > read the code
- Icofont Flutter > Icon() > IcoFontIcons.cab > color: Colors.white > size: 40
- Flutter Staggered Grid View > GridView.custom > gridDelegate > pattern
- Shimmer > watch this video
- Lottie > make an animation controller for controlling the state of the animation
- Shared Preferences > watch this video
- Auto Size Text > AutoSizeText() > minFontSize: 18 > maxLines: 4 > overflow: TextOverflow.ellipsis
- Device Info Plus > deviceInfo() async{} > DeviceInfoPlugin deviceInfo = DeviceInfoPlugin(); > IosDeviceInfo iosInfo = await deviceInfo.iosInfo; > setState((){})
- Geolocator > LocationPermission permission > await Geolocator.requestPermission() > Geolocator.getCurrentPosition()
- Glass Kit > GlassContainer.clearGlass > height > width > child
- URL Launcher > MaterialButton > onPressed: () async > if (await canLaunch(_url)) > else
- Webview Flutter > WebView > javascriptMode: JavascriptMode.unrestricted > initialUrl: 'https://amazon.com' > onWebViewCreated: (controller){}
- Responsive Sizer > ResponsiveSizer( builder: (context, orientation, screenType) { return: Center()}) > height: 20.h > width: 20.w
- Video Player > watch the video
- Responsive Framework > builder: (context, widget) => ResponsiveWrapper.builder() > ResponsiveBreakpoint > ResponsiveRowColumn() > ResponsiveVisibility() > ResponsiveValue()
- Timelines > Timeline.tileBuilder > TimelineTileBuilder.fromStyle
- Just Audio > check the code
- Persistent Bottom Nav Bar > check the code
- Equatable > class User extends Equatable > List< Object?> get props => [name, urlImage];
- Web Scraper > read documentation
- Introduction Screen > next > done > onDone > pages
- Animated Text Kit > read documentation from here
- Horizontal Data Table > read code
- Confetti > bool isPlaying = false > final controller = ConfettiController()
- Chewie > final VideoPlayerController videoPlayerController > final bool looping > late ChewieController _chewieController > Chewie(controller: _chewieController,)
- Get It > GetIt getIt = GetIt.instance > getIt.registerSingleton< AppModel>(AppModelImplementation(), signalsReady: true) > FutureBuilder > future: getIt.allReady()
- Overlay Support > showSimpleNotification() > Text("simple notification") > background: Colors.green
- Connectivity Plus > late StreamSubscription subscription > subscription = Connectivity().onConnectivityChanged.listen((result) {showConnectivitySnackBar(context, result);}
- Flutter Hooks > class MyFlutterHooks extends HookWidget > final usernameController = useTextEditingController() > final passwordController = useTextEditingController()
- Path Provider > Directory tempDir = await getTemporaryDirectory(); > await getApplicationDocumentsDirectory();
- Youtube Player Flutter > late YoutubePlayerController _controller ? YoutubePlayerBuilder() > player: YoutubePlayer(controller: _controller) > builder: (context, player) {}
- Youtube Player Iframe > late YoutubePlayerController _controller > _controller = YoutubePlayerController()
- Flutter Slidable > Read code
- JSON Annotation > '$ flutter packages pub run build_runner build' > Read code
- Dio > Read code
- Gallery Saver > watch this video
- Anim Search Bar > _searchController.addListener(() {}) > Read the code
- File Picker > watch this video
- Share Plus > watch this video
- Infinite Scroll Pagination > read documentation from here
- Marquee > text > scrollAxis > crossAxisAlignment > blankSpace > velocity > pauseAfterRound > startPadding
- Cached Network Image > watch this video
- Flutter Toast > Fluttertoast.showToast() > msg > fontSize > textColor > gravity
- Crypto > bytes = utf8.encode("InputText") > digest = sha1.convert(bytes)
- Bottom Navy Bar > PageController _pageController > PageView() > controller: _pageController > BottomNavyBar() > selectedIndex: _currentIndex
- Slide Countdown > SlideCountdownSeparated() > duration: const Duration(seconds: 10)
- Date Format > formatDate(DateTime.now(), [yyyy, '-', mm, '-', dd]) > formatDate(DateTime.now(), [HH, ':', nn, ':', ss])
- Flutter Rating Bar > initialRating > minRating > itemBuilder: (context, _) => const Icon() > updateOnDrag > onRatingUpdate
- Pin Code Fields > PinCodeTextField() > appContext: context > length: 6 > pinTheme > onCompleted
- UUID > id = uuid.v1(); > id = uuid.v4();
- RxDart > Read the code
- Flutter Local Notifications > watch this video
- Flutter Native Timezone > FlutterNativeTimezone.getLocalTimezone()
- Faker > faker.person.firstName() > faker.person.lastName()
- Day Night Switch > value: themeProvider.isDarkMode > onChanged: (newValue) {}
- Pixel Perfect > assetPath: > child: Scaffold()
- Animated Button > shadowDegree > enabled > onPressed > child
- Toggle Switch > initialLabelIndex: 0 > totalSwitches: 3 > labels: const ['America', 'Canada', 'Mexico'] > onToggle: (index){}
- Route Master > review the code