gskinnerteam / flutter_vignettes Goto Github PK
View Code? Open in Web Editor NEWA collection of fun Flutter experiments, created by gskinner, in partnership with Google.
Home Page: https://flutter.gskinner.com
License: MIT License
A collection of fun Flutter experiments, created by gskinner, in partnership with Google.
Home Page: https://flutter.gskinner.com
License: MIT License
I want to change the icons of the nav bar (i'm new to flutter), as you used path/canvas to create icons. my question is how to convert images/icons into path/canvas code as:
ui.Path()..addRRect(RRect.fromLTRBXY(-12, -12, -2, -2, 2, 2)),
ui.Path()..addRRect(RRect.fromLTRBXY(2, -12, 12, -2, 2, 2)),
ui.Path()..addRRect(RRect.fromLTRBXY(-12, 2, -2, 12, 2, 2)),
ui.Path()..addRRect(RRect.fromLTRBXY(2, 2, 12, 12, 2, 2)),
how to convert images/icons to above code, or how to add images/icons instead of defining path/canvas (custom painting)
For validation and progress code is overly engineered and not easy to follow, dips into dynamic typing as well which is a bit messy.
Steps to reproduce:
flight_barcode.dart
and add a FlatButton like follows:FlatButton(
child: Text("Button"),
onPressed: () => print("button works"),
)
The onTap function doesnt trigger. The card keeps folding.
Tween(begin: 0.5, end: 0.0).chain(CurveTween(curve: ElasticOutCurve(0.65))).chain(Tween(begin: 0.0, end: 0.5)),
this tween came from the basketball_ptr
When using impeller rendering engine with the "Sparkle Party" vignette many of the particles are squares when they should be sparkles.
This vignette uses the ImageShader
and drawVertices
method backed by a spritesheet PNG.
https://github.com/gskinnerTeam/flutter_vignettes/blob/master/vignettes/sparkle_party/lib/particlefx/particle_fx_painter.dart
https://github.com/gskinnerTeam/flutter_vignettes/blob/master/vignettes/sparkle_party/assets/sparkleparty_spritesheet_2.png
Legacy
Impeller
Currently running on chrome for web version
Flutter 1.13.6 • channel beta • https://github.com/flutter/flutter.git
Framework • revision 659dc8129d (3 weeks ago) • 2019-12-30 09:24:47 -0800
Engine • revision bdc9708d23
Tools • Dart 2.8.0 (build 2.8.0-dev.0.0 c547f5d933)
I get the following error message while running fluid nav bar vignette.
PS C:\flutter_vignettes-master\vignettes\fluid_nav_bar> flutter run -d chrome
Launching lib\main.dart on Chrome in debug mode...
Building application for the web... 16.2s
Attempting to connect to browser instance.. 8.9s
Warning: Flutter's support for web development is not stable yet and hasn't
been thoroughly tested in production environments.
For more information see https://flutter.dev/web
�🔥 To hot restart changes while running, press "r". To hot restart (and refresh the browser), press "R
For a more detailed help message, press "h". To quit, press "q".
Debug service listening on ws://127.0.0.1:60004/tTluwoPMk80=
══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════
The following UnimplementedError was thrown during paint():
UnimplementedError
The relevant error-causing widget was:
CustomPaint org-dartlang-app:///packages/fluid_nav_bar/fluid_icon.dart:26:12
When the exception was thrown, this was the stack:
package:build_web_compilers/src/dev_compiler/C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/_internal/js_dev_runtime/private/ddc_runtime/errors.dart 196:49 throw_
package:build_web_compilers/src/dev_compiler/C:/b/s/w/ir/cache/builder/src/out/host_debug/flutter_web_sdk/lib/_engine/engine/surface/path_metrics.dart
131:7 extractPath
package:shared/ui/path_util.dart 23:23
extractPartialPath
package:fluid_nav_bar/fluid_icon.dart 72:25
paint
package:flutter/src/rendering/custom_paint.dart 531:12
[_paintWithPainter]
package:flutter/src/rendering/custom_paint.dart 572:7
paint
package:flutter/src/rendering/object.dart 2262:7
[_paintWithContext]
package:flutter/src/rendering/object.dart 184:12
paintChild
package:flutter/src/rendering/shifted_box.dart 70:14
paint
package:flutter/src/rendering/object.dart 2262:7
[_paintWithContext]
package:flutter/src/rendering/object.dart 184:12
paintChild
package:flutter/src/rendering/proxy_box.dart 128:14
paint
package:flutter/src/rendering/proxy_box.dart 2032:11
paint
package:flutter/src/rendering/object.dart 2262:7
[_paintWithContext]
package:flutter/src/rendering/object.dart 184:12
paintChild
package:flutter/src/rendering/proxy_box.dart 128:14
paint
package:flutter/src/rendering/object.dart 2262:7
[_paintWithContext]
package:flutter/src/rendering/object.dart 184:12
paintChild
package:flutter/src/rendering/shifted_box.dart 70:14
paint
package:flutter/src/rendering/object.dart 2262:7
[_paintWithContext]
package:flutter/src/rendering/object.dart 184:12
paintChild
package:flutter/src/rendering/proxy_box.dart 128:14
paint
package:flutter/src/rendering/proxy_box.dart 2236:15
paint
package:flutter/src/rendering/object.dart 2262:7
[_paintWithContext]
package:flutter/src/rendering/object.dart 184:12
paintChild
package:flutter/src/rendering/shifted_box.dart 70:14
paint
package:flutter/src/rendering/object.dart 2262:7
[_paintWithContext]
package:flutter/src/rendering/object.dart 184:12
paintChild
package:flutter/src/rendering/proxy_box.dart 128:14
paint
package:flutter/src/rendering/object.dart 2262:7
[_paintWithContext]
package:flutter/src/rendering/object.dart 184:12
paintChild
package:flutter/src/rendering/proxy_box.dart 128:14
paint
package:flutter/src/rendering/object.dart 2262:7
[_paintWithContext]
package:flutter/src/rendering/object.dart 184:12
paintChild
package:flutter/src/rendering/proxy_box.dart 128:14
paint
package:flutter/src/rendering/object.dart 2262:7
[_paintWithContext]
package:flutter/src/rendering/object.dart 184:12
paintChild
package:flutter/src/rendering/box.dart 2512:14
defaultPaint
package:flutter/src/rendering/flex.dart 948:7
paint
package:flutter/src/rendering/object.dart 2262:7
[_paintWithContext]
package:flutter/src/rendering/object.dart 184:12
paintChild
package:flutter/src/rendering/box.dart 2512:14
defaultPaint
package:flutter/src/rendering/stack.dart 587:5
paintStack
package:flutter/src/rendering/stack.dart 595:7
paint
package:flutter/src/rendering/object.dart 2262:7
[_paintWithContext]
package:flutter/src/rendering/object.dart 184:12
paintChild
package:flutter/src/rendering/proxy_box.dart 128:14
paint
package:flutter/src/rendering/object.dart 2262:7
[_paintWithContext]
package:flutter/src/rendering/object.dart 184:12
paintChild
package:flutter/src/rendering/box.dart 2512:14
defaultPaint
package:flutter/src/rendering/custom_layout.dart 396:5
paint
package:flutter/src/rendering/object.dart 2262:7
[_paintWithContext]
package:flutter/src/rendering/object.dart 184:12
paintChild
package:flutter/src/rendering/proxy_box.dart 128:14
paint
package:flutter/src/material/material.dart 531:11
paint
package:flutter/src/rendering/object.dart 2262:7
[_paintWithContext]
package:flutter/src/rendering/object.dart 184:12
paintChild
package:flutter/src/rendering/proxy_box.dart 128:14
paint
package:flutter/src/rendering/object.dart 391:12
pushLayer
package:flutter/src/rendering/proxy_box.dart 1792:14
paint
package:flutter/src/rendering/object.dart 2262:7
[_paintWithContext]
package:flutter/src/rendering/object.dart 184:12
paintChild
package:flutter/src/rendering/proxy_box.dart 128:14
paint
package:flutter/src/rendering/object.dart 2262:7
[_paintWithContext]
package:flutter/src/rendering/object.dart 184:12
paintChild
package:flutter/src/rendering/proxy_box.dart 128:14
paint
package:flutter/src/rendering/object.dart 2262:7
[_paintWithContext]
package:flutter/src/rendering/object.dart 135:10
_repaintCompositedChild
package:flutter/src/rendering/object.dart 95:5
repaintCompositedChild
package:flutter/src/rendering/object.dart 981:29
flushPaint
package:flutter/src/rendering/binding.dart 403:19
drawFrame
package:flutter/src/widgets/binding.dart 797:13
drawFrame
package:flutter/src/rendering/binding.dart 283:5
[_handlePersistentFrameCallback]
package:flutter/src/scheduler/binding.dart 1108:15
[_invokeFrameCallback]
package:flutter/src/scheduler/binding.dart 1047:9
handleDrawFrame
package:flutter/src/scheduler/binding.dart 963:5
[_handleDrawFrame]
package:build_web_compilers/src/dev_compiler/C:/b/s/w/ir/cache/builder/src/out/host_debug/flutter_web_sdk/lib/_engine/engine.dart 188:21
<fn>
The following RenderObject was being processed when the exception was fired: RenderCustomPaint#183c7:
creator: CustomPaint ← FluidFillIcon ← Padding ← DecoratedBox ← ConstrainedBox ← Padding ← Transform
← Container ← Align ← ConstrainedBox ← Container ← _PointerListener ← ⋯
parentData: offset=Offset(0.0, 0.0) (can use size)
constraints: BoxConstraints(w=50.0, h=42.0)
size: Size(50.0, 42.0)
This RenderObject has no descendants.
════════════════════════════════════════════════════════════════════════════════════════════════════
Another exception was thrown: UnimplementedError
Another exception was thrown: UnimplementedError
Another exception was thrown: UnimplementedError
I am unable to run the dog_slider vignette on my computer. I get the error message shown below when I try
Compiler message: /C:/src/flutter/.pub-cache/hosted/pub.dev%2547/flare_flutter-1.7.3/lib/flare.dart:659:7: Error: The non-abstract class 'FlutterActor' is missing implementations for these members: - Actor.makeDropShadow - Actor.makeInnerShadow - Actor.makeLayerEffectRenderer Try to either - provide an implementation, - inherit an implementation from a superclass or mixin, - mark the class as abstract, or - provide a 'noSuchMethod' implementation. class FlutterActor extends Actor { ^^^^^^^^^^^^ /C:/src/flutter/.pub-cache/hosted/pub.dev%2547/flare_dart-2.3.0/lib/actor.dart:108:19: Context: 'Actor.makeDropShadow' is defined here. ActorDropShadow makeDropShadow(); ^^^^^^^^^^^^^^ /C:/src/flutter/.pub-cache/hosted/pub.dev%2547/flare_dart-2.3.0/lib/actor.dart:110:20: Context: 'Actor.makeInnerShadow' is defined here. ActorInnerShadow makeInnerShadow(); ^^^^^^^^^^^^^^^ /C:/src/flutter/.pub-cache/hosted/pub.dev%2547/flare_dart-2.3.0/lib/actor.dart:112:28: Context: 'Actor.makeLayerEffectRenderer' is defined here. ActorLayerEffectRenderer makeLayerEffectRenderer(); ^^^^^^^^^^^^^^^^^^^^^^^ Target kernel_snapshot failed: Exception: Errors during snapshot creation: null build failed. FAILURE: Build failed with an exception. * Where: Script 'C:\src\flutter\packages\flutter_tools\gradle\flutter.gradle' line: 780 * What went wrong: Execution failed for task ':app:compileFlutterBuildDebug'. > Process 'command 'C:\src\flutter\bin\flutter.bat'' finished with non-zero exit value 1 * Try: Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights. * Get more help at https://help.gradle.org BUILD FAILED in 10s Running Gradle task 'assembleDebug'... Running Gradle task 'assembleDebug'... Done 10.8s Gradle task assembleDebug failed with exit code 1
Steps to produce error
flutter pub get
Exit code 0
, run flutter run
on the terminalFlutter Environment
$ flutter doctor -v
[√] Flutter (Channel stable, v1.12.13+hotfix.5, on Microsoft Windows [Version 10.0.18362.535], locale en-US)
• Flutter version 1.12.13+hotfix.5 at C:\src\flutter
• Framework revision 27321ebbad (4 days ago), 2019-12-10 18:15:01 -0800
• Engine revision 2994f7e1e6
• Dart version 2.7.0
[√] Android toolchain - develop for Android devices (Android SDK version 29.0.2)
• Android SDK at C:\Users\scata2\AppData\Local\Android\Sdk
• Android NDK location not configured (optional; useful for native profiling support)
• Platform android-29, build-tools 29.0.2
• ANDROID_HOME = C:\Users\scata2\AppData\Local\Android\Sdk
• Java binary at: C:\Program Files\Android\Android Studio\jre\bin\java
• Java version OpenJDK Runtime Environment (build 1.8.0_202-release-1483-b03)
• All Android licenses accepted.
[√] Android Studio (version 3.5)
• Android Studio at C:\Program Files\Android\Android Studio
• Flutter plugin version 42.1.1
• Dart plugin version 191.8593
• Java version OpenJDK Runtime Environment (build 1.8.0_202-release-1483-b03)
[√] VS Code (version 1.41.0)
• VS Code at C:\Users\scata2\AppData\Local\Programs\Microsoft VS Code
• Flutter extension version 3.7.1
[√] Connected device (1 available)
• Android SDK built for x86 • emulator-5554 • android-x86 • Android 10 (API 29) (emulator)
• No issues found!
I am not able to run project on my android device getting below error on project run command.
e: Supertypes of the following classes cannot be resolved. Please make sure you have the required dependencies in the classpath:
class io.flutter.embedding.android.FlutterActivity, unresolved supertypes: androidx.lifecycle.LifecycleOwner
class io.flutter.embedding.engine.FlutterEngine, unresolved supertypes: androidx.lifecycle.LifecycleOwner
e: /Users/sonusharma/Documents/Flutter Projects/GitPro/flutter_vignettes-master/vignettes/parallax_travel_cards_hero/android/app/src/main/kotlin/com/example/parallax_travel_cards_hero/MainActivity.kt: (3, 28): Unresolved reference: NonNull
e: /Users/sonusharma/Documents/Flutter Projects/GitPro/flutter_vignettes-master/vignettes/parallax_travel_cards_hero/android/app/src/main/kotlin/com/example/parallax_travel_cards_hero/MainActivity.kt: (9, 42): Unresolved reference: NonNull
e: /Users/sonusharma/Documents/Flutter Projects/GitPro/flutter_vignettes-master/vignettes/parallax_travel_cards_hero/android/app/src/main/kotlin/com/example/parallax_travel_cards_hero/MainActivity.kt: (10, 48): Type mismatch: inferred type is FlutterEngine but PluginRegistry! was expected
*******************************************************************************************
The Gradle failure may have been because of AndroidX incompatibilities in this Flutter app.
See https://goo.gl/CP92wY for more information on the problem and how to fix it.
*******************************************************************************************
Gradle task assembleDebug failed with exit code 1
Steps to produce error
Download project from github.
Extract downloaded zip into a folder.
Open parallax_travel_cards_hero folder in VS code.
Run Flutter pub get command.
Run project.
Flutter Environment
[flutter] flutter doctor -v
[✓] Flutter (Channel stable, v1.9.1+hotfix.6, on Mac OS X 10.14.6 18G95, locale en-IN)
• Flutter version 1.9.1+hotfix.6 at /Users/sonusharma/Downloads/flutter
• Framework revision 68587a0916 (3 months ago), 2019-09-13 19:46:58 -0700
• Engine revision b863200c37
• Dart version 2.5.0
[!] Android toolchain - develop for Android devices (Android SDK version 29.0.2)
• Android SDK at /Users/sonusharma/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)
! Some Android licenses not accepted. To resolve this, run: flutter doctor --android-licenses
[✓] Xcode - develop for iOS and macOS (Xcode 10.3)
• Xcode at /Applications/Xcode.app/Contents/Developer
• Xcode 10.3, Build version 10G8
• CocoaPods version 1.8.4
[✓] 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)
[✓] Connected device (1 available)
• Redmi Note 7S • 97d3cc41 • android-arm64 • Android 9 (API 28)
! Doctor found issues in 1 category.
exit code 0
Hi,
I've noticed that when I run the Indie 3D vignette on my Android mobile device that there is a noticeable delay between when the screen shows up featuring the photo of the artist and when the 3D meshes appear. My concern is that depending on the length of the wait, the user might just back out the screen thinking it's just a static image. Is there a way we can either pre-load this or show an activity indicator letting the user now assets are loading?
(flutter doctor -v
details below if that's needed:
[✓] Flutter (Channel stable, v1.12.13+hotfix.5, on Mac OS X 10.14.5 18F132, locale en-US)
[✓] Android toolchain - develop for Android devices (Android SDK version 28.0.3)
[✓] Xcode - develop for iOS and macOS (Xcode 10.3)
[✓] Android Studio (version 3.4)
[✓] VS Code (version 1.41.0)
[✓] Connected device (1 available)
• No issues found!
jason@Solomon lovequest-client (master) $ flutter doctor -v
[✓] Flutter (Channel stable, v1.12.13+hotfix.5, on Mac OS X 10.14.5 18F132, locale en-US)
• Flutter version 1.12.13+hotfix.5 at /Users/jason/flutter-dev/flutter
• Framework revision 27321ebbad (2 weeks ago), 2019-12-10 18:15:01 -0800
• Engine revision 2994f7e1e6
• Dart version 2.7.0
[✓] Android toolchain - develop for Android devices (Android SDK version 28.0.3)
• Android SDK at /Users/jason/Library/Android/sdk
• Android NDK location not configured (optional; useful for native profiling support)
• Platform android-29, build-tools 28.0.3
• Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java
• Java version OpenJDK Runtime Environment (build 1.8.0_152-release-1343-b01)
• All Android licenses accepted.
[✓] Xcode - develop for iOS and macOS (Xcode 10.3)
• Xcode at /Applications/Xcode.app/Contents/Developer
• Xcode 10.3, Build version 10G8
• CocoaPods version 1.7.1
[✓] Android Studio (version 3.4)
• Android Studio at /Applications/Android Studio.app/Contents
• Flutter plugin version 36.0.1
• Dart plugin version 183.6270
• Java version OpenJDK Runtime Environment (build 1.8.0_152-release-1343-b01)
[✓] VS Code (version 1.41.0)
• VS Code at /Applications/Visual Studio Code.app/Contents
• Flutter extension version 3.7.1
[✓] Connected device (1 available)
• iPhone Xʀ • A4806E36-DD62-4D56-BF1E-C105F6B80EE0 • ios • com.apple.CoreSimulator.SimRuntime.iOS-12-4
(simulator)
• No issues found!
In the constellation vignette, I'm getting this compilation error:
.../lib/widgets/nested_navigator.dart:23:29: Error: This expression has type 'void' and can't be used.
return !navigator.pop();
This is running on Flutter (Channel stable, v1.17.4, on Mac OS X 10.14.5 18F132, locale en-US).
Some of the widget code is quite hard to understant, see GameScore._buildTeamScores for example.
I am unable to clone the project. Then in order to solve this, I just copy and paste all the codes but I m getting this error URL Does not exist. I have updated my flutter to 1.12.13
import 'package:shared/ui/placeholder/placeholder_card_short.dart';
On running the drink_rewards_list vignette, I get the warning bottom overflowed by 0.651 pixels
on the UI
Steps to reproduce
flutter pub get
I/flutter ( 6610): ══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════ I/flutter ( 6610): The following assertion was thrown during layout: I/flutter ( 6610): A RenderFlex overflowed by 0.651 pixels on the bottom. I/flutter ( 6610): I/flutter ( 6610): The relevant error-causing widget was: I/flutter ( 6610): Column file:///D:/D0m/Playground/flutter_vignettes/vignettes/drink_rewards_list/lib/demo.dart:92:18 I/flutter ( 6610): I/flutter ( 6610): The overflowing RenderFlex has an orientation of Axis.vertical. I/flutter ( 6610): The edge of the RenderFlex that is overflowing has been marked in the rendering with a yellow and I/flutter ( 6610): black striped pattern. This is usually caused by the contents being too big for the RenderFlex. I/flutter ( 6610): Consider applying a flex factor (e.g. using an Expanded widget) to force the children of the I/flutter ( 6610): RenderFlex to fit within the available space instead of being sized to their natural size. I/flutter ( 6610): This is considered an error condition because it indicates that there is content that cannot be I/flutter ( 6610): seen. If the content is legitimately bigger than the available space, consider clipping it with a I/flutter ( 6610): ClipRect widget before putting it in the flex, or using a scrollable container rather than a Flex, I/flutter ( 6610): like a ListView. I/flutter ( 6610): The specific RenderFlex in question is: RenderFlex#f70e8 relayoutBoundary=up6 OVERFLOWING: I/flutter ( 6610): creator: Column ← Padding ← ConstrainedBox ← Container ← Align ← MediaQuery ← Padding ← SafeArea ← I/flutter ( 6610): Stack ← IconTheme ← IconTheme ← _InheritedCupertinoTheme ← ⋯ I/flutter ( 6610): parentData: offset=Offset(13.7, 13.7) (can use size) I/flutter ( 6610): constraints: BoxConstraints(0.0<=w<=384.1, h=109.3) I/flutter ( 6610): size: Size(384.1, 109.3) Syncing files to device Android SDK built for x86... I/flutter ( 6610): direction: vertical I/flutter ( 6610): mainAxisAlignment: spaceBetween I/flutter ( 6610): mainAxisSize: max I/flutter ( 6610): crossAxisAlignment: center I/flutter ( 6610): verticalDirection: down I/flutter ( 6610): ◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤ I/flutter ( 6610): ════════════════════════════════════════════════════════════════════════════════════════════════════ Syncing files to device Android SDK built for x86... 6,547ms (!)
dependencies in shared path is not working
Hi, i was playing with the gooey demo
Is there a workaround to change the page programmatically?
For example if the user taps the "Get Started" button, then it navigates to the next page of the gooey carousel?
Hi,
Are there endless ListView demo or load more ListView or infinite scrolling ListView?.
it says the project was made in the old version migrate now
deleted
https://flutter.gskinner.com/vignettes/ rather than vignettes.html in the README
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.