パッケージ、リポジトリ、アプリカテゴリを検索

GitHub リポジトリmchome/flutter_colorpicker

flutter_colorpicker

すべての良いデザインからインスパイアされた、HSV(HSB)/HSL/RGB/Materialカラーピッカー。素晴らしいFlutterアプリに最適です。

flutter_colorpicker のプロジェクト画像
スター
385
フォーク
234
最終プッシュ(UTC)
2026/02/17
プロジェクト状態
公開中

元の README

以下は英語原文のスナップショットです。最新版は GitHub をご覧ください。

flutter_colorpicker

pub package badge

HSV(HSB)/HSL/RGB/Material color picker inspired by all the good design for your amazing flutter apps.
Adorable color pickers out of the box with highly customized widgets to all developers' needs.

Web Example

Getting Started

Use it in [showDialog] widget:

// create some values
Color pickerColor = Color(0xff443a49);
Color currentColor = Color(0xff443a49);

// ValueChanged<Color> callback
void changeColor(Color color) {
  setState(() => pickerColor = color);
}

// raise the [showDialog] widget
showDialog(
  context: context,
  child: AlertDialog(
    title: const Text('Pick a color!'),
    content: SingleChildScrollView(
      child: ColorPicker(
        pickerColor: pickerColor,
        onColorChanged: changeColor,
      ),
      // Use Material color picker:
      //
      // child: MaterialPicker(
      //   pickerColor: pickerColor,
      //   onColorChanged: changeColor,
      //   showLabel: true, // only on portrait mode
      // ),
      //
      // Use Block color picker:
      //
      // child: BlockPicker(
      //   pickerColor: currentColor,
      //   onColorChanged: changeColor,
      // ),
      //
      // child: MultipleChoiceBlockPicker(
      //   pickerColors: currentColors,
      //   onColorsChanged: changeColors,
      // ),
    ),
    actions: <Widget>[
      ElevatedButton(
        child: const Text('Got it'),
        onPressed: () {
          setState(() => currentColor = pickerColor);
          Navigator.of(context).pop();
        },
      ),
    ],
  ),
)

preview SlidePicker

Details in example folder.

Dark Knight GitHub avatar
GitHub 作者

Dark Knight ↗

Game Dev & Loong Slayer

地靈殿Out of gravity
言語DartHTMLSwiftKotlinObjective-C

カテゴリー

このリポジトリが公開するパッケージ

使用している依存関係

依存関係一覧 3 件

  • flutter{"sdk":"flutter"}
  • flutter_test開発用{"sdk":"flutter"}
  • flutter_lints開発用^4.0.0

ランキング

プロジェクトに合うリポジトリを選ぶには?

用途で絞り込み、開発状況を比較し、採用前に元のリポジトリで要件を確認しましょう。

  1. 名前・作者・説明で検索し、技術トピックで絞り込みます。
  2. スター、フォーク、最近のプッシュを比較します。スターは関心の目安であり、品質の保証ではありません。
  3. 利用前に GitHub で README、ライセンス、Issues を確認します。

情報源と管理

“A repository is the most basic element of GitHub.”

GitHub Docs — About repositories ↗