ChordDefinitionView

public struct ChordDefinitionView : View

A SwiftUI View for a ChordDefinition

The View can be styled with the passed DisplayOptions and further with the usual SwiftUI modifiers.

The color of the diagram are styled with the .foregroundStyle modifier

  • The color of the diagram is the primary color.
  • The labels are the secondary color

Note

If you don’t attach a .foregroundStyle modifier, the labels are hard to see because the primary and secondary color are not that different.

The height of the View is just as needed

It will calculate all the bits and pieces based on the width and will be not a fixed height. As always, you can set the height with a modifier as it pleases you.

Best is to wrap the View in another View to attach any modifiers:

/// SwiftUI `View` for a chord diagram
struct ChordDiagramView: View {
/// The chord
let chord: ChordDefinition
/// Width of the chord diagram
var width: Double
/// Display options
var options: ChordDefinition.DisplayOptions
/// The current color scheme
@Environment(\.colorScheme) var colorScheme
/// The body of the `View`
var body: some View {
   ChordDefinitionView(chord: chord, width: width, options: options)
       .foregroundStyle(.primary, colorScheme == .dark ? .black : .white)
   }
}

If you want to render the chord for print; just set the style to ‘black and white’ and use ImageRenderer to get your image.

  • The chord to display in a diagram

    Declaration

    Swift

    let chord: ChordDefinition
  • The chord display options

    Declaration

    Swift

    let options: ChordDefinition.DisplayOptions
  • The width of the diagram

    Declaration

    Swift

    let width: Double
  • The height of the grid

    Declaration

    Swift

    let gridHeight: Double
  • The height of a line

    Declaration

    Swift

    let lineHeight: Double
  • The width of a cell

    Declaration

    Swift

    let cellWidth: Double
  • The horizontal padding

    Declaration

    Swift

    let horizontalPadding: Double
  • The frets of the chord; adjusted for left-handed if needed

    Declaration

    Swift

    let frets: [Int]
  • The fingers of the chord; adjusted for left-handed if needed

    Declaration

    Swift

    let fingers: [Int]
  • Init the View

    Declaration

    Swift

    public init(chord: ChordDefinition, width: Double, options: ChordDefinition.DisplayOptions)

    Parameters

    chord
    width

    The width of the diagram

    options

    The DisplayOptions for the diagram

Body of the View

  • The body of the View

    Declaration

    Swift

    public var body: some View { get }

String Grid

  • The grid View

    Declaration

    Swift

    var grid: some View { get }

Diagram

  • The diagram View

    Declaration

    Swift

    @ViewBuilder
    var diagram: some View { get }

Top Bar

  • The top bar View

    Declaration

    Swift

    var topBar: some View { get }

Frets Grid

  • The frets grid View

    Declaration

    Swift

    var fretsGrid: some View { get }

Barre Grid

  • The barres grid View

    Declaration

    Swift

    var barresGrid: some View { get }

Notes Bar

  • The notes View

    Declaration

    Swift

    var notesBar: some View { get }

GridShape

  • The Shape of the grid

    See more

    Declaration

    Swift

    struct GridShape : Shape