• custome-appbar-flutter
    Flutter - Tutorials

    Custom Appbar With Profile Details In Flutter

    June 2, 2021 - By 

    Hello guys, In this article we are going to see how to implement custom appbar with profile details inside it. Taken the reference from the Stack Overflow, where they discussing about the custom App Bar in flutter. So finding the solution for the same. First of all we have to add App Bar inside Scaffold widgets which takes title In Text Widget form as given below. title: Text( 'Dashboard', style: TextStyle( fontSize: 17, color: Colors.white, letterSpacing: 0.53), ), Then we have to give rounded shape to app bar as given below. shape: RoundedRectangleBorder( borderRadius: BorderRadius.vertical( bottom: Radius.circular(30), ), ), Then…

  • Flutter - Tutorials

    7 Reasons Why To Use Flutter?

    May 15, 2021 - By 

    What is Flutter? Flutter is Google’s UI toolkit for building beautiful, natively compiled applications for mobile, web, and desktop from a single codebase. You can also embed Flutter! Let’s see the reasons why to use flutter. Fast Development Stateful hot reload allows you to change your code and see it come to life is less than a second without losing the state of the app. Flutter also ships with a rich set of customizable widgets, all built from modem reactive framework. Expressive + Flexible UI Flutter moves to a widget, rendering, animation and gestures into this framework to give you…

  • Flutter - Tutorials

    Flutter Counter – Bloc Pattern

    April 15, 2021 - By 

    In this article, we are going to build counter app using bloc pattern. First of all create the new project called flutter_counter. Now open pubspec.yaml file and replace with below code. And then install all of our dependencies by clicking on flutter packages get Project Structure The application uses a feature driven directory structure. This type of project structures enables us to scale the project by having self contained feature. This application is only have single feature but another application may have multiple complex features. BlockObserver To observe all state changes in the application we have to create BlocObserver ab…

  • Flutter - Tutorials

    Text To Speech Converter Using Flutter

    July 14, 2020 - By 

    Hello guys, Today we are going to develop application that convert text to speech using flutter. For this we are going to use Flutter tts package. You can get more information about this package in following link. Text To Speech For video tutorial you can go through this. First you have to add dependency of tts into pubspec.yaml as below dependencies: flutter: sdk: flutter # The following adds the Cupertino Icons font to your application. # Use with the CupertinoIcons class for iOS style icons. cupertino_icons: ^0.1.3 flutter_tts: ^1.2.6 # add this line Now for android you have to change…

  • Flutter - Tutorials

    Navigation Drawer (Sidebar) Using Flutter

    July 12, 2020 - By 

    Hello guys, Today we are going to learn how to implement navigation drawer or side bar using Flutter. In this article we are implementing basic side bar, in upcoming articles we are going to learn material sidebar. So let’s get started. First, create new flutter project and then create main class SideBar and call inside main method. The code is given below. import 'package:flutter/material.dart'; void main() => runApp(SideBar()); class SideBar extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( debugShowCheckedModeBanner: false, home: HomePage(), ); } } Now, we can see in home we are calling object of HomePage class.…

  • Flutter - Tutorials

    List Builder In Flutter

    July 11, 2020 - By 

    Hello guys, Today we are going to learn how to implement ListView.builder() in flutter. As we know that in android developement when we have list of items and required to list out in screen we are using adapter for that purpose, similar manner in flutter we can use ListView.builder(), using which we can use list out list of item in custom designed block. So let’s get started… First create the new flutter project and then in main.dart file code as below for main screen as below. import 'package:flutter/material.dart'; void main() => runApp(MyApp()); class MyApp extends StatelessWidget { @override Widget build(BuildContext context) {…

  • Flutter - Tutorials

    Simple Calculator Using Flutter

    July 8, 2020 - By 

    In this article, we are going to learn how to make simple Calculator android and ios application using flutter. For this purpose we are using two library which are given below. material.dart math_expressions.dart First library is used in any flutter application for GUI purpose, and second one is used for maths expression solve. In pubspec.yaml file you have to add following library. dependencies: flutter: sdk: flutter # The following adds the Cupertino Icons font to your application. # Use with the CupertinoIcons class for iOS style icons. cupertino_icons: ^0.1.3 math_expressions: ^2.0.0 Now click on pub upgrade on upper side. For…