0.11.2.mp4
This macOS demo is running in Release Mode v0.11.2 (forward x1.5).
Drag n Drop Mobile Development Tool created by @dungngminh.
This project is tested with BrowserStack.
- This idea came from FlutterFlow.
- β Create and sync project in local.
- β Sync to Supabase.
- β
Drag n Drop Widget:
- β Add Widget to Tree.
- β Change properties of Widget.
- β Delete Widget.
- β Wrap in child to parent.
- β Widget Tree.
- β
Right click to Widget to show context menu:
- β Add Widget.
- β Delete Widget.
- β Wrap in child to parent.
- π§ Copy Widget.
- π§ Paste Widget.
- π§ Duplicate Widget.
- β Preview app via mobile app
- π§ Support State Management:
- π§ Change State.
- π§ Create New State.
- π§ Delete State.
- π§ Bind state to properties of Widget.
- π§ Generate source code by widgets.
- π§ Assets Manager.
- π§ Build apk file.
- Adjusted Flutter Widget pure Dart classes (Thanks @rodydavis for original version).
- Recursive Algorithm (will optimize soon to fit with Composite Pattern).
- Adjusted device_frame
- Material 3.
- Supabase for BaaS solution.
- β Web
- β Linux
- β macOS
- π§ Windows
For fvm user
This project uses Flutter 3.10.6
. If you use fvm
, You can install this version via fvm. Run commands in your terminal:
fvm use 3.10.6
and use Flutter via fvm using
fvm flutter [command]
or this if you want use 3.16.0
for global version.
fvm global 3.16.0
Enable desktop app and web support config:
flutter config --enable-macos-desktop
flutter config --enable-linux-desktop
flutter config --enable-windows-desktop
flutter config --enable-web
Get dependencies
flutter pub get
Install pod (macOS only)
cd macos && pod install && cd ..
Generate files
flutter pub run build_runner build --delete-conflicting-outputs
Run
flutter run
Click to expand
I configured some commands in derry
for easy to use.
Install derry
dart pub global activate derry
Get all commands
derry ls
Get dependencies
derry get
Generate files
derry runner
Clone env.json
from env.example.json
. Key and value in env.example.json
is:
{
"SUPABASE_URL": "PASTE_YOUR_SUPABASE_URL",
"SUPABASE_ANON": "PASTE_YOUR_SUPABASE_ANON_KEY",
"SENTRY_DSN": "PASTE_YOUR_SENTRY_DSN"
}
You can create a new Supabase project with this configuration or use my configuration below:
{
"SUPABASE_URL": "https://yznpjybdklkbnjaqgpor.supabase.co",
"SUPABASE_ANON": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Inl6bnBqeWJka2xrYm5qYXFncG9yIiwicm9sZSI6ImFub24iLCJpYXQiOjE2ODE0ODc2ODAsImV4cCI6MTk5NzA2MzY4MH0.ymBej2GzwqimWqMc2pDN5a_kARhDzXMGSNtHLpItXKE",
"SENTRY_DSN": "https://f3ce107186614265a0c9f9fc1e00f190@o4505489138450432.ingest.sentry.io/4505489139302400"
}
Use this command to run project
flutter run --dart-define-from-file=env.json
You can use VSCode configuration in this to run this project.
You can check full list of supported widgets and properties in here. This below is some widgets that supported:
Text
Scaffold
Column
Row
Container
ElevatedButton
Image
:AssetImage
,NetworkImage
Stack
SizedBox
ListView
TextFormField
Padding
- ... to be continue
Dung Nguyen Minh π» π π |