Flutter Gallery is a resource to help developers evaluate and use Flutter. It is a collection of Material Design & Cupertino widgets, behaviors, and vignettes implemented with Flutter. We often get asked how one can see Flutter in action, and this gallery demonstrates what Flutter provides and how it behaves in the wild.
The Flutter Gallery targets Flutter's master channel. As such, it can take advantage of new SDK features that haven't landed in the stable channel.
If you'd like to run the Flutter Gallery, make sure to switch to the master channel first:
flutter channel master
flutter upgradeWhen you're done, use this command to return to the safety of the stable channel:
flutter channel stable
flutter upgradeFlutter Gallery has been built to support multiple platforms. This includes:
- Android
- iOS
- web
- macOS
- Linux
- Windows
An APK, macOS, Linux, and Windows builds are available for download. You can find it on the web at gallery.flutter.dev and on the Google Play Store.
You can build from source yourself for any of these platforms, though, please note desktop support must be enabled. For example, to run the app on Windows:
cd gallery/
flutter config --enable-windows-desktop
flutter pub get
flutter run -d windowsAdditionally, the UI adapts between mobile and desktop layouts regardless of the platform it runs on. This is determined based on window size as outlined in adaptive.dart.
Including a new splash animation
-
Convert your animation to a
.giffile. Ideally, use a background color of0xFF030303to ensure the animation blends into the background of the app. -
Add your new
.giffile to the assets directory underassets/splash_effects. Ensure the name follows the formatsplash_effect_$num.gif. The number should be the next number after the current largest number in the repository. -
Update the map
_effectDurationsin splash.dart to include the number of the new.gifas well as its estimated duration. The duration is used to determine how long to display the splash animation at launch.
Generating localizations
If this is the first time building the Flutter Gallery, the localized
code will not be present in the project directory. However, after running
the application for the first time, a synthetic package will be generated
containing the app's localizations through importing
package:flutter_gen/gen_l10n/.
See separate README for more details.
Generating highlighted code segments
flutter pub get
flutter pub run grinder update-code-segmentsSee separate README for more details.
-
Version bump: Bump the
pubspec.yamlversion number. This can be in a PR making a change or a separate PR. Use semantic versioning to determine which part to increment. The version number after the+should also be incremented. For example1.2.3+010203with a patch should become1.2.4+010204. -
Staging: After the version bump PR is merged, push a new version tag to master.
git pull upstream master
git tag v1.2.4 # note the v
git push upstream v1.2.4This will trigger a set of GitHub Actions workflows that will:
- Draft a GitHub release with automatically generated release notes and packaged builds (.apk, macOS, Windows, and Linux)
- Deploy the gallery to the Firebase hosted staging site
- Deploy a new Android build to the Play Store beta track
- Production: Once satisfied,
- Publish the drafted GitHub release (
Edit draft->Publish release). - Deploy the gallery to the Firebase hosted production site by running this workflow with
produsing GitHub's UI. - Promote the Play Store beta to production by running this workflow with
promote_to_productionusing GitHub's UI.
- Publish the drafted GitHub release (
More information about doing these things locally is available at go/flutter-gallery-manual-deployment.
The gallery has its own set of unit and integration tests. Flutter itself also uses it in tests. To enable breaking changes, the gallery version is pinned in two places: