KindaCode

Flutter

Flutter and Dart tutorials, tips & tricks

Working with the Switch widget in Flutter

Updated: Jan 25, 2023

The Switch widget is used to turn on or off a single setting. TLDR In the vast majority of cases, you will implement a switch like this: Switch( value: _myValue, // a boolean variable onChanged: (_) { ......

Flutter: Detect platform your app is running on

Updated: Jan 25, 2023

To detect the platform (or OS) your Flutter app is running on, just import dart:io and use the Platform class and its operatingSystem property (String). Example 1 import 'dart:io'; import 'package:flutter/material.dart'; void......

Flutter error: setState() called after dispose()

Updated: Jan 25, 2023

This article is about a common error that you might encounter when building apps with Flutter. The Problem When working with Flutter, you may face this error: Unhandled Exception: setState() called after dispose() More......

Flutter: Prevent Soft Keyboard from covering TextField

Updated: Jan 25, 2023

To prevent the soft keyboard from covering your TextField while the user is typing, you can wrap your main widget with SingleChildScrollView. Example Before using SingleChildScrollView: Column(children: [ ......

How to implement a horizontal GridView in Flutter

Updated: Jan 25, 2023

In order to make a horizontal GridView in Flutter, just set its scrollDirection property to Axis.horizontal, like this: GridView( scrollDirection: Axis.horizontal, gridDelegate: SliverGridDelegateWithMaxCrossAxisExtent( ......

Creating Masonry Layout in Flutter with Staggered Grid View

Updated: Jan 25, 2023

In the web and mobile development world, masonry layout is useful when we want to display a grid of items whose sizes are not the same. One axis uses a strict grid layout, most often columns. On the other axis, items have different......

How to check Type of a Variable in Flutter

Updated: Jan 18, 2023

To check the type of a variable in Flutter and Dart, you can use the runtimeType property. Example The code: void main(){ var a = 'Apple'; var b = 100; var c = [1, 2, 3, 4, 5]; var d = { "name": "John Doe", ......

Flutter: Change the AppBar title dynamically

Updated: Jan 18, 2023

The example below is about changing the AppBar title dynamically in Flutter. App Preview The demo app we’re going to make has an app bar and a text field. When you enter text in the text field, the title of the app bar will......

Working with Time Picker in Flutter (updated)

Updated: Jan 18, 2023

This is a deep dive into time pickers in Flutter. We will explore the showTimePicker function, its parameters, and how to handle the returned result. Next, we will study an example of how to implement a time picker with a default......

Flutter CupertinoSliverNavigationBar: Tutorial & Example

Updated: Jan 14, 2023

This article is about CupertinoSliverNavigationBar in Flutter. We’ll have a glance at the fundamentals of the widget and then walk through a complete example of implementing it in practice. Overview This iOS-style sliver......

Flutter: Making a Dropdown Multiselect with Checkboxes

Updated: Jan 14, 2023

This article shows you 2 different ways to implement a dropdown multi-select with checkboxes in Flutter. In the first approach, we will build the multi-select from scratch. In the second approach, we will get the job done quickly by......