Code

Discussion on FlutKit - Flutter & Figma UI Kit

Discussion on FlutKit - Flutter & Figma UI Kit

Cart 1,907 sales
Recently Updated

205 comments found.

Hello, is there any functionnalities for the full apps or do I have to implement it by myself? Thank you

Hi davarbla,

This is only a UI Kit. But in this kit Firebase authentication, Google sign-in, Admob, and more integrations available which can you use in your full app.

Thanks for your interest.

Thanks for your quick response, I made the changes:

InkWell(
     onTap: () {
       showGeneralDialog(
           context: context,
           barrierDismissible: true,
           barrierLabel:
               MaterialLocalizations.of(context)
                   .modalBarrierDismissLabel,
           barrierColor: Colors.black45,
           transitionDuration:
               const Duration(milliseconds: 200),
           pageBuilder: (BuildContext buildContext,
               Animation animation,
               Animation secondaryAnimation) {
             return NotificationDialog();
           });
     },
     child: Stack(
       clipBehavior: Clip.none,
       children: <Widget>[
         Icon(
           MdiIcons.bellOutline,
           color: themeData
               .colorScheme.onBackground
               .withAlpha(200),
         ),
         Positioned(
           right: -2,
           top: -2,
           child: Container(
             padding: EdgeInsets.all(0),
             height: MySize.size14,
             width: MySize.size14,
             decoration: BoxDecoration(
                 color:
                     themeData.colorScheme.primary,
                 borderRadius: BorderRadius.all(
                     Radius.circular(
                         MySize.size40))),
             child: Center(
               child: Text(
                 "2",
                 style: AppTheme.getTextStyle(
                   themeData.textTheme.overline,
                   color: themeData
                       .colorScheme.onPrimary,
                   fontSize: 9,
                   fontWeight: 500,
                 ),
               ),
             ),
           ),
         )
       ],
     ),
   )

But in the iPhone 12 Pro Max (iOS 14.3) emulator still doesn’t display the Notification Dialog (Previously erase it all the content and settings of the device). Android Pixel 2 (API 30) emulator works fine.

Hi, marzario,

This is a bug from Flutter SDK for this full-screen dialog in iOS.

Please stay tuned with a new stable update from a flutter SDK and we will try to remove it.

Thanks for purchasing.

Got it, I didn’t find an open issue on GitHub about it, do I have to open a new one? Thanks for your support

Hi marzario,

Change the onTap function in this file to the following to get the expected result in iOS:

onTap: () { Navigator.push(context, MaterialPageRoute(builder: (context) => NotificationDialog()));}

instead of onTap : (){ ..... }

We will try to make it better with upcoming updates.

Thanks for purchasing.

Purchased it, I can run it on android and iOS emulators. I’m testing it right now and found that in the food app (on iOS) on the home screen (FoodHomeScreen.dar) it doesn’t do anything when I touch the bell icon in order to see the notifications (Android works fine)

InkWell(
       onTap: () {
         Navigator.of(context)
             .push(new MaterialPageRoute<Null>(
                 builder: (BuildContext context) {
                   return NotificationDialog();
                 },
                 fullscreenDialog: true));
       },
       child: Stack(
         // overflow: Overflow.visible,
         clipBehavior: Clip.none,
         children: <Widget>[
           Icon(
             MdiIcons.bellOutline,
             color: themeData
                 .colorScheme.onBackground
                 .withAlpha(200),
           ),
           Positioned(
             right: -2,
             top: -2,
             child: Container(
               padding: EdgeInsets.all(0),
               height: MySize.size14,
               width: MySize.size14,
               decoration: BoxDecoration(
                   color:
                       themeData.colorScheme.primary,
                   borderRadius: BorderRadius.all(
                       Radius.circular(
                           MySize.size40))),
               child: Center(
                 child: Text(
                   "2",
                   style: AppTheme.getTextStyle(
                     themeData.textTheme.overline,
                     color: themeData
                         .colorScheme.onPrimary,
                     fontSize: 9,
                     fontWeight: 500,
                   ),
                 ),
               ),
             ),
           )
         ],
       ),
     )

Still don’t test it on an iOS device

Hi, marzario,

Change the onTap function in this file to following:

showGeneralDialog( context: context, barrierDismissible: true, barrierLabel: MaterialLocalizations.of(context) .modalBarrierDismissLabel, barrierColor: Colors.black45, transitionDuration: const Duration(milliseconds: 200), pageBuilder: (BuildContext buildContext, Animation animation, Animation secondaryAnimation) { return NotificationDialog(); });

instead of

Navigator.of(context) .push(new MaterialPageRoute<Null>( builder: (BuildContext context) { return NotificationDialog(); }, fullscreenDialog: true));

Thanks for purchasing.

do you provide the Figma file for this project? and do you have documentation for every available components for this project?

Hi mvthm,

Sorry, the design assets are not available at the moment and there is one documentation for full project.

Thanks for purchasing.

Impossible download Demo. Can you check it. I can’t download and test. Which flutter version used in app?

Hello Arzdan,

You can download apk from here : https://www.dropbox.com/s/u5fxf47yld2y74h/FlutKit_v4.2.0.apk?dl=0 We using flutter : ^1.20 version.

Thanks.

Purchased it, I can run it on android emulator (out of the box) but not iOS. iOS throws the following error: FlutKit_v4.1/FlutKit/ios/Runner/AppDelegate.swift:12:5: error: cannot find ‘GMSServices’ in scope and The iOS Simulator deployment target ‘IPHONEOS_DEPLOYMENT_TARGET’ is set to 8.0, but the range of supported deployment target versions is 9.0 to 14.1.99.

Hi VaMoose,

1) – Set MinimumOSVersion to 9.0 in ’./ios/Flutter/AppFrameworkInfo.plist’ – Ensure that you uncomment platform :ios, ‘9.0’ in ’./ios/Podfile’ – Ensure that ios/Podfile contains the following post-install script as https://stackoverflow.com/a/64075795/13152213 – Then run “flutter clean” and re-run the application.

2) Please add this import statement “import GoogleMaps” in the ./Runner/AppDelegate.swift’ file.

Thanks for purchasing.

Hi, I want to use this UI kit for one of my Codecanyon product’s app version. Do you allow that?

Hi codearistos,

Thank you for your interest. You will need to buy an extended license.

Will I have future updates when I buy this version?

Hi Muhamed_Samy,

Yes, you can.

Thanks

When will be released a new version ?

Hi,

It would take few more days. I am planning next update at the moment and will start working on it soon.

Thank you.

Love to see UI State Management added to this with Firebase Firestore as backend

Hi AathifMahir,

Thank you for your suggestion, I will try to include this app in next release.

Thanks for purchasing.

Hi! I would like to separate the Music App from the rest of the code. I would like to have it in a separate project with only assets and code that only the music app needs. Could you please provide directions / help. I am quite new on flutter – still studying it. Thanks.

Hi Panic77,

1. Copy the music package into your project. 2. Copy all assets related to music into your project. 3. Add dependencies and import all assets in pubspec.yaml file. 4. Change the main function available in the main.dart file to following:

void main() { WidgetsFlutterBinding.ensureInitialized(); SystemChrome.setPreferredOrientations([DeviceOrientation.portraitUp]) .then((_) { runApp(ChangeNotifierProvider<AppThemeNotifier>( create: (context) => AppThemeNotifier(), child: MyApp(), )); });

}

Instead of

void main() { runApp(MyApp()); }

Let me know if you are having any questions.

Thanks for purchasing.

Hi. I did what you described, and I have error: ======== Exception caught by widgets library ======================================================= The following NoSuchMethodError was thrown building Consumer<AppThemeNotifier>(dirty, dependencies: [_InheritedProviderScope<AppThemeNotifier>]): The method ‘toDouble’ was called on null. Receiver: null Tried calling: toDouble()

The relevant error-causing widget was: Consumer<AppThemeNotifier> file:///D:/Dev.Flutter/Src/melodyApp/lib/music/MusicOnboardingScreen.dart:26:12 When the exception was thrown, this was the stack: #0 Object.noSuchMethod (dart:core-patch/object_patch.dart:51:5) #1 double.* (dart:core-patch/double.dart:36:23) #2 MySize.getScaledSizeHeight (package:melodyApp/utils/SizeConfig.dart:133:18) #3 _MusicOnboardingScreenState.build.<anonymous closure> (package:melodyApp/music/MusicOnboardingScreen.dart:49:47) #4 Consumer.buildWithChild (package:provider/src/consumer.dart:177:19)

My main.dart is the below: void main() { }

//You will need to initialize AppThemeNotifier class for theme changes.
WidgetsFlutterBinding.ensureInitialized();
SystemChrome.setPreferredOrientations([DeviceOrientation.portraitUp])
    .then((_) {
  runApp(ChangeNotifierProvider<AppThemeNotifier>(
    create: (context) => AppThemeNotifier(),
    child: MyApp(),
  ));
});

class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { }

return Consumer<AppThemeNotifier>(
    builder: (BuildContext context, AppThemeNotifier value, Widget child) {
      return MaterialApp(
          debugShowCheckedModeBanner: false,
          theme: AppTheme.getThemeFromThemeMode(value.themeMode()),
          home: MusicOnboardingScreen());
    },
  );
}

Why am i getting this error?

Please ignore previous comment as I managed to overcome :)

Sorry just asking why do i keep getting this error when i try to add one part of the flutkit to my project

Error: Could not find the correct Provider<AppThemeNotifier> above this Consumer<AppThemeNotifier> Widget

This likely happens because you used a `BuildContext` that does not include the provider of your choice. There are a few common scenarios:

- The provider you are trying to read is in a different route.

Providers are "scoped". So if you insert of provider inside a route, then
other routes will not be able to access that provider.

- You used a `BuildContext` that is an ancestor of the provider you are trying to read.

Make sure that Consumer<AppThemeNotifier> is under your MultiProvider/Provider<AppThemeNotifier>.
This usually happen when you are creating a provider and trying to read it immediately.
For example, instead of:
```
Widget build(BuildContext context) {
  return Provider<Example>(
    create: (_) => Example(),
    // Will throw a ProviderNotFoundError, because `context` is associated
    // to the widget that is the parent of `Provider<Example>`
    child: Text(context.watch<Example>()),
  ),
}
```
consider using `builder` like so:
```
Widget build(BuildContext context) {
  return Provider<Example>(
    create: (_) => Example(),
    // we use `builder` to obtain a new `BuildContext` that has access to the provider
    builder: (context) {
      // No longer throws
      return Text(context.watch<Example>()),
    }
  ),
}
```
If none of these solutions work, consider asking for help on StackOverflow: https://stackoverflow.com/questions/tagged/flutter

The relevant error-causing widget was: Consumer<AppThemeNotifier> file:///C:/Users/ziyu_/AndroidStudioProjects/flutter_auth/lib/screens/health/HealthHomeScreen.dart:22:12 When the exception was thrown, this was the stack: #0 Provider._inheritedElementOf (package:provider/src/provider.dart:309:7) #1 Provider.of (package:provider/src/provider.dart:261:30) #2 Consumer.buildWithChild (package:provider/src/consumer.dart:177:16) #3 SingleChildStatelessWidget.build (package:nested/nested.dart:260:41) #4 StatelessElement.build (package:flutter/src/widgets/framework.dart:4701:28)

Hi ziyuxd111,

You will need to initialize AppThemeNotifier class for theme changes.

Change the main function available in the main.dart file to following:

void main() { WidgetsFlutterBinding.ensureInitialized(); SystemChrome.setPreferredOrientations([DeviceOrientation.portraitUp]) .then((_) { runApp(ChangeNotifierProvider<AppThemeNotifier>( create: (context) => AppThemeNotifier(), child: MyApp(), )); });

}

Instead of

void main() { runApp(MyApp()); }

Let me know if you are having any questions.

Thanks for purchasing.

Exception: Unable to launch com.example.UIKit on 52935AD1-BC00-4023-AB76-E37680978592: ProcessException: Process exited abnormally: com.example.UIKit: -1

An error was encountered processing the command (domain=FBSOpenApplicationServiceErrorDomain, code=1): The request to open “com.example.UIKit” failed. The request was denied by service delegate (SBMainWorkspace). Underlying error (domain=FBProcessExit, code=64): The operation couldn’t be completed. The process failed to launch. The process failed to launch. Command: /usr/bin/xcrun simctl launch 52935AD1-BC00-4023-AB76-E37680978592 com.example.UIKit—enable-dart-profiling —enable-checked-mode—verify-entry-points Error launching application on iPhone 11.

Hi,

1. Simulator->Reset Content and Settings, 2. Quit Simulator 3. Run project again.

If the problem still persists then run “flutter doctor” and send it to our support email (support(at)coderthemes(dot)com).

Thanks for purchasing.

I’m sorry I left you again.

Your kit is not iosimulator launching. It’s very difficult. I can’t use it at all. I don’t want a refund.

HI

Your UI KIT is the best. But it doesn’t work in my development environment. MAC,VSCODE, PROBLEM comes out a lot and does not debug. 1. What kind of development environment do you recommend? 2. I’d like to know how to use it.

get error

Error output from Xcode build: ↳ * BUILD FAILED *

Xcode’s output: ↳ /Users/s.s./Downloads/FlutKit_v4-1.1/FlutKit/ios/Runner/AppDelegate.swift:12:5: error: cannot find ‘GMSServices’ in scope GMSServices.provideAPIKey(””)

Hi,

Please add this import statement “import GoogleMaps” in ’../Runner/AppDelegate.swift’ file.

Thanks for purchasing.

Can you add some home service provider booking UI screens. Its very popular now. Maybe like this https://codecanyon.net/item/home-service-finder-provider-android-app-ios-app-template-handyman-htmlcss-files-ionic-3/23142904

Hi, Thank you for suggesting it. I will try to add this.

Hello, can you develope for me home service provider or handyman finder app Flutter UI ?

Hi,

Sorry, I would not be able to take custom work for now due to workload.

Thanks

Hi, please give me some suggestion.

Android Build is OK, but iOS I got an error like this.

[ +6 ms] Could not build the application for the simulator. [ +1 ms] Error launching application on iPhone SE (2nd generation). [ +4 ms] #0 throwToolExit (package:flutter_tools/src/base/common.dart:14:3) #1 RunCommand.runCommand (package:flutter_tools/src/commands/run.dart:474:9) <asynchronous suspension> #2 FlutterCommand.verifyThenRunCommand (package:flutter_tools/src/runner/flutter_command.dart:977:18) #3 _rootRunUnary (dart:async/zone.dart:1198:47) #4 _CustomZone.runUnary (dart:async/zone.dart:1100:19)

Xcode’s output: ↳ [ +1 ms] While building module ‘Flutter’ imported from /Users/herb/Webs/flutter/.pub-cache/hosted/pub.dartlang.org/shared_preferences-0.5.8/ios/Classes/FLTSharedPreferencesPlugin.h:5: In file included from <module-includes>:1: In file included from /Users/herb/Webs/dev_flutter/flutkit/ios/Flutter/Flutter.framework/Headers/Flutter.h:8: In file included from /Users/herb/Webs/dev_flutter/flutkit/ios/Flutter/Flutter.framework/Headers/FlutterAppDelegate.h:11: /Users/herb/Webs/dev_flutter/flutkit/ios/Flutter/Flutter.framework/Headers/FlutterPlugin.h:12:10: warning: double-quoted include “FlutterChannels.h” in framework header, expected angle-bracketed instead [-Wquoted-include-in-framework-header]

Hi headmaster,

Make sure your flutter SDK version above 1.20. If not, then run “flutter upgrade” to upgrade flutter SDK to the latest stable version. Then run “flutter clean” and re-run the application by “flutter run”. If the problem still persists then run “flutter run—verbose” and send it to our support email (support(at)coderthemes(dot)com).

Thanks for purchasing.

In no codecayon project with flutter I have been able to find an app that works with the reservation calendar. Any idea where i can find one?

by
by
by
by
by
by

Tell us what you think!

We'd like to ask you a few questions to help improve CodeCanyon.

Sure, take me to the survey