Learn Flutter - Cross platform mobile app development.

Search This Blog

Contact Me

Get link
Facebook
X
Pinterest
Email
Other Apps

Name:
E-mail: *
Message: *

Get link
Facebook
X
Pinterest
Email
Other Apps

Flutter basic cooking website example

Flutter Cooking website example I have tried Flutter for web development and here is my desktop screenshot. Now let learn to create own website in the Flutter. To create a website in Flutter you have to update the Flutter to v1.5 or latest, now if you have already the latest version you are ready to rock. Now hit " flutter packages pub global activate webdev " to add/activate webdev package as global. If you are done with the above step go to your Flutter sdk directory " <flutter sdk directory>\ .pub-cache\bin " and " <flutter sdk directory>\ bin\cache\dart-sdk\bin " add them to your environment path as per your operating system. Now go to vscode editor and click on View->Command Palette search for Flutter Web. After the above step, it will create the necessary files to start work. Create image_url.dart file inside lib folder. image_url.dart final imageUrl = [ 'image_1.png' , 'im...

Flutter - Animated tab from scratch reference Uplabs.

Flutter Animated Tab I have created an animated tab in Flutter, reference taken from Uplabs. To make the code look clean I have used Animator library for a beautiful animation. Add this library to your pubspec.yaml file and hit command "flutter packages get" to install the library. I have created a class TabModel to structure the tab data, don't worry I will show the use of TabModel class. As of now just create file tab_model.dart inside lib/tab folder . tab_model.dart import 'package:flutter/widgets.dart' ; class TabModel { String title ; Icon icon ; bool selected ; TabModel ( { @required this . title , @required this . icon , this . selected = false } ) ; } Now we are ready to prepare tab data with the custom parameter, add the following code inside main.dart file. main.dart import 'package:flutter/material.dart' ; import 'package:flutter_animated_tab/tab/animated_tab.dart' ; import '...

Flutter - Creating multi theme color app.

Flutter Theme :- Theming app with multiple colors makes the app looks awesome. In this post, we will look at the implementation of multiple themes or colors. As we have seen in many apps, providing the multicolor option in the app makes the user comfortable with the app, because the user can have own choice of app color. Even I used to think the app should support the multicolor, so I thought to create it in a flutter. Before start, we need to add a dependency, open pubspec.yaml file and add the following line. pubspec.yaml dependencies : shared_preferences : ^ 0.5 .2 We need a shared_preference package to manage or to check the current color of the app. As per the applied theme, we'll switch the theme. Here, I have created the theme.pref.dart file to set/get the theme color from shared preference. Every time when the app runs, shared preference will return the theme value that we have to set to ThemeData in MaterialApp() widget. If you getting confused, don...

Powered by Blogger