Skip to content

itome/flutter_circle_color_picker

Repository files navigation

flutter_circle_color_picker

pub package

A beautiful circle color picker for flutter. Online Demo

Light theme Dark Theme
sample light theme sample dark theme

Usage

...
        body: Center(
          child: CircleColorPicker(
            initialColor: Colors.blue,
            onChanged: (color) => print(color),
            size: const Size(240, 240),
            strokeWidth: 4,
            thumbSize: 36,
          ),
        ),
...

API

  /// Called during a drag when the user is selecting a color.
  ///
  /// This callback called with latest color that user selected.
  final ValueChanged<Color> onChanged;

  /// Called when drag ended.
  ///
  /// This callback called with latest color that user selected.
  final ValueChanged<Color>? onEnded;

  /// An object to controll picker color dynamically.
  ///
  /// Provide initialColor if needed.
  final CircleColorPickerController? controller;

  /// The size of widget.
  /// Draggable area is thumb widget is included to the size,
  /// so circle is smaller than the size.
  ///
  /// Default value is 280 x 280.
  final Size size;

  /// The width of circle border.
  ///
  /// Default value is 2.
  final double strokeWidth;

  /// The size of thumb for circle picker.
  ///
  /// Default value is 32.
  final double thumbSize;

  /// Text style config
  ///
  /// Default value is Black
  final TextStyle textStyle;

  /// Widget builder that show color code section.
  /// This functions is called every time color changed.
  ///
  /// Default is Text widget that shows rgb strings;
  final ColorCodeBuilder colorCodeBuilder;