Skip to main content

Posts

Flutter Web Application Development with and setting the path url strategy

Web Application Development with Flutter  Flutter 2.0 is now live and the creation of the web application using Flutter is now fully supported. In this blog post, we are going to create a web application using Flutter and Navigator 2.0. Create Web Application Project  For creating the web application using you need to install  2.0 or a later version of the Flutter. You check the version of the dart and Flutter using the below command. flutter --version Flutter 2.0.6 • channel stable • https://github.com/flutter/flutter.git Framework • revision 1d9032c7e1 (2 weeks ago) • 2021-04-29 17:37:58 -0700 Engine • revision 05e680e202 Tools • Dart 2.12.3 You can follow the steps mention on flutter.dev  getting started page to configure the web application. For this post, I am going to create a simple web application that will show the route name in the browser as we change the view in the apps. Let's give the project a name web navigator demo . Step1:- Create a Web Application using Android S

Dart REST API Server CRUD Application with aqueduct

Dart is the programming language created by Google and its very popular nowadays because it's providing the platform using which we can create a single code base for developing an application for Android, IOS and Web with the help of Flutter SDK. Today in this article we are going to explore how to create a REST API using the dart without Flutter. Here in this part of the article, we will explore two things. Expose Simple REST API using the DART programming language Connect Dart with the Postgress using the Model Create REST API in DART with aqueduct So for creating the rest API using the dart we are going to use the aqueduct package available at pub.dev . This package provides lots of functionality which help us for creating the REST API server. Let's start the creation of our REST API server. We required some setup before starting the coding. Dart should be installed into your server or local environment We required a Postgres database installed in your dev environment. Act

Flutter How to Start Android Activity from Flutter View

Flutter and Dart is an excellent combination for creating the UI, but for accessing the platform-specific service we need to open platform-specific activity. So lets in this article we will explore how to start an android activity and access the service from Flutter View. Create a Project for this Android Activity Flutter View Demo Create a Project From File menu select the New Flutter Project Enter the project name Select the AndroidX support and click on next After the above, we step click on Finish We will have the following project structure created. Create the Second Activity in Android Just go to the android folder and open it in separate windows. We will have the following project structure. Create the Activity Just right-click on the Kotlin folder and create a blank activity from the menu. If you create the activity then you may be required to upgrade the Gradle and do some import. So Just click on update and wait for the project s

Flutter Theme Creation, Programmatic Way

Flutter and Dart is an excellent combination for creating the mobile app with material design with nice GUI. Its lots of widget which help the developer for creating the app UI very fast with respect to the other language. You may face some problem in starting due to comm, curly brace and semicolon but after some time you will find the way how to work with these all stuff and it becomes very easy for you. But in this article, we are not going to discuss all these. In this article, we will handle a very interesting topic on how to create a custom theme or multiple themes and let's user decide which theme to use. Create a flutter project So let's create a flutter project by selecting the appropriate option from the File menu in android studio or Visual Code. If you are new to Flutter and Dart you can check out our recent post to get started Creating Cross-platform app using flutter . Once your project is created you will get the default counter app and you try running the app in

Flutter State Management With Provider and ChangeNotifier

Flutter state management with provider library and why it's so important? There are lots of topics in flutter which are very important but out of those state management of your flutter application is the most important and little bit complicated as well. So in this article, I will try to explain how to use the provider package for managing the state of flutter and dart application and how to access the data down the hierarchy of the widget tree without recreating the whole UI. Basic knowledge of the state management and data flow in the Flutter Before starting the coding I would like to explain some basics about the Flutter application so that you can understand, why it's important to manage the state of your application in the correct way. In Flutter, everything is a widget and whenever the state of your application changes the UI is recreated the UI with the new data. Let's list out the topic or problem that we are going to explore about state management. Challenge o

Flutter Page Navigation and Send data to Page

Flutter Page Navigation, If you are from the Kotlin or Java and witting the Android app using the Android Studio then you are well aware of the Activity and Fragment. But in the Flutter, there is no activity and fragment. So question is that what is alternative of this and the answer is Page/Widget. So in this article, we will explore how to navigate from one page to other pages, send and receive data to the page step by step. The Home Page of Flutter When we create the project by default we get one page created and it's defined as home. If you are new to Flutter and Dart then please check our earlier article . There is no restriction on the page definition so you can give any page as the home page. class MyApp extends StatelessWidget { // This widget is the root of your application. @override Widget build(BuildContext context) { return MaterialApp( title: 'Flutter Navigation Demo', theme: ThemeData( primarySwatch: Colors.blue, ), h

Flutter and Dart Create Dialog Widget

Flutter and Dart provide us a comman tool for developement of the mobile app for Android and IOS platform.  As mobile app developer we often required to implement the Dialog to so quick action, some alert msg and more to the user. In Simple word Dialogs are used to inform users about a task and can contain critical information, require decisions, or involve multiple tasks. So in this post we are going to explore the several type of the Dialoag and its implementation in Flutter.  Type of Dialog We have three types of dialog that Flutter and Dart SDK platform provide us. Alert Dialog -- To show some content and action input from the end-user Simple Dialog -- Its have lots customization option to show the dialog About Dialog -- Dialog to show about us with icon and text. Alert Dialog and its implementation in Flutter and Dart First of all, we are going to implement the alert dialog. If you are looking to show the dialog then I am sure you have good knowledge about the dart and flutter