Mastering Custom (Function/Widget/Action) Code in
HTML-код
- Опубликовано: 30 июл 2024
- Be a paid member. Support my work. Join the Klaturov army!
www.youtube.com/@flutterflowe...
Support my work
github.com/sponsors/bulgariam...
Website
bulgariamitko.github.io/flutt...
You can book me as FF mentor or support my work
calendly.com/bulgaria_mitko
GitHub repo
github.com/bulgariamitko/flut...
Discord channel
/ discord
RUclips channel
/ @flutterflowexpert
In this video, I'll dive into the world of custom code in FlutterFlow and show you how to unlock its full potential. You'll learn how to write custom functions, actions, and widgets, as well as how to copy and paste code from ChatGPT. I'll also show you how to automatically add all your arguments inside custom actions and widgets for maximum efficiency. This video is an essential guide for anyone looking to take their FlutterFlow skills to the next level. By the end, you'll have a solid understanding of how to use custom code to enhance your projects and streamline your workflow. So, join me and discover the power of custom code in FlutterFlow!
Code used
github.com/bulgariamitko/flut...
In this video
00:00 Introduction
01:34 Custom Functions
17:25 Custom Widgets
23:57 Custom Actions 
Развлечения
Thanks so much for the information. Great to know!
learnt so much, thank you!
Thank you! Very helpful tutorial.🎉🎉❤
This is awesome Dimitar, will be running to your calendy 🔥✊🏿
amazing tutorial i learned a lot!!!!
For those like me who don't know anything about coding, there are important details for us like which lines to copy and which ones not to, how to know which argument to add, how to format the prompt in AI correctly in order to avoid the output not working, why the results given by the AI are not working etc.
It would be great if you made a video to answer such questions
Thanks for the feedback I will try to make a video about that as well
did you make it? will save my life if you will... @@flutterflowexpert
Hey Dimitar, amazing videos 😄 thanks for diving deep, without skimming over important details. Just a question - do you do any 1-1 consulting? Thanks so much!
Yes I do that. You can check my link calendly.com/bulgaria_mitko
Thanks for the video. Could you please confirm my understanding on the differences between custom function, widget and action? I have a button (custom widget) in a screen. I click it, and it asks for the action (custom action). The app calculates the average (custom function). Am I correct?
Yes, you are correct.
Hey Dimitar, a lot of thanks , I am using this => import '/custom_code/actions/index.dart' as actions;
and tha let me call acction inse other action . Is this use correct;
No it is not correct. You need to call it like that
import 'package:[nameofpackage]/custom_code/actions/[nameofcustomaction]';
I wanted to implement mixpanel analytics using mixpanel_flutter 2.1.1 while it need custom action then added inside main.dart file via inital actions . But while doing so it just led to infinite wait at test window what should I do it is not working
Check the dev console and see what kind of error do you get there.
This is very helpful for some functionalities. I was looking for a near data broadcasting widget and I stumbled upon a feature that allows you to use your device as a BLE Peripheral. Do you have something like this in your Git?
That is actually a great question I will add it to my list of upcoming FF Quests.
@@flutterflowexpert Great stuff, I'll be looking forward to it.
hi, what to do if the pub dev files have a class and the future function is inside the class?
kindly help thanks
depends of what you want to do
Let's say I want to be able to record an audio file and upload it to whisper API. Would I need a custom action for: recording, stopping the recording, saving the file, and uploading, or can it all be done in one?
it can be all done in one single custom action and I will actually do it this way.
@@flutterflowexpert when will you do it? Is it already available?
@@davidmoosmann No I meant if I were you I will do it in a single custom action
Thank you so much ! Some APIs have complex input, Could you make a video on how to write code for a custom action to write JSON and then put it as an input for an API ? :)
Yes, but it is very simple where is the data coming from to great the JSON? You just need to create it using {} or json.encode(). You can reach me in my Discord channel if you need any help.
🌟 Welcome to my video! 🌟 To ensure you have the best experience and access to all the resources mentioned, we've placed all active links in the video description below. This helps me keep everything up-to-date and easy for you to find!
👾 Join my Discord community! It's a great place to connect, share, and get the latest updates. The link is in the description as well.
💖 If you enjoy our content, consider supporting the channel. Every bit of support helps me create more of what you love. Details on how you can support are also in the description.
Thank you for watching and being a part of the community! 🚀
how to record audio and store it on firebase?
You have to use package for that
Hey Dimiter, very helpful video.. I want to perform google auth using custom action (google_sign_in: ^6.1.0) So I have tried creating an action with pub dev dependencies. But I'm confused with adding code ? Why this GitHUb repo is required? Form where I can copy the code of a library?
which github repo you are talking about?
@@flutterflowexpert Can I implement pubdev library implementation in flutterflow without github repo?
From where I can copy code of a library?
@@pratimadudhewar3680 yes. you can. you can import any package using a custom action or widget in FF
@@flutterflowexpert How I can do that? Any reference document. How to copy that library code? I'm confused about implementation. Can you help me with google sign up?
@@pratimadudhewar3680 Google Auth is included out of the box in FF. You don't need any custom code
Hey great video but nobody on RUclips talks about troubleshooting errors when using LatLng() in custom widgets, Even though I can use LatLng in custom functions 😵💫
You can or you can't?
Thank you sm for your efforts, where can i donate money?
You can use my calendary actually to donate of you like 10 euro :) calendly.com/bulgaria_mitko thank you
here is a small tip for you: when you want to pronounce the word analyzer, think of it like this " Anna" like the name Anna Nicole then the word "Lie - ZER" like "dont LIE to me" so " Anna Lie ZERR" or "Anna - Lizer" like adVISOR but LIZOR - "Anna Lizor"
Thank u and ur video was very helpful :)
Thank you for the tip :)
@@flutterflowexpert can u do consultation? Plz send me an email where I can contact u, thanks
@@thebicycleman8062 calendly.com/bulgaria_mitko you can book me using this link
@@flutterflowexpert thanks ur the BEST!
would you say with custom code, custom widget and custom function - this makes flutterflow have every ability of dart like using in VS code or manual IDE? is it enough to get most stuff done - or would you say there is still a big main reason to always do things only outside flutter flow?
this is not mastering bro you just copy and paste without explaination =(
This is a tutorial how to use the custom code editor in FF. This is not a tutorial about how to code.
Excellent subject that we needed for a long time but unfortunately your explaination is not good and you kept everything half. You didnt explain custom widget well. I lost 35 minutes and i forgot indeed what i knew. Messy, confusing tutorial :(
thanks for your feedback :)
amazing video i learn lotoff from you i hope that you help with printer pos ticket listining to new docs snapshot if u can make this works will be so great
// Automatic FlutterFlow imports
import '/backend/backend.dart';
import '/flutter_flow/flutter_flow_theme.dart';
import '/flutter_flow/flutter_flow_util.dart';
import '/custom_code/actions/index.dart'; // Imports other custom actions
import '/flutter_flow/custom_functions.dart'; // Imports custom functions
import 'package:flutter/material.dart';
// Begin custom action code
// DO NOT REMOVE OR MODIFY THE CODE ABOVE!
// Set your action name, define your arguments and return parameter,
// and then add the boilerplate code using the button on the right!
import 'dart:async';
import 'package:cloud_firestore/cloud_firestore.dart';
final db = FirebaseFirestore.instance;
final collection = db.collection('sendorder');
final printerAddress = '192.168.0.1'; // Replace with your printer's IP address
final printerPort = 9100; // Replace with your printer's port number
Future newCustomAction() async {
final snapshot = await collection.get();
final docs = snapshot.docs;
final lastDocId = docs.isNotEmpty ? docs.last.id : null;
final query =
collection.orderBy(FieldPath.documentId).startAfter([lastDocId]);
final newSnapshot = await query.get();
final newData = newSnapshot.docs.map((doc) => doc.data()).toList();
for (final data in newData) {
final textToPrint = 'Field 1: ${data['field1']}, Field 2: ${data['field2']}';
final socket = await Socket.connect(printerAddress, printerPort);
socket.write(textToPrint);
await socket.destroy();
}
}
I am not sure you can have access to local ip address using your app. Please check that with the FF support team.