Flutter Samples

Overview

Flutter Samples

You can follow me on twitter @diegoveloper

Getting Started

To build and run this project:

  1. Get Flutter here if you don't already have it
  2. Clone this repository.
  3. cd into the repo folder.
  4. run flutter run-android or flutter run-ios to build the app.

(Please note that a Mac with XCode is required to build for iOS)

IMAGE ALT TEXT

FLUTTER SAMPLES

Hello Flutter Splash screen in Flutter
Fetching & Parsing JSON data Persistent Tab bars
Collapsing Toolbar - Sliver App Bar Shared Element Transitions — Hero
ScrollController and ScrollNotification App Clone - Android Messages
Communication between widgets Animations / Foldable Page
Animations / List-Detail Animations / Circular List/
App Clone / Twitter Profile Clone Custom AppBar & SliverAppBar
Animations / Split Widgets Animations / Custom Sliver Header
Menu Navigations / Header Navigation Animations / Turn on the light
Animations / Hide my widgets Animations / Menu Exploration
App Clone / Photo Concept App Clone / Movies Concept
App Clone / Sports Store App Clone / Shoes Store
App Clone / Album Flow App Clone / Credit Cards Concept
Custom AppBar & SliverAppBar App Clone / Travel Concept Demo
Animations / Shrink Top List Animations / Neon Button
Issues
  • [Question] Disable collapsing effect on Collapsing Toolbar

    [Question] Disable collapsing effect on Collapsing Toolbar

    Hi!

    I have a question about collapsing toolbar and tab bar. Is there a way of disable collapsing eg I switch a specific tab on tab bar?

    thanks in advance

    Lockness

    opened by Stewioie 16
  • Show the drawer menu icon

    Show the drawer menu icon

    Firstly, thank you for sharing! I want to know how to show the drawer menu icon (burger icon) on the left side of appbar. File: flutter-samples/lib/appbar_sliverappbar/main_appbar_sliverappbar.dart Thanks in advance!

    opened by alfianakbar 8
  • Persistent tab is not really persistent

    Persistent tab is not really persistent

    Persistent tab is not really persisting it's view in some situations which leads to app crash when initState is called trying to init state on disposed object.

    FlutterError (setState() called after dispose(): _Page2State#faac0(lifecycle state: defunct, not mounted)

    To reproduce try to add two more tab pages and jump around randomly from tab to tab (it takes several tab changes to reproduce).

    Here's the repro code

    class MainPersistentTabBar extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return DefaultTabController(
          length: 4,
          child: Scaffold(
            appBar: AppBar(
              bottom: TabBar(
                tabs: [
                  Tab(
                    icon: Icon(Icons.directions_car),
                    text: "Non persistent",
                  ),
                  Tab(icon: Icon(Icons.directions_transit), text: "Persistent"),
                  Tab(icon: Icon(Icons.directions_bike), text: "Non Persistent"),
                  Tab(icon: Icon(Icons.directions_boat), text: "Non Persistent"),
                ],
              ),
              title: Text('Persistent Tab Demo'),
            ),
            body: TabBarView(
              children: [
                Page1(),
                Page2(),
                Text('Page 3'),
                Text('Page 4'),
              ],
            ),
          ),
        );
      }
    }
    
    opened by shaxxx 8
  • Content overlays on TabBar in CollapsingToolbar

    Content overlays on TabBar in CollapsingToolbar

    I've used your CollapsingToolbar as a example for my app but when a scroll is done, the content of the body overlays the TabBar.

    Any idea on this?

    opened by niegus 7
  • Screenshots in README.md

    Screenshots in README.md

    Hi, I think It'll be really helpful for people looking for specific implementations in flutter if you could add screenshots as well.

    Thanks

    opened by twisstosin 5
  • Follow you splash scrren blog to do,but have a problem(Android)

    Follow you splash scrren blog to do,but have a problem(Android)

    Flutter : Splash Screen

    In Android,from step 1 to 4,I did these, but have a problem is that:

    /Users/happyphper/workspace/rrcp_flutter/android/app/src/main/java/com/example/rrcp_flutter/MainActivity.java:17: error: incompatible types: MainActivity cannot be converted to FlutterEngine
        GeneratedPluginRegistrant.registerWith(this);
                                               ^
    Note: Some messages have been simplified; recompile with -Xdiags:verbose to get full output
    1 error
    
    FAILURE: Build failed with an exception.
    
    * What went wrong:
    Execution failed for task ':app:compileDebugJavaWithJavac'.
    > Compilation failed; see the compiler error output for details.
    ...
    

    I clone you project to local and All is right.

    So I compare android your directory to my directory,

    I find a android/app/src/main/AndroidManifest.xml and android/app/build.gradle are different, the difference is that

    # AndroidManifest.xml
    ...
            <!-- Don't delete the meta-data below.
                 This is used by the Flutter tool to generate GeneratedPluginRegistrant.java -->
            <meta-data
                android:name="flutterEmbedding"
                android:value="2" />
    ...
    
    # build.gradle
    ...
    ...
    apply plugin: 'com.android.application'
    + apply plugin: 'kotlin-android'
    apply from: "$flutterRoot/packages/flutter_tools/gradle/flutter.gradle"
    ...
    dependencies {
    + implementation "org.jetbrains.kotlin:kotlin-stdlib-jdk7:$kotlin_version"
        ...
    }
    ...
    

    this is flutter auto created, maybe the result is different version.

    put this code to your project, and the error occurred.

    I can't solve this problem, Could you have any solution?

    My Flutter version.

    [✓] Flutter (Channel master, v1.15.4-pre.82, on Mac OS X 10.15.3 19D76, locale en-CN)
        • Flutter version 1.15.4-pre.82 at /usr/local/flutter
        • Framework revision e481fcae52 (32 hours ago), 2020-02-14 22:34:30 -0800
        • Engine revision d60f298d9e
        • Dart version 2.8.0 (build 2.8.0-dev.9.0 edd64e6d5c)
    
     
    [✓] Android toolchain - develop for Android devices (Android SDK version 29.0.2)
        • Android SDK at /Users/wangbaolong/Library/Android/sdk
        • Android NDK location not configured (optional; useful for native profiling support)
        • Platform android-29, build-tools 29.0.2
        • Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java
        • Java version OpenJDK Runtime Environment (build 1.8.0_202-release-1483-b49-5587405)
        • All Android licenses accepted.
    
    [✓] Xcode - develop for iOS and macOS (Xcode 11.3.1)
        • Xcode at /Applications/Xcode.app/Contents/Developer
        • Xcode 11.3.1, Build version 11C504
        • CocoaPods version 1.8.4
    
    [✓] Chrome - develop for the web
        • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome
    
    [✓] Android Studio (version 3.5)
        • Android Studio at /Applications/Android Studio.app/Contents
        • Flutter plugin version 41.0.2
        • Dart plugin version 191.8593
        • Java version OpenJDK Runtime Environment (build 1.8.0_202-release-1483-b49-5587405)
    
    [✓] VS Code (version 1.42.1)
        • VS Code at /Applications/Visual Studio Code.app/Contents
        • Flutter extension version 3.8.1
    
    [✓] Connected device (3 available)
        • Android SDK built for x86 64 • emulator-5556 • android-x64    • Android 10 (API 29) (emulator)
        • Chrome                       • chrome        • web-javascript • Google Chrome 79.0.3945.130
        • Web Server                   • web-server    • web-javascript • Flutter Tools
    
    opened by happyphper 4
  • I use your circular_list and i have a question

    I use your circular_list and i have a question

    Hi, I use your circular_list and i would like to open a new route when i click on images, i tried many things but didn't work, i would really appreciate it if u can lend me a hand.

    ps: sorry my english is sooo poor x'(

    opened by Yuiie 4
  • How to use future builder inside silverlist;

    How to use future builder inside silverlist;

    SliverList( delegate: SliverChildBuilderDelegate((_, index) { final song = songs[index % songs.length]; return ListTile( leading: Image.network( song.image, height: 30, fit: BoxFit.cover, ), title: Text( song.title, ), trailing: IconButton( onPressed: () => null, icon: Icon( Icons.add, color: Colors.pinkAccent, ), ), ); }, childCount: 20), ),

    inside this one,got it from your file

    opened by atta1234 4
  • Licensing

    Licensing

    Could you please let me know what kind of licensing you are planning to set this up with?

    Very nice work!! thanks.

    opened by shriharip 3
  • fixed main_split_image.dart's error

    fixed main_split_image.dart's error

    Fixed this error on build:" error: The function expression type 'Future Function(Uint8List, {int cacheHeight, int cacheWidth})' isn't of type 'Future Function(Uint8List, {bool allowUpscaling, int cacheHeight, int cacheWidth})'. This means its parameter or return type doesn't match what is expected. Consider changing parameter type(s) or the returned type(s). (invalid_cast_function_expr at [flutter_samples] lib/split_image/main_split_image.dart:20)"

    It was missing the bool allowupscaling parameter. I have added that, and now its working just fine.

    Screenshot from 2020-10-02 14-02-04

    opened by rushikesh127001 3
  • I can not run on my iOS device

    I can not run on my iOS device

    When I use " flutter run" ,I got the error as follows:

    Launching lib/main.dart on Ace in debug mode... Automatically signing iOS for device deployment using specified development team in Xcode project: YPGH95V8AL Running pod install... 1,372ms Running Xcode build...
    Xcode build done. 4.4s Failed to build iOS app Error output from Xcode build: ↳ 2021-07-29 17:37:37.812 xcodebuild[17585:369397] [MT] PluginLoading: Required plug-in compatibility UUID F56A1938-53DE-493D-9D64-87EE6C415E4D for plug-in at path '~/Library/Application Support/Developer/Shared/Xcode/Plug-ins/VVDocumenter-Xcode.xcplugin' not present in DVTPlugInCompatibilityUUIDs 2021-07-29 17:37:38.502 xcodebuild[17585:369500] DVTAssertions: Warning in /Library/Caches/com.apple.xbs/Sources/DVTiOSFrameworks/DVTiOSFrameworks-18108/DTDeviceKitBase/DTDKRemoteDeviceData.m:371 Details: (null) deviceType from 94de9a9a80dc218095a7f7b77686a7ad392521c1 was NULL when -platform called. Object: <DTDKMobileDeviceToken: 0x7fc8647ec510> Method: -platform Thread: <NSThread: 0x7fc860a0eb10>{number = 7, name = (null)} Please file a bug at https://feedbackassistant.apple.com with this warning message and any useful information you can provide. 2021-07-29 17:37:38.641 xcodebuild[17585:369503] DVTAssertions: Warning in /Library/Caches/com.apple.xbs/Sources/DVTiOSFrameworks/DVTiOSFrameworks-18108/DTDeviceKitBase/DTDKRemoteDeviceData.m:371 Details: (null) deviceType from 94de9a9a80dc218095a7f7b77686a7ad392521c1 was NULL when -platform called. Object: <DTDKMobileDeviceToken: 0x7fc8647ec510> Method: -platform Thread: <NSThread: 0x7fc860f183b0>{number = 9, name = (null)} Please file a bug at https://feedbackassistant.apple.com with this warning message and any useful information you can provide. 2021-07-29 17:37:38.716 xcodebuild[17585:369503] DVTAssertions: Warning in /Library/Caches/com.apple.xbs/Sources/DVTiOSFrameworks/DVTiOSFrameworks-18108/DTDeviceKitBase/DTDKRemoteDeviceData.m:371 Details: (null) deviceType from 94de9a9a80dc218095a7f7b77686a7ad392521c1 was NULL when -platform called. Object: <DTDKMobileDeviceToken: 0x7fc8647ec510> Method: -platform Thread: <NSThread: 0x7fc860f183b0>{number = 9, name = (null)} Please file a bug at https://feedbackassistant.apple.com with this warning message and any useful information you can provide. ** BUILD FAILED **

    Xcode's output: ↳ note: Using new build system note: Building targets in parallel note: Planning build note: Analyzing workspace note: Constructing build description note: Build preparation complete /Users/cheshuangchun/Downloads/flutter-samples-master/ios/Pods/Pods.xcodeproj: warning: The iOS deployment target 'IPHONEOS_DEPLOYMENT_TARGET' is set to 8.0, but the range of supported deployment target versions is 9.0 to 14.5.99. (in target 'Flutter' from project 'Pods') /Users/cheshuangchun/Downloads/flutter-samples-master/ios/Pods/Pods.xcodeproj: warning: The iOS deployment target 'IPHONEOS_DEPLOYMENT_TARGET' is set to 4.3, but the range of supported deployment target versions is 9.0 to 14.5.99. (in target 'FMDB' from project 'Pods') error: No profiles for 'com.teamgo.sample.flutter-samples' were found: Xcode couldn't find any iOS App Development provisioning profiles matching 'com.teamgo.sample.flutter-samples'. Automatic signing is disabled and unable to generate a profile. To enable automatic signing, pass -allowProvisioningUpdates to xcodebuild. (in target 'Runner' from project 'Runner')

    Could not build the precompiled application for the device.

    Error launching application on Ace.

    please help me,thank you very much!

    opened by cheshuangchun 0
Owner
Diego Velásquez López
Mobile Software Architect
Diego Velásquez López
Create a Flutter User Profile Page UI where you can access and edit your user's information within your Flutter app.

Flutter Tutorial - User Profile Page UI #2 Create a Flutter User Profile Page UI where you can access and edit your user's information within your Flu

Johannes Milke 13 Nov 9, 2021
Let's create a selectable Flutter Navigation Drawer with routing that highlights the current item within the Flutter Sidebar Menu.

Flutter Tutorial - Sidebar Menu & Selectable Navigation Drawer Let's create a selectable Flutter Navigation Drawer with routing that highlights the cu

Johannes Milke 8 Oct 31, 2021
Components that optimize Flutter fluency.(Flutter 流畅度优化的通用方案,轻松解决卡顿问题)

Flutter fluency optimization component "Keframe" Page switching fluency improved: How to use Project depend on: Quick learning Constructor Description

Ke Technologies 436 Nov 26, 2021
Challenge yourself every weekend with flutter. Join me to implement challenging UI & digital designs using Flutter.

Weekend With Flutter This is my new challenge. Every weekend, I want to implement challenging UI & digital designs using Flutter. you can join me with

Payam Zahedi 16 Nov 8, 2021
Let's create a complete Flutter User Profile Page with SharedPreferences to persist the user's information in Flutter.

Flutter Tutorial - User Profile & SharedPreferences Let's create a complete Flutter User Profile Page with SharedPreferences to persist the user's inf

Johannes Milke 9 Oct 9, 2021
Let's create a Flutter Collapsible Sidebar Menu that can collapse and expand the Navigation Drawer in Flutter.

Flutter Tutorial - Collapsible Sidebar Menu & Navigation Drawer Let's create a Flutter Collapsible Sidebar Menu that can collapse and expand the Navig

Johannes Milke 10 Oct 30, 2021
🚗 Apple CarPlay for Flutter Apps. Aims to make it safe to use apps made with Flutter in the car by integrating with CarPlay.

CarPlay with Flutter ?? Flutter Apps now on Apple CarPlay! flutter_carplay aims to make it safe to use iPhone apps made with Flutter in the car by int

Oğuzhan Atalay 82 Nov 20, 2021
A quick sample app on how to implement a friend list and a profile page in Flutter.

FlutterMates All code resides in the /lib folder: there's no Android / iOS specific code needed. The article, slides and how this came to be, is here.

Codemate Ltd 480 Nov 15, 2021
A weather app built to learn how to use Canvas and Animation in Flutter.

Weather Quick Disclaimer I removed my private OpenWeather API key from the repo, if you want to get the weather forecast use your own in the openweath

Alessandro Aime 141 Oct 28, 2021
TodoMVC for Flutter

flutter_architecture_samples TodoMVC for Flutter! Flutter provides a lot of flexibility in deciding how to organize and architect your apps. While thi

Brian Egan 7.5k Dec 2, 2021
🍝 restaurant menu app made with flutter inspired by this design https://goo.gl/jChLBV

Menu Flutter Todo Make background colors that changes with PageView Add custom tab indicators Change food prices Make cart animation Customize card sh

Braulio Cassule 551 Nov 30, 2021
Flutter UI Challenges

FLUTTER UI CHALLENGE Put your Flutter experience to test with these UI Challenges. ⚠️ Contributions must be made in this repository. ⚠️ Levels: Beginn

Tomi Alagbe 1.3k Nov 21, 2021
A Flutter widget to create an iOS settings-table (static TableView).

flutter_cupertino_settings A Flutter widget to create an iOS settings-table (static TableView). import 'package:flutter_cupertino_settings/flutter_cup

Matthias Rupp 216 Nov 29, 2021
A music player component for Flutter (i.e. Spotify, Apple Music, etc.) [AGPL/example/no longer maintaining]

This is an example I currently have no plans of putting this on Pub. Originally, I did, but I lost interest. However, I think this is a good example,

Tobe Osakwe 205 Oct 28, 2021
https://dribbble.com/shots/3812962-iPhone-X-Todo-Concept Made With Flutter

?? FlutterTodo ?? Install Note: Make sure your Flutter environment is setup. In the command terminal, run the following commands: $ git clone https://

Marc L. 516 Nov 25, 2021
Flutter app for collection of UI in a UIKit

Flutter UIKit The goal of this project is to provide an ultimate collection of real world app's UIs. While I built Flutter UIKit for my own needs, it

Pawan Kumar 5.7k Nov 23, 2021
A Flutter project of book app UI

Book App Flutter A Flutter project of book app UI from prototype originally by Travis. Video Tutorial You can find the video tutorial of this project

Ardiansyah Putra 300 Nov 22, 2021
Login page built with @flutter 😍

The Gorgeous Login A login page built with flutter inspired by a design found on Uplabs Uplabs design Flutter rendering Contributors Code Contributors

Hugo EXTRAT 1.5k Nov 30, 2021