Learn Flutter

A widget is an immutable description of part of the UI. Flutter turns the widget tree into a longer-lived element tree and a render tree; when you call setState, only the widgets that describe the changed subtree are rebuilt and the elements decide what actually needs to be updated on screen.

Most everyday Flutter errors are the layout contract being broken: a child that is too big for a Row or Column (RenderFlex overflowed), a scrollable or text field that was given no limit (unbounded height/width), or a widget like Expanded placed under the wrong parent. The remaining classics, setState called during build and RenderBox was not laid out, are a side effect in build() and a symptom of an earlier error respectively. Read the first error in the console, give the widget a constraint, and the rest usually disappears.

Flutter lays out the tree in one pass: every parent hands its children a BoxConstraints (min/max width and height), each child picks a size inside those limits and reports it back, and the parent then decides where to place the child. Memorise it as 'constraints go down, sizes go up, parent sets position'.

Flutter is declarative: the UI is a function of state, so instead of mutating widgets you change the data and let the affected widgets rebuild. Keep state that only one widget cares about in a StatefulWidget; lift state that several screens share above them, expose it through an InheritedWidget (or a package that wraps one), and notify listeners with ChangeNotifier so only dependent widgets rebuild.

Navigator keeps a stack of Route objects; Navigator.push adds a route built from a widget (usually via MaterialPageRoute) and Navigator.pop removes the top one, optionally handing a result back to the Future that push returned. For URL-driven apps and deep links, switch to the Router API through a package such as go_router instead of named routes.

Use package:http to send a request, await the Future<Response>, check the status code, decode the body with jsonDecode and turn the resulting map into a typed model through a fromJson constructor. Kick the request off once (not in build), hand the Future to a FutureBuilder to show loading, error and data states, and move decoding of very large payloads onto a background isolate with compute.

Wrap your fields in a Form, give it a GlobalKey<FormState>, and put a validator on each TextFormField. On submit, call formKey.currentState!.validate(): it runs every validator, shows the returned error strings under the fields, and returns true only when all of them returned null.

Reach for an implicit animation first: give AnimatedContainer, AnimatedOpacity or TweenAnimationBuilder a duration and a new target value, and the widget animates there on its own. Use an explicit AnimationController with Tweens and AnimatedBuilder when you must start, stop, reverse or repeat the motion yourself.

Flutter is fast by default; jank comes from doing more work per frame than the ~16 ms budget allows. Keep build() cheap and scoped (const widgets, small StatefulWidgets, lazy lists), avoid saveLayer-triggering effects such as Opacity and clipping in animations, and measure in profile mode on a real device with the DevTools Performance view before changing anything.

Flutter has three test levels: unit tests (package:test) for plain Dart logic, widget tests (flutter_test: testWidgets, WidgetTester, find, matchers) that build real widgets in a fast headless environment, and integration tests (integration_test) that drive the whole app on a device. Write many of the first two and a few of the third.

A platform channel is a named, asynchronous message pipe between your Dart code and the host platform (Kotlin/Java on Android, Swift/Objective-C on iOS and macOS, C++ on Windows, C on Linux). MethodChannel sends a method name plus arguments and gets a single result back; EventChannel streams events from the host to Dart.

Flutter builds a semantics tree next to the render tree and hands it to the platform's assistive technologies (TalkBack, VoiceOver, screen readers on web and desktop). Material widgets fill it in for you; you customize it with Semantics, MergeSemantics and ExcludeSemantics, respect the user's text scale through MediaQuery.textScalerOf, keep contrast and tap targets within the recommended minimums, and check all of it in widget tests with the Accessibility Guideline API.

flutter run gives you a debug build with hot reload; flutter build produces a release build (AOT-compiled, minified) packaged for one platform: an Android app bundle or APK, an iOS .ipa, or a build/web folder. Before shipping you configure signing (a keystore referenced from key.properties on Android, your Apple team in Xcode on iOS) and bump the version in pubspec.yaml.