itome / flutter_circle_color_picker Goto Github PK
View Code? Open in Web Editor NEWA beautiful circle color picker for flutter.
Home Page: https://itome.github.io/flutter_circle_color_picker/#/
License: MIT License
A beautiful circle color picker for flutter.
Home Page: https://itome.github.io/flutter_circle_color_picker/#/
License: MIT License
When I put color picker into a scroll view and try to pan the scroll is triggered.
I have seen some commits about customizing textStyle etc but this is not yet on pub.dev.
Any news?
Currently the color picker text shows the hex value of the chosen color, which, indeed, is a very useful default. But it would be great to get the possibility to change (maybe for showing RGB or HSL values) or even remove this text. Furthermore, with a custom text you could add a custom TextStyle for better app integration.
Is is this possible yet? Or is there a chance to add a text attribute?
Are there any plans for creating a null-safe version of this package? If so, is there an approximate timeline? Thanks!
Awesome project! I want to use it for sending one end color. Right now it returns the value on dragging, is there a way to make it only returns a value when the drag finished(onPanEnd)? Thank you!
class _ColorPicker extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Center(
child: CircleColorPicker(
initialColor: Colors.blue,
onChanged: (color) => print(color),
size: const Size(300, 300),
strokeWidth: 8,
thumbSize: 35,
textStyle: TextStyle(fontSize: 0),
),
);
}
}
I am receiving the following in Flutter Web, I'm running the latest beta as of today 5/4/20.
This is running the example after cloning the repo and I have done flutter pub get.
══╡ EXCEPTION CAUGHT BY SCHEDULER LIBRARY
╞═════════════════════════════════════════════════════════
The following UnimplementedError was thrown during a scheduler callback:
UnimplementedError
When the exception was thrown, this was the stack:
dart-sdk/lib/internal/js_dev_runtime/private/ddc_runtime/errors.dart 195:49
throw
lib/_engine/engine/shader.dart 52:5
createPaintStyle
lib/_engine/engine/bitmap_canvas.dart 213:23
[_applyPaint]
lib/_engine/engine/bitmap_canvas.dart 338:5
drawCircle
lib/_engine/engine/surface/recording_canvas.dart 983:11
apply
lib/_engine/engine/surface/recording_canvas.dart 79:18
apply
lib/_engine/engine/surface/picture.dart 268:35
paintCallback
lib/_engine/engine/surface/surface.dart 72:14
commitScene
lib/_engine/engine/surface/scene_builder.dart 550:5
build
packages/flutter/src/rendering/layer.dart 808:35
buildScene
packages/flutter/src/rendering/view.dart 230:36
compositeFrame
packages/flutter/src/rendering/binding.dart 406:18
drawFrame
packages/flutter/src/widgets/binding.dart 884:13
drawFrame
packages/flutter/src/rendering/binding.dart 284:5
[_handlePersistentFrameCallback]
packages/flutter/src/scheduler/binding.dart 1113:15
[_invokeFrameCallback]
packages/flutter/src/scheduler/binding.dart 1052:9
handleDrawFrame
packages/flutter/src/scheduler/binding.dart 861:7
dart-sdk/lib/_internal/js_dev_runtime/private/isolate_helper.dart 50:19
internalCallback
════════════════════════════════════════════════════════════════════════════════
════════════════════
Another exception was thrown: UnimplementedError
Another exception was thrown: PersistedOffset: is in an unexpected state.
Flutter Doctor -v returns...
[✓] Flutter (Channel beta, v1.17.0-3.4.pre, on Mac OS X 10.15.4 19E287, locale
en-US)
• Flutter version 1.17.0-3.4.pre at /Users/jody/flutter/flutter
• Framework revision e6b34c2b5c (2 days ago), 2020-05-02 11:39:18 -0700
• Engine revision 540786dd51
• Dart version 2.8.1
[✓] Android toolchain - develop for Android devices (Android SDK version 29.0.2)
• Android SDK at /Users/jody/Library/Android/sdk
• 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_212-release-1586-b4-5784211)
• All Android licenses accepted.
[✓] Xcode - develop for iOS and macOS (Xcode 11.4.1)
• Xcode at /Applications/Xcode.app/Contents/Developer
• Xcode 11.4.1, Build version 11E503a
• CocoaPods version 1.9.0
[✓] Chrome - develop for the web
• Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome
[✓] Android Studio (version 3.6)
• Android Studio at /Applications/Android Studio.app/Contents
• Flutter plugin version 45.1.1
• Dart plugin version 192.7761
• Java version OpenJDK Runtime Environment (build
1.8.0_212-release-1586-b4-5784211)
[✓] VS Code (version 1.44.2)
• VS Code at /Applications/Visual Studio Code.app/Contents
• Flutter extension version 3.10.1
[✓] Connected device (3 available)
• iPhone 8 Plus • D35F92EE-B051-455F-B0C0-EED7EE4225DE • ios •
com.apple.CoreSimulator.SimRuntime.iOS-13-4 (simulator)
• Chrome • chrome • web-javascript •
Google Chrome 81.0.4044.129
• Web Server • web-server • web-javascript •
Flutter Tools
Here is some code and a screen shot showing by usage. You can see in the picture that the container I put on the page is filled with the same value that I've set the intialColor value to but the control is not showing the color that was set.
Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Text(
'Away Color',
style: TextStyle(
fontSize: 20.0,
fontWeight: FontWeight.bold,
)
),
CircleColorPicker(
initialColor: awayPickerColor,
onChanged: (color) => changeAwayColor(color),
size: const Size(240, 240),
strokeWidth: 4,
thumbSize: 36,
),
Container(width:100, height:20, color: awayPickerColor),
]
),
Would it be crazy to implement a pick color by hex code feature, like users could tap the code to open a field and type a new one? Or would you be open to a pull request along those lines?
Would be great, if the user could edit the displayed hex code if he knows the exact code
Use Case: User wants to see how a certain color code looks like. So he enters, e.g., a hex code and the color picker should show this color.
Is it possible to inject a Color value to the picker?
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.