A collection of simple, bare-bones Flutter apps that each demonstrate a concept

Overview

flutter-by-example

A collection of simple, bare-bones Flutter apps that each demonstrate a concept

The apps are slowly being updated to Dart 2; be sure to use the --preview-dart-2 flag when running/compiling these examples

Apps

  1. Hello World: one-line Flutter app Updated for Dart 2
  2. Material Navigation: two screen Flutter that demonstrates navigation using Material
    • (2.1) Routing with data: passing data between navigation routes
  3. TextField: example of a simple single-line text field and a multi-line text field with a submit button
  4. HTTP: fetching text and images over http
  5. Layouts: example widget Layouts
  6. Lists: example list view
    • (6.1) Dynamic lists: create a dynamic (infinite) list with dividers
  7. Stacks: how to render widgets at set positions in a stack
  8. Inherited Widgets: how to use inherited widgets to pass data down a widget tree
  9. i18n: simple example of i18n support in Flutter
  10. Driver Testing: a simple demonstration driver test
  11. JSON Parsing: parses a JSON network response
  12. Streams: handle state updates using streams
    • (12.1) StreamBuilder: handle state updates using StreamBuilder
    • (12.2) RxDart: handle state updates using StreamBuilder with Observables
    • (12.3) JSON with Streams: HTTP and JSON parsing using streams
  13. Bottom Nav Bar: Simple bottom nav bar implementation, using Stack and OffStage
  14. Custom Painter: implements a basic bar chart using a custom painter
  15. Tabs: tabbed pages demo

Flutter Docs

For help getting started with Flutter, view Flutter's online documentation.

You might also like...

An app to help students and teachers connect each other.

korek An app to help students and teachers connect each other. Technologies: Project is created with: React.JS (Typescript) Express (Typescript) Flutt

Jan 10, 2022

The application helps the patient to follow up on medication schedules, and each patient has his own profile. The application is connected to Bluetooth to help the patient's dependents follow up on the patient.

spoon_medicines A new Flutter application. Getting Started This project is a starting point for a Flutter application. A few resources to get you star

Nov 27, 2021

NETCoreSync is a database synchronization framework where each client's local offline database

NETCoreSync NETCoreSync is a database synchronization framework where each client's local offline database (on each client's multiple devices) can be

Oct 31, 2022

Flutter Car Store App Concept

Flutter Car Store App Concept

๐Ÿ”ฅ ๐Ÿ”ฅ Car Store App Flow ๐Ÿ”ฅ ๐Ÿ”ฅ ๐Ÿ’ซ โญ๏ธ โญ๏ธ ๐Ÿ‘จโ€๐Ÿ’ป Car store app flow based on a design on Dribbble ๐Ÿ’“ . Complete flutter projects are available on my Code

Dec 12, 2022

:lock: this is flutter mobile application music using glass morphism concept

:lock: this is flutter mobile application music using glass morphism concept

Flutter Glass Morphism ๐Ÿ’ Description: This is source flutter using glass morphism concept How I can run it? ๐Ÿš€ Clone this repo ๐Ÿš€ Run below code in t

Jan 19, 2022

Flutter representation of a Crypto app Concept

Flutter representation of a Crypto app Concept

๐Ÿ”ฅ ๐Ÿ”ฅ Flutter Cryptocurrency app Concept Flutter representation of a Crypto app Concept from Uplabs. Star โญ the repo if you like what you see ๐Ÿ˜‰ . Ima

Dec 29, 2022

Plantly: buy plants. A concept app that I made with Flutter

Plantly: buy plants.  A concept app that I made with Flutter

Plantly: buy plants. A concept app that I made with Flutter, inspired by this: Wanna try it? Here's the Play store link: Plantly. Final result Screens

Dec 13, 2022

Pet Adoption App concept built with Flutter inspired by Aman UX

Pet Adoption App concept built with Flutter inspired by Aman UX

๐Ÿถ Adopt Me ๐Ÿน Pet Adoption App concept built with Flutter inspired by Aman UX.

Dec 8, 2022

A collection of Flutter examples and demos.

Flutter samples A collection of open source samples that illustrate best practices for Flutter. Visual samples index The easiest way to browse through

Jan 7, 2023
Comments
  • Bottom Nav Bar does not show if there are four or more items

    Bottom Nav Bar does not show if there are four or more items

    Trying out this example:

    https://github.com/mjohnsullivan/flutter-by-example/tree/master/13_bottom_nav_bar

    When I add in two more BottomNavigationBarItem to four, the bottom navigation bar does not display on the screen but you can still tap on it to navigate through the various Offstage widget.

    bug 
    opened by jaxondu 2
  • Any advice or idea how to make one of the panel go up?

    Any advice or idea how to make one of the panel go up?

    I'm trying to implement this feature, but got stuck here. If you could just maybe point me to a couple of lines of code and what to do with them.

    https://imgur.com/EumaW82 https://imgur.com/0aNY9xk

    As you can see the panel goes up to show the cart when the arrow is clicked.

    opened by Hamza-Imran75 0
  • Backdrop: Layout Issues with front Panel on iPhone X

    Backdrop: Layout Issues with front Panel on iPhone X

    When I set frontPanelOpenHeight to 0 so that the closed front Panel takes up the whole space I get some Layout Issues on iPhone X. The bottom part of the screen isn't used by the front Panel Bildschirmfoto 2019-04-19 um 23 29 27

    I don't have this problem on an iPhone 8 so it has definitely something to do with the "home button" of the iPhone X. Could someone help?

    opened by leondroidgeeks 0
  • Just have a question about StreamBuilder

    Just have a question about StreamBuilder

    Hi John, I watched your presentation on Google I/O 2018 about Reactive with Flutter. About StreamBuilder, do this make the ui rebuilt even just Navigates to another screen?

    I download the Cart Bloc source code from Filiph Github, and put print statement inside StreamBuilder function of Cart Count, and if i navigate to Shopping Cart Screen, It rebuilds the Cart Count Widget.

    Please take a look on image below jun-04-2018 14-59-06

    question 
    opened by penjual 1
Owner
Matt Sullivan
Matt Sullivan
A simple app to demonstrate a testable, maintainable, and scalable architecture for flutter

A simple app to demonstrate a testable, maintainable, and scalable architecture for flutter. flutter_bloc, hive, and REST API are some of the tech stacks used in this project.

Elias Andualem 139 Dec 28, 2022
DoneIt is a sample note app ๐Ÿ“ Flutter application ๐Ÿ“ฑ built to demonstrate use of Clean Architecture tools. Dedicated to all Flutter Developers with โค๏ธ.

DoneIt ?? DoneIt is a sample note app ?? Flutter application ?? built to demonstrate use of Clean Architecture tools. Dedicated to all Flutter Develop

Shubham Chhimpa 175 Dec 24, 2022
Caching with flutter riverpod and looking into future providers. Example to demonstrate stale while revalidate pattern.

FLUTTER SWR EXAMPLE Test stale-while-revalidate pattern with riverpod. Look; query_provider package Backend calls are made with ghibli-api Tested Prov

Dipesh Dulal 7 Jun 30, 2022
Sample app to demonstrate the integration and working of Dyte SDK for mobile, using Flutter.

Flutter Sample App by dyte Sample App to demonstrate Dyte SDK in flutter Explore the docs ยป View Demo ยท Report Bug ยท Request Feature Table of Contents

Dyte 12 Jan 1, 2023
Super easy mood tracking app to demonstrate use of the Firebase Local Emulator Suite

Mood Tracker Example App in Flutter This is a simple example app showing how to use Cloud Functions and the Firebase Local Emulator inside a Flutter a

Andrea Bizzotto 8 Oct 14, 2022
An example project to demonstrate how moor can be used on multiple platforms

moor_shared An example project to demonstrate how moor can be used on multiple p

null 0 Dec 28, 2021
๐Ÿ”ฅ A collection of Firebase plugins for Flutter apps.

FlutterFire FlutterFire is a set of Flutter plugins that enable Flutter apps to use Firebase services. You can follow an example that shows how to use

null 7.4k Dec 31, 2022
Developed a Group chat application using Flutter and Firebase, where users can register and create groups or join already existing groups and start conversing with each other.

GroupChatApp About Developed a Group chat application using Flutter and Firebase, where users can register and create groups or join already existing

Ahmed Gulab Khan 221 Dec 1, 2022
Flutter Andriod app to track cases in each country for Corona Virus Covid-19

corova_virus_app Flutter Andriod app to track cases in each country for Corona Virus Covid-19 app support historical data/dark mode/search by country/

null 21 Mar 5, 2022
Dig is a hub blockchain that interconnects physical plots of land, which will each be governed by a locally operated blockchain.

Dig is a hub blockchain that interconnects physical plots of land, which will each be governed by a locally operated blockchain. Due to the regulatory challenges involved, dig splits itself up into many chains which can each follow appropriate legislation. This is the beginning of the "Dig Network."

notional-labs 183 Dec 17, 2022