number_selection

パッケージ概要

公開情報に基づく選定ガイドです。参考としてご利用ください。

美しいコンセプトデザインからインスパイアされた、視覚的に魅力的でインタラクティブな数値ピッカー・ウィジェットを提供するFlutterパッケージです。ユーザーは直感的なスクロールまたはタップで数値を選択でき、フォームや設定、あるいは数値選択が必要な任意の入力に適しています。カスタマイズ可能で、Android、iOS、Web、macOS、Windows、Linuxなど複数のプラットフォームをサポートしています。滑らかなアニメーションと応答性のあるフィードバックにより、ユーザー体験を向上させます。

用途

数値選択を必要とするフォーム入力
調整可能な値を持つ設定
インタラクティブUIコンポーネント
モバイルおよびデスクトップアプリケーション
カスタム数値入力インターフェース

主な機能

スムーズスクロールインターフェース
クロスプラットフォーム互換性
カスタマイズ可能な外観
応答性のあるタッチ操作
アニメーション付きの遷移
キーボードナビゲーションをサポート

適している対象

フォームベースのアプリを開発する開発者
デザイン重視のUI実装
マルチプラットフォーム Flutter プロジェクト
直感的な数値入力が必要なアプリ

注意事項

統合には追加のスタイル設定が必要な場合があります
数値入力のみに制限
大規模データセットへのパフォーマンスへの影響
非常に高い頻度の更新には最適化されていません

元の README

関連するソースリポジトリの README 原文のスナップショットです。最新の内容はリポジトリをご覧ください。

Example

Demo

How to use

Import number_selection.dart

import 'package:number_selection/number_selection.dart';

And here an use example

NumberSelection(
    theme: NumberSelectionTheme(
        draggableCircleColor: Colors.blue,
        iconsColor: Colors.white,
        numberColor: Colors.white,
        backgroundColor: Colors.deepPurpleAccent,
        outOfConstraintsColor: Colors.deepOrange),
    initialValue: 1,
    minValue: -10,
    maxValue: 10,
    direction: Axis.vertical,
    withSpring: true,
    onChanged: (int value) => print("value: $value"),
    enableOnOutOfConstraintsAnimation: true,
    onOutOfConstraints: () => print("This value is too high or too low"),
);

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

パッケージをインストール