Thursday, May 13, 2021

Customize Error Widget App Flutter

Today is holiday Eid Mubarak in Indonesia. So Having much time to spend with family and hobby. And I want to say Eid Mubarak. And What I'm gonna share this today it's simple. It's related with ui widget error that we often face when something wrong with our ui widget. It could be like returning null inside BuildContext. Like screenshot above, I accidentally made the error but it could be real error next time lol.

So what the production build handle this kind of error ? It just show empty white screen. And this is what we want to customize it. It's better if we we show error message and one button to reset the app. So the user experience will be much better. 

Fortunetly the implementation is not hard to do. You just need to implement ErrorWidget.builder in main class with your error custom widget. As example below that I create. You can create your own class to customize the UI. Don't forget you need to pass one parameter to your class that's FlutterErrorDetails. 

Sunday, April 25, 2021

Plugin formz Helps Flutter Bloc Cubit to Make State

One of my projects using latest flutter bloc with cubit. And I follow tutorial from flutter bloc web. And First time I learned it, it made me confused why so many classes do we have to implement it. Like Event class, Bloc class and State class. And The view itself have two things ui page and form page. It's like we have five classes to cover bloc and flutter ui.

But After using it a little big long, I can see why we need to have many classes. First if your app is not big, it will make your code looks too much. Sorry I forget the word that can explain it better. But if your app is big and continue developing. It will be easir for you to maintain it.

So what I'm gonna share this month, about the one of the core flutter bloc plugin that I used for my app. That is formz. It's not just used for flutter bloc only, you can combine it with other state management. So what's the advantage using this plugin is you can simplify and clarify the input form page like making validation and loading state when submitting form.

So if you have form in your app, it must has input and button to submit, right ? So for one input, you need to define it in formz class. So in that class, you need to use @override method that is validator. I give you en example below. It uses many term like pure or dirty. To indicate the value inside FormzInput. This is for string value that is Name itself.

Sunday, March 21, 2021

Automatic Backup Firestore Using Cloud Scheduler Every Day



Doesn't feel it's been a month since I posted last article regarding print using printer bluetooth. The app has been used over one month and It's fine. I haven't had problem but maybe the alignment that doesn't fit right and left doesn't sync. But overrall it's good for my sister business.

If you've firebase firestore for a long time. Maybe you wonder if your data is lost and there's something upredictable happened. We want our data save, but we believe firebase can handle it right. But for the best you need to backup your data to prevent something bad happened. Fortunely firebase supports it with Google Cloud Platform it's possible. 

There are many article that talks about it, even firebase has documentation about it that I'm gonna the link below. It's not hard to do but remember you need to pay to do it. In my case It doesn't cost much because my DB is small I think. It's a few hundreds Kb. So it's still acceptable in my wallet lol. For now I do backup for 24 hours following practice in firebase.

Saturday, February 20, 2021

Printing Receipt with Blutetooth Using Flutter

Recently, I bought the bluetooth printer for my sister business. She wants to have receipt everytime clients have done treatment. It's beauty care business. So She needs the customer database and transactions as well. So I made the app first to record all of it. The problem I have is I have never used bluetooth printer before for my projects. Because I don't have one to try.

Fortunately I got one to test the printer. First I need to search the plugin that supports printer bluetooth on Flutter. Because I made the app for iOS and Android. So I need the cross platform framework that is flutter. That I think it's powerful. OK the plugin that I used is esc_pos_bluetooth. It's not easy acuallty to use. Because I have problem using android that I need to fork the repository.

The issue related to android permissions on newest android phone. That the library haven't updated yet, but many people have known the issues. So there are two packages that I fork. It's esc_pos_bluetooth and flutter_bluetooth_basic. I explain what I need these two packages. First with flutter_bluetooth_basic I added two permissions.

Sunday, January 17, 2021

Show searchable_dropdown Widget Without Using Dropdown But Button


Hello guys, My first post for this year and today I'm gonna show you how to use searchable_dropdown package when they only show the searchble_dropdown through dropdown, but actually if you look closer inside the package you can find DropdownDialog which is you can implement ShowDialog to show it without using Dropdown.

In this useful package, you don't need to implement your own search because it's provided by the package. You only need to provide the data to the widget. That's what I like about this plugin or package. It's very useful because I used this for my app Food Today where the use can search food categories using this plugin and there's textfield where you can type the category you want to show.

As you can see on the video above where I click search button then showing searchable dialog. It's not hard to do luckily. First of course you need to install the package searchble_dropdown in pubspec.yaml and don't forget to do "flutter pub get" in terminal before using the package in your code.