SwiftUI

A Layout that arranges its subviews in columns

SwiftUI View when creating a new document

SwiftUI View for the content

SwiftUI View for the main content

SwiftUI View for the toolbar

SwiftUI View for the header

SwiftUI View for the song

SwiftUI View for the chord diagrams

SwiftUI View for a chord diagram

SwiftUI View for the audio player

SwiftUI View for the metronome

SwiftUI View for the ChordProEditor

SwiftUI View for the file browser

SwiftUI View for selecting the songs folder

SwiftUI View for a Song export

SwiftUI View for a folder export

SwiftUI Viewto select a file

Menu Items and Keyboard shortcuts for font size

SwiftUI View for the settings

SwiftUI View for the Print Button

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

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.

A SwiftUI View to create a ChordDefinition with pickers