flutter_dial_knob 0.0.3 copy "flutter_dial_knob: ^0.0.3" to clipboard
flutter_dial_knob: ^0.0.3 copied to clipboard

A customizable, rotatable dial knob widget for Flutter.

Knob #

A customizable dial knob widget for Flutter.

screenshot

Features #

  • Dart 3 Compatible
  • Customizable colors for track, level, knob, and indicator
  • Gradient support for level indicator
  • Adjustable size

Installation #

Add this to your pubspec.yaml file:

dependencies:
  flutter_dial_knob: ^0.0.2

Then run:

flutter pub get

or

$ flutter pub add flutter_dial_knob

Usage #

Import the package in your Dart file:

import 'package:flutter_dial_knob/flutter_dial_knob.dart';

Use the DialKnob widget in your Flutter app:

import 'package:flutter/material.dart';
import 'package:flutter_dial_knob/flutter_dial_knob.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Dial Knob Example'),
        ),
        body: Center(
          child: DialKnob(
            value: 0.5,
            onChanged: (newValue) {
              print(newValue);
            },
            min: 0,
            max: 1,
            size: 100,
            trackColor: Colors.grey,
            levelColorStart: Colors.green,
            levelColorEnd: Colors.red,
            knobColor: Colors.blue,
            indicatorColor: Colors.white,
          ),
        ),
      ),
    );
  }
}

Customizable Properties #

  • value: The current value of the knob.
  • onChanged: Callback when the value changes.
  • min: Minimum value (default is 0).
  • max: Maximum value (default is 1).
  • size: Size of the knob (default is 72).
  • child: Optional child widget.
  • trackColor: Color of the track.
  • levelColorStart: Start color of the level gradient.
  • levelColorEnd: End color of the level gradient.
  • levelColor: Solid color of the level.
  • knobColor: Color of the knob.
  • indicatorColor: Color of the indicator.

Example #

DialKnob(
  value: 0.5,
  onChanged: (newValue) {
    print(newValue);
  },
  min: 0,
  max: 1,
  size: 100,
  trackColor: Colors.grey,
  levelColorStart: Colors.green,
  levelColorEnd: Colors.red,
  knobColor: Colors.blue,
  indicatorColor: Colors.white,
)

License #

MIT License. See LICENSE for more information.

8
likes
150
points
28
downloads

Publisher

verified publisherunge.dev

Weekly Downloads

A customizable, rotatable dial knob widget for Flutter.

Repository (GitHub)
View/report issues

Documentation

API reference

License

MIT (license)

Dependencies

flutter

More

Packages that depend on flutter_dial_knob