fretboard 0.1.0+1 copy "fretboard: ^0.1.0+1" to clipboard
fretboard: ^0.1.0+1 copied to clipboard

Song writing toolkit for Flutter

Fretboard 🎸 #

[![style: very good analysis][very_good_analysis_badge]][very_good_analysis_link] Powered by Mason [![License: MIT][license_badge]][license_link]

Song writing toolkit for Flutter.

Features #

  • ✅ Easily draw a fretboard layout with some note markers.
  • ❌ Show the note symbol with a letter notation.
  • ❌ Automatically generate a fretboard drawing based on a given scale name.

Usage #

To draw a simple guitar fretboard you can just instantiate the Fretboard widget passing some Size and a matrix that represents how the fretboard should be drawn:

class MyCustomWidget extends StatelessWidget {
  const MyCustomWidget({super.key});

  @override
  Widget build(BuildContext context) {
    return Center(
      child: Fretboard(
        size: Size(400, 240),
        notesMatrix: [
          ['', 'o', '', '', 'o', ''],
          ['', 'o', '', '', 'o', ''],
          ['', 'o', '', 'o', '', ''],
          ['', 'o', '', '0', '', ''],
          ['', 'o', '', '', 'o', ''],
          ['', '0', '', '', 'o', ''],
        ],
      ),
    );
  }
}

Example Screenshot

Advanced usage #

Custom theme #

You can change the default theme colors by passing a custom FretboardTheme:

Fretboard(
  size: Size(400, 240),
  theme: FretboardTheme(
    tonicColor: Colors.green,
    noteColor: Colors.pink,
    fretColor: Colors.grey,
    stringColor: Colors.black,
  ),
  notesMatrix: [
    ['', 'o', '', '', 'o', ''],
    ['', 'o', '', '', 'o', ''],
    ['', 'o', '', 'o', '', ''],
    ['', 'o', '', '0', '', ''],
    ['', 'o', '', '', 'o', ''],
    ['', '0', '', '', 'o', ''],
  ],
),

Dart Versions #

  • Dart 3 >= 3.0.0

Maintainers #

3
likes
140
points
14
downloads

Publisher

verified publishermugbug.dev

Weekly Downloads

Song writing toolkit for Flutter

Repository (GitHub)

Documentation

API reference

License

MIT (license)

Dependencies

flutter

More

Packages that depend on fretboard