Skip to content
A flutter package for a knob widget
Dart
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
lib
.gitignore
.metadata
CHANGELOG.md
LICENSE
README.md
knob-and-slider.png
pubspec.lock
pubspec.yaml

README.md

knob

A simple knob UI widget.

Getting Started

Add the dependency to your pubspec.yaml:

dependencies:
  flutter:
    sdk: flutter
  flutter_knob: // Add it here

This package provides a Knob widget with a similar API as Flutter's Slider widget.

Working example, showing the Knob controlling, and being controlled by a Slider:

import 'package:flutter/material.dart';

import 'package:flutter_knob/flutter_knob.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  double _value = 0.0;
  void _setValue(double value) => setState(() => _value = value);
  static const double minValue = 0;
  static const double maxValue = 10;

  @override
  Widget build(BuildContext context) {

    return Scaffold(
      appBar: AppBar(
        title: Text('Flutter Tutorial'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Knob(
              value: _value,
              color: Colors.blue,
              onChanged: _setValue,
              min: minValue,
              max: maxValue,
              size: 50
            ),
            Slider(
                value: _value,
                onChanged: _setValue,
                min: minValue,
                max: maxValue),
            Text(
              'Value: ${_value.toStringAsFixed(3)}',
            ),
          ],
        ),
      ),
    );
  }
}
You can’t perform that action at this time.