In this last topic, you will learn about linked lists and storing application state. We will use a linked list data structure to implement a music library.Hide Learning Objectives ****Download the starter code here (Link)

We start with building the create the PlaylistComponent in the Projucer project. At the Projucer window, select Source on the right panel and click + and select Add New Component class (split between a cpp & header) give the name PlaylistComponent. Make sure that the cpp and h files are under the Source folder.

Open the project on your IDE. Go to MainComponent.h and import and instantiate the Playlist component.

#pragma once

#include "../JuceLibraryCode/JuceHeader.h"
#include "DJAudioPlayer.h"
#include "DeckGUI.h"
#include "PlaylistComponent.h"

class MainComponent   : public AudioAppComponent
{
...

private:
    ...
    MixerAudioSource mixerSource; 
    
    PlaylistComponent playlistComponent;
    
    JUCE_DECLARE_NON_COPYABLE_WITH_LEAK_DETECTOR (MainComponent)
};

Go to MainComponent.cpp and adjust the UI to show the playlist component.

MainComponent::MainComponent()
{
    ...
    addAndMakeVisible(deckGUI1); 
    addAndMakeVisible(deckGUI2);
    
    addAndMakeVisible(playlistComponent);

    formatManager.registerBasicFormats();
}

...
void MainComponent::paint (Graphics& g)
{
    // (Our component is opaque, so we must completely fill the background with a solid colour)
    g.fillAll (getLookAndFeel().findColour (ResizableWindow::backgroundColourId));

    g.setColour(Colours::white);
    g.setFont(14.0f);
    g.drawText("PlaylistComponent", getLocalBounds(), Justification::centred, true);
...

void MainComponent::resized()
{
    deckGUI1.setBounds(0, 0, getWidth()/2, getHeight() / 2);
    deckGUI2.setBounds(getWidth()/2, 0, getWidth()/2, getHeight() / 2);
    playlistComponent.setBounds(0, getHeight()/2, getWidth(), getHeight()/2);
}

Compile and run the program. You should be able to see an empty playlist showing at the bottom.

Next, let’s add a table item in.

Go to PlaylistComponent.h and declare a TableListBox.

class PlaylistComponent  : public juce::Component
{
...
private:
    TableListBox tableComponent;
    JUCE_DECLARE_NON_COPYABLE_WITH_LEAK_DETECTOR (PlaylistComponent)
};

Go to PlaylistComponent.cpp and display the component. Then add some columns to the playlist at the constructor.

PlaylistComponent::PlaylistComponent()
{
		tableComponent.getHeader().addColumn("Track title", 1, 400);
		tableComponent.getHeader().addColumn("Artist", 2, 400);

    addAndMakeVisible(tableComponent);   
}
...
void PlaylistComponent::resized()
{
    tableComponent.setBounds(0, 0, getWidth(), getHeight());
}

Compile and run the program. You should see two items added to the playlist.

Next, let's add a vector to store a list of files. Go to PlaylistComponent.h to extend the playlist to TableListBoxModel and declare the vector of track titles.