MightyNotes app is a smart Flutter Notes app. It contains Flutter source code and to build your Notes
application with most useful features and eye-catching outlook. If you are planning to deploy your Notes
app project for android and ios users, then it’s your perfect match to have on your hand. The product
comes with Add notes, Add Todo List, Color filter, push notification as well as Subscription Reminder
support. You can customise a bit and decide what to show or not into the app real-time.
Prerequisite
Android Studio: 4.1.3
Flutter: 2.0.3
Danger
To set up the Firebase app, you must first add the Google JSON file by following the
steps below, or else the app will not work.
Setup Firebase
For Firebase setup, you just need to change the
android/app/google-services.json
file.
Create a new firebase account, register your application with your package
name.
Now download the google-services.json file and replace with current.
Step 1 : Navigate to the Firebase Console and then to Indexes.
Step 2 : This type of error will appear when you launch the admin panel.
Step 3 : Copy and paste this link into your browser to get this type of dialogue, then
click
on Create Indexes.
Info
Be patient, the indexes will take some time to build.
Step 4 : Create all indexes in this manner.
Info
Total 6 Indexes will be created.
Create Indexes mannually
Step 1 : Click on the Add Index button, and then enter the collection id.
Step 2 : Create all of the indexes listed below and wait for them to be built.
Project Structure & Features
Mighty Notes project structure and short description for each of them is as follow:
images: images as well as appIcon are stored here.
lib: Application main file and folder are located here.
component: All the Widgets except for screen will be declared here.
models: A base class that holds some data and allows other classes to listen to
changes to that data.
services: All Firebase services are located here.
screens: FileName contents Screen at the end of name eg. DashboardScreen.
store: It is used for State management technique MOBX.
utils: Basic ready made widgets are located here.
Colors.dart: Application colors are declared here.
Common.dart: Commmon functions are declared here.
Constant.dart: All the constant values are declared here.
pubspec.yaml: Application name and other project dependencies can be found here.
Application Features
SignIn with Google / Email & password
Add Notes
Add ToDo
Collaboration(share) notes
Subscription Reminder
Dark & light mode
Local notification
Notes filter by color
Lock note & todo
Introduction to Flutter
Flutter is Google’s UI toolkit for building beautiful, natively compiled
applications for MOBILE, WEB, and DESKTOP from a
single codebase. It is
very
easy to learn and currently it is getting more and more popular. With this blog
post, you will learn some basic stuff about Flutter and after reading it, you
will be able to create a simple application using this technology.
Click here to check out more details about
flutter.
1 Download the following installation bundle to get the latest stable release of
the Flutter SDK:
2 Extract the zip file and place the contained flutter in the desired
installation location for the Flutter SDK (for example, C:\src\flutter; do not
install Flutter in a directory like C:\Program Files\ that requires elevated
privileges).
Step 2 : Update your path
If you wish to run Flutter commands in the regular Windows console, take these
steps to add Flutter to the PATH environment variable:
From the Start search bar, enter ‘env’ and select Edit environment variables
for your account.
Under User variables check if there is an entry called Path:
If the entry exists, append the full path to flutter\bin using ; as a
separator from existing values.
If the entry doesn’t exist, create a new user variable named Path with the
full path to flutter\bin as its value.
Info
Note that you have to close and reopen any existing console windows for these
changes to take effect.
You are now ready to run Flutter commands in the Flutter Console!
Step 3 : Run flutter doctor
From a console window that has the Flutter directory in the path (see above), run
the following command to see if there are any platform dependencies you need to
complete the setup:
c:\src\flutter>flutter doctor
If you find any issue during environment setup, please go online Click
here
Download the following installation bundle to get the latest stable release
of the Flutter SDK:
Download SDK and extract downloaded file, just double click on that. and
just copy extracted folder and paste it to your desired location (for
example, Documents\flutter).
Step 2 : Update your path
Warning
Path variable needs to be updated to access “flutter” command from terminal. you
can just update path variable for current terminal window only. and if you want
to access flutter commands from anywhere in terminal, we need to update SDK path
permanently.
To update PATH variable, we need to open terminal.
To update PATH variable for current terminal window only, then enter this command
"export PATH="$PATH:`pwd`/flutter/bin"" and hit enter key.
To update PATH variable permanently, then Open or create .bash_profile
file. to open or create that file, then enter "sudo open -e
$HOME/.bash_profile" and hit enter key.
Append below line to bash_profile file at bottom of all other content. "export
PATH="$PATH:[PATH_TO_FLUTTER_GIT_DIRECTORY]/flutter/bin"" as
[PATH_TO_FLUTTER_GIT_DIRECTORY] is actual path of SDK folder.
Run this command on terminal "source $HOME/.bash_profile" to refresh PATH
variables.
Then check whether our SDK is successfully installed or not.
You are now ready to run Flutter commands in the Flutter Console!
Run "flutter doctor" into terminal, If you are getting check list of
flutter sdk requirements, it means SDK is successfully installed on your
machine. and you can start building flutter apps on your machine.
If you find any issue during environment setup in macos, please go online Click
here
Download the following installation bundle to get the latest stable release
of the Flutter SDK:
Download SDK and extract downloaded file, just double click on that. and
just copy extracted folder and paste it to your desired location (for
example, Documents\flutter).
Step 2 : Update your path
Warning
Path variable needs to be updated to access “flutter” command from terminal. you
can just update path variable for current terminal window only. and if you want
to access flutter commands from anywhere in terminal, we need to update SDK path
permanently.
You’ll probably want to update this variable permanently, so you can
run flutter commands in any terminal session. To update PATH variable, we need
to open terminal.
Run source $HOME/.
to refresh the current window, or open a new terminal window to
automatically source the file.
Verify that the flutter/bin
directory is now in your PATH by running:
echo $PATH
Verify that the flutter
command is available by running:
which flutter
You are now ready to run Flutter commands in the Flutter Console!
Getting Started (Build & Run)
Warning
All below steps are must be followed to build and run application
Download Project
Download and find the your project folder, use your preferred IDE
(Android Studio / Visual Studio Code / IntelliJ IDEA) to run
the project.
Get Dependencies
After you loaded project successfully, run the following command in the terminal
to install all the dependencies listed in the pubspec.yaml
file in the project's
root directory or just click on Pub get
in pubspec.yaml fileif you don't
want to use command.
flutter pub get
Warning
All below steps are must be followed to build and run application
Build and Run App
Locate the main Android Studio toolbar.
In the target
selector, select an Android
device for running the app. If none are listed as available, select
Tools >
Android > AVD Manager and
create one there. For details, see Managing
AVDs.
Click the run icon in the toolbar, or invoke the menu item Run > Run.
After the app build completes, you’ll see the app on your device.
If you don’t use Android Studio or IntelliJ you can use the command line to run
your application using the following command
Warning
Below step requires flutter path to be set in your Environment variables. See
https://flutter.dev/docs/get-started/install/windows
flutter run
You will see below like screen after you have build your app successfully
Try hot reload
Flutter offers a fast development cycle with Stateful Hot Reload, the ability to
reload the code of a live running app without restarting or losing app state.
Make a change to app source, tell your IDE or command-line tool that you want to
hot reload, and see the change in your simulator, emulator, or device.
If you want add/change android code, click on Tools->Flutter->Open Android module in Android Studio Or File->Open ->open android
module inside your project
Important
Don't change package name inside android/app/src/main/AndroidManifest.xml file
Setup Firebase
For Firebase setup, you just need to change the
android/app/google-services.json
file.
Create a new firebase account, register your application with your package
name.
Now download the google-services.json file and replace with current.
Wait until the project has been synced successfully. (This happens
automatically once you open the project, but if it doesn’t, select Sync
Project with Gradle Files from the File menu).
Now, click on Run button.
Change Application Name
You must want to change your application name. This is how you can do.
Follow the below step.
Open /android/app/src/main/AndroidManifest.xml and specify your application
name.
Go to your project -> Tools -> Flutter -> Open for Editing in Android Studio as shown below
Open Project in New Window
Wait for while until project synchronization. After that Go to Build -> Generate Signed
Bundle/APK...
Select Android App Bundle or APK Option as per your need. (Android App Bundle is best solution)
and click Next button.
Select Create new.. option to generate new Signed key (When you release your app First Time) and
Fill all options. Refer this link
Click Next button and you will get following screen...
Select Build variants - release and Signature versions both V1 and V2 respectively as shown above
screen shot and click Finish button.
Wait for a while until Gradle Build Running process complete.and finally you will get the
Generate Signed APK : (APKs) generated successfully . from that click on Locate option to get
Location of your Generate Signed APK Key.
iOS Configuration
Open Project in Android Studio
Open android studio in your project.
Open terminal in android studio.
Pub get.
Open terminal cd ios.
pod install.
run project in xcode.
Open Project in Xcode
Open Xcode.
Select Open another Project.
Open the iOS directory within your app.
Now, click on Done button.
Change Bundle Name
Select your project file icon in Group and files panel.
Then Select Target -> Info Tab.
At last change Bundle Name.
Change Bundle Identifier.
Bundle Id is a unique Identifier of your of app on iOS and MacOS. iOS and MacOS
use it to recognise updates to your app. The identifier must be unique for your
app.
Select your project file icon in Group and files panel.
Select General Tab.
After Select General tab you can see the details of your application.
In Identity section, rename your Bundle identifier.
Change App Icons
see How to Generate App Icons?
In Group and files panel find “Assets.xcassets” folder.
In Assets.xcassets folder replace AppIcon.
Google SignIn:-
In iOS Integration
First register your application.
Make sure the file you download in steps 1 is name
GoogleService-Info.plist.
Move or Copy the GoogleService-Info.plist into the " [My_project]
/ ios / Runner".
Open Xcode, the right-click on the Runner directory and select Add
files into Runner.
Select the GoogleService-Info.plist from the file Manager.
A Dialog will show up and ask you to select the targets, select the
Runner.
Then add the CFBundleURLTypes attritubes below into the "
[My_project] / ios / Runner/ Info.plist " file.
Then Run your Project.
Open Xcode and then open GoogleService-Info.plist file.
Open Xcode and then open Info.plist file.
<key>CFBundleURLTypes</key>
<array>
<dict>
<key>CFBundleTypeRole</key>
<string>Editor</string>
<key>CFBundleURLSchemes</key>
<array>
< TODO Replace this value:>
< Copied from GoogleService-Info.plist key REVERSED_CLIENT_ID>
<string>"Enter your REVERSED_CLIENT_ID"</string>
</array>
</dict>
</array>
Open Xcode and then open Info.plist file and Change Permission App name.
Firebase Configuration
Create a Firebase project
Before you can add Firebase to your Flutter app, you need to create a Firebase
project to connect to your app. Visit Understand Firebase Projects to learn more about Firebase
projects.
Warning
If you're releasing your Flutter app on both iOS and Android, register both the
iOS and Android versions of your app with the same Firebase project.
Enter your app's package name in the Android package name field.
Warning
Make sure that you enter the ID that your app is actually using. You cannot
add or modify this value after you register your app with your Firebase
project. Both applicationId should be matched.
Click Register app.
Add a Firebase configuration file
Click Download google-services.json to obtain your Firebase Android config
file (google-services.json).
Move your config file into the android/app directory of your Flutter app.
Follow the instruction for enabling Firebase services in your Android app here
Enable the Google & Email/password SignIn
In Firebase console, open the Authentication section.
On the Sign-in Method tab, enable the Google Sign method and click save same
as Apple and Phone signIn method.
Add your debug and release SHA1 Key. Follow this link .
Update the existing code with new release
Special Notes
As per envato policy installation, setup and configurations or modification are not included in free
support. Free support is only for any bug/ error in original code. we do not provide installation
and customization support in FREE SUPPORT.
Still, We are providing steps for How to update future release code to existing source code for your
knowledge purpose.
PLEASE DO NOT CREATE TICKETS IF YOU FACE ANY ISSUE DURING UPDATE YOUR CODE. WE WILL NOT PROVIDE ANY
SUPPORT ON THAT.
How to update future release code to existing source code
If you want which file changes are on the latest updated version then you have to manage the git
repository by yourself.
For First time: Initial project downloaded from codecanyon server.
In your dashboard, click the green New project button or use the plus icon in the navigation
bar. This opens the New project page.
On the New project page -> Create a blank project.
Step 3: Clone your project to your local system
1. Once project is created on your gitlab server. You have to clone the project to your local
system. You can clone it with the command line.
2. git clone “repository path”
3. Copy your project url and clone into your exiting system
4. Once successfully clone then system will create a folder on your system
Step 4: Download project from codecanyon serverStep 5: Copy/paste your initial downloaded project to clone directories.
Once successfully downloaded project from codecanyon, copy/paste your downloaded project into clone
directories
Note
Only orignal source code is put here.
Step 6: Commit and push to gitlab server
Onces copy/paste your changes to clone directres, you have to push all files to your gitlab server.
For that use the following commands.
Before commit to server directores, you have to remove below folder from your project
1. build
2. .idea
3. .gradle
After That follow below steps
1. Goto inside your clone directory project
2. Add your all files with “git add .” command
3. Now commit your changes with below command
4. git commit -m ‘initial commit’
Note
Write your latest version message instead of “initial commit”.
5. Push your changes to server with below command
“git push” And provide you gitlab credential details
6. Check your all changes to gitlab server
For Update existing code (If Already have old version of project)
Note
If you remove the project from the local system then clone the project again from your
gitlab server. Follow the same above Step 3: Clone your project to your local system
Step 1: Download the latest version from codecanyon server.
Once you will received mail for updates. Just download latest code from codecanyon server.
Step 2: Copy/paste your initial downloaded project to clone directories.
Once successfully downloaded project from codecanyon, copy/paste your downloaded project into clone
directories
Note
Only orignal source code is put here.
Step 3: Commit and push to gitlab server
Follow same Step 6: Commit and push to gitlab server
Step 4: Check updated files
After committing your latest changes. Goto the gitlab project dashboard and click on the commit link.
Click on link which you have commit message on above steps 3
Now check the all changed file.
Click on “XYZ changed file” to see which file has been changed.
No matching client found for package name
The error is "package_name" in google-services.json is not matching with your
"applicationId" in app gradle.
Just make sure the package_name and applicationId both
are
same.
You can also Download any version(including
older)
from here (For Mac, Windows, Linux)
Use the SDK path in your future projects
Dependency Error
When you run the application and you see error like this
Running "flutter pub upgrade" in mighty_notes...
The current Flutter SDK version is 1.17.5.
Because mighty_notes depends on flutter_svg >=0.18.0 which requires Flutter SDK version
>=1.18.0-6.0.pre <2.0.0, version solving failed. pub upgrade failed (1; Because
mighty_notes depends on flutter_svg >=0.18.0 which requires Flutter SDK version
>=1.18.0-6.0.pre <2.0.0, version solving failed.) Process finished with exit code 1
Error Possibilities:
Generally, this error occurs when
Error Possibilities
Generally, this error occurs when
one of your third party package version is not supported.
your Flutter SDK version not matched with one of your third party packages.
for
ex, your current Flutter SDK version is 1.20.0 and third party package
targets
Flutter SDK version 1.17.0.
We like to hear you out when you get stuck or encounter difficulty with our products. As soon as you
buy one of our products – you can open a support ticket and share your concern right away.
It is recommended that before submitting a ticket you take a close look at product documentation
(Docs folder in the
archive you have downloaded from Themeforest/Codecanyon). To get technical support and assistance,
you need to have a valid purchase code. You will find this when you SignIn your
Codecanyon/Themeforest “Download” page.
Click on the product’s download link.
Please Note:
Free support policy includes troubleshooting, technical assistance with the product only.
It does not include any customization, additional features integration or concerns about third-party
plugins compatibility.
But, support is applied to plugin(s) we have developed and integrated ourselves. We appreciate your
understanding!
If you need assistance and information on purchased product that is not covered in documentation,
post them on our support portal at https://support.meetmighty.com/
You can expect answer within 24-48 hours, usually as soon as possible in the order they were
received.
Additionally, if any support ticket has no response from the item owner for more than 7 days,
that support ticket will be closed by default. However, if you need further assistance, you can
create a new ticket.
All support requests are being processed on business days (Monday to Saturday) from 9:00 to 18:00
(GMT +05.30). We are in GMT+5:30 time zone.
We address all the support queries 6 days weekly on the first-come, first-solve basis (Sundays off).
Do you have any pre-sales questions or concerns,
please write to us via our website contact page or email us at [email protected].
We like getting positive feedback from our customers, and this is why we do our best to earn it!
Write a review: https://codecanyon.net/downloads
Change Log
Update your application to give for the best experience – check out what’s new and improved.
Thank you
