Juce Tutorial 63 - Controlling Audio Parameters with ValueTree Attachments

hey what's up everybody I'd like to welcome you to another juice tutorial and in this tutorial we're gonna talk about an item that I see so many questions about in our discord chat and also just around the audio programming community which is about connecting visual elements that you have so you have a user that is controlling some sort of slider or some sort of button in their plugin and how do you connect those to the processor side where we have some sort of parameters that need to be adjusted that are going to somehow change our signal flow in our plugin so this is a tutorial designed to show you how to connect those two sides using attachments so I'm going to assume that you've already checked out tutorial 44 where I'll talk about the audio processor value tree state because that's the way that we're going to actually connect these two sides and these items up to each other so we have some sample code that I've created and you can follow along to do that you could go to github.com for it slash the audio programmer for its last value tree attachments and you can download the sample code to follow along so I'll show you the sample code now so this is what we have so first thing that we have is our audio processor value tree state so just to refresh you on what that is we have the audio processor value tree state object that's been estate what we do is we create the different parameters that we think that our user is going to want to adjust on their plugins so we're going to have some sort of sliders and then we're going to have the parameters here that are going to associate with those sliders buttons and combo boxes so going to our plugin processor here we have the create parameters function here that we're looking at and what I've done here is I've created four different parameters here I've created one that's a float parameter so this could be something like a gain slider it's just going from zero to one and we can see that it's the audio primer it's an audio parameter float okay so all of these are different types of ranged audio parameters okay so let me just show you that in documentation just to reinforce what I'm saying so we have the ranged audio parameter class and then in the ranged audio parameter class we can see that we have four different types of parameter values that we can use so we have audio parameter Bulls so this would be if a button was on or off we have a parameter choice if the user was using like combo box that had like three different choices then we have audio parameter flow which is like a game that an audio parameter int which is same as a float but an int and so I've created four different types of parameters that are those four types so we have the gain slider type of parameter which is audio parameter float we have the combo box one that is like the audio parameter choice and then we have bull which is just an on or off and I've just called that power and then we have an int which is just associated with like a dial okay so those are the parameters that we have here and then we see that if we go up to the top here we have our audio processor value tree state object that we've instantiate adhere and here we call our function create parameters this kind of uploads your parameters so to speak into the value tree okay so that's the processor size that's the back end of the part of the plug-in where the actual audio processing and the hard math is actually happening then if we go on over to the editor side you'll see what I've done is I've created a four different components here so I have a slider this is called slider I have a dial the text button that is was is just designed to act as like a power button and then we have a combo box with three choices so then going on to our CPP file here I've just given these some default kind of parameters so we have linear vertical slider we have I'm just setting the textbox below setting the range and making it visible and then just kind of doing the same sort of things for these other components we have rotary rotary dial we have a power button that's set for red or green depending on if the buttons around on or off and then I have a combo box where I've created three items that are just three choices that the user can make going down to the bottom into resized I am just setting the bounds on these so I'm actually just drawn to them to the screen so I have this connected up to my Ableton to open up in Ableton so I'm just going to build this now and if you're not familiar with how to open up your project or your plugin and addy aw check plug tutorial I think it's tutorial 17 where I show you how to do that so so now we're just going to go into our VST threes and then this plugin is called value tree attachments and then here is we've our plug-in subtract it into our window here say here we have our audio parameter float they have an int we have one that turns on there off and we have a combo box where we can make just different choices here okay so that's where we're at so far and then the question becomes how do we actually connect these so at the moment they're not actually connected to our processor side to the ranged audio parameters just gonna save this actually I will just call this the call this value tree there we go so the way that we need to do this is so just to reiterate here very quickly we have these sliders dials visual components and then here on the called the plugin processor side we have parameters and these two things are not associated with each other at the moment so we need to use a different types of attachments to do this okay so so just going back to our documentation here if I go to audio processor value tree state then in here we have some different types of attachments here so we so we have this one that's a button attachment combo box attachment and let's just start off with a slider attachment okay so I'm just gonna click in here go to the documentation and we see here that it means maintains a connection between a slider and a parameter in the audio processor value tree state so then to instantiate it we we just use these these arguments here so what I'm going to do is I'm going to use a unique pointer so some people ask okay why do you use why would you use a unique pointer here well the main reason that you'd want to use a unique pointer in this particular situation is because this is controlling a visual element and and the attachment doesn't actually have to exist when the UI is closed so when the UI is closed then the unique pointer goes out of scope and it doesn't actually even as it exists anymore it doesn't need to exist unless we're actually we actually have the UI open and we're actually controlling a parameter so for that matter of these sliders and button some combo boxes can actually all be unique pointers as well because they don't actually need to be there or exist when the UI is closed that goes for all that matter they actually don't exist okay so that's that's why we're using a unique pointer in this situation so what we need to do is we need to do this audio processor value tree state slaughter attachment so it's a unique pointer of audio processor value tree state slide our attachment type okay and I will just call this slider attachment okay then we'll do the same thing so for these other ones okay so the dial is a type of slider so I could just actually do the same thing here and make this dial attachment and then we will make another unique pointer okay I could copy and paste all this but I like actually typing it just to reinforce the learning here so text button okay so for this one we can use we can just go back a step here and we actually have another one that's called button attachment okay so audio processor value tree state button attachment now we'll just paste that into here and I'll just call this button attachment and then we will do one more and then this will be a combo box attachment I believe so we have combo box attachment okay so I'm just going to copy this here paste it here call this choice attachment okay so one thing that you want to be aware of here is that when you if you go here I believe all of these attachments say the same things as during the lifetime of this combobox attachment keeps the two things in sync bla bla bla when this object is deleted the connection is broken make sure that your audio processor value tree state and combo box aren't deleted before this object okay so for that reason what I'm doing is I'm actually putting these unique pointers below the sliders okay because when this plug-in editor actually destructs it actually destructs in the reverse order of the way that you declared it so if you declared the slider first then it will actually delete the slider last okay so actually when it d-structs it destructs from the bottom up so that's why we need to get rid of the attachments before we get rid of the components themselves okay so I hope that that's I hope that that's clear for you if you declare these above the sliders and these visual components here you'll actually get a crash I believe the crash will happen if you try to when you try to close the plug-in that's and that's the reason why okay very common error so onward with this so we got the slider attachment so let's just start with that so the thing to keep in mind here with these unique pointers is at the moment we've created we've we've created these unique pointers but we haven't actually allocated memory yet okay so the way that we do that in this situation is so we have our first one which is called slider attachment so the way that we declare this is we do slider attachment equals and now we use stood make unique and make unique is actually what allocates the memory for the slider attachment okay so this is a little bit of kind of repeating ourselves again here so I'm going to do some copying and pasting so what we're saying is we're allocating memory of this type of object and then I'm going to go back to my documentation here and we actually go to slide our attachment and here are our arguments that we need okay and I will paste them here oops actually I'm gonna go back here I'm going to copy and paste this one so it's a little bit it's not so crazy okay so there we go so our first parameter is audio processor value tree state state to control okay so just a reminder here that in our plugin editor we have a reference to our processor object okay so our so our process our object is over here okay so it's called value tree attachment attachments audio processor reference and then you can see here going back to our header I'm just doing this for people that may be still learning C++ like myself okay oh here's some learning process so we see that we this is the class right value tree attachments audio processor so this is just referring to this okay oh sorry to this to this value tree the value attachments audio processor a so that's so what we need is our audio processor value tree state object which is this object right here okay so going back to our slider attachment here or Declaration so it says state to control this is why we're going we're saying processor dot ap VTS that is because that's our audio process of value tree state object now here we need our our parameter ID string so we go back to our plugin processor cpp and then this is our parameter ID okay this first one right here slider so that i'm gonna go just going to paste that in here and then it says a slider to control okay which is this one right our slider which is going from zero to one alright so that's why I'm going to put slider here okay so that's that's what that's about okay this is just saying this is our audio processor value treat state object this the gained the the parameter that we're looking for in our audio processor value tree state is the slider gain ID the slider ID and then I want to associate that parameter with my slider with my visual slider okay so that's so that's what I've done there okay so those two things are now connected to each other okay so now we just need to do that for the other ones okay so now it's just dial attachment and here we go so I'm just going to copy this here then just going to change this to believe it's called dial okay I'm just going to move this just just so we have these in the same order okay so we got dial okay and then we want to associate that dial parameter with our actual visual dial right now we do the same thing for our button attachment so we have this on or off button here and so we go back here and then we're gonna do the same thing here okay but if you just few little differences okay this is a it says slider attachment at the moment we want this to be a button attachment right because it's a button that we are actually attaching here and we call this power and we're associating that with our power button okay and you can see here that I have this is a text button button and then I have set clicking toggle state to be true which means that this will turn on or off okay then we have our last one which is I believe choice box choice attachment equals and now we're gonna do the same thing we're but this once again instead of a slider attachment this needs to be a combo box attachment okay then we have our our audio processor factory state object and let's see what we called our parameter we called it choice okay I'm just going to take this put this below just so we have everything kind of nice and neat and na everything is kind of in the same order there okay just keep it all the same so called choice and here we go and then we are associating this with choice box okay so now we have the attachment so we should be good to go here okay so then the next question becomes how do we actually get these values right so we have them at the moment they're in this they're in this vector of unique pointers of ranged audio parameters so how do we actually get this out of our value tree when we want to use it okay so I'm just going to demonstrate this for you in the audio block so I'm just gonna get rid of all the stuff in the audio block here and we can just say we're just going to this is not something that I would normally do in the process block okay so but this is just for like demonstration purposes here so we got Auto slider value equals okay so now we need to get these we need to get these parameters right so we have the first one okay which is called slider okay so now we'll go back up to I always lose my place in here I'm sorry so we got slide our value equals and then we go to our ap VTS object okay so and then there's a function that's called get raw parameter value now the tricky thing here is that we see that this returns a float pointer okay so first thing that we'll do is we'll get the raw parameter value and then we have our string ID which is sorry slider okay slider is our value but this returns a float pointer and if you recall or if you don't - to get the value of this pointer we need put the star operator in front of it okay that gets us the value at that memory location so the pointer is just a memory location so it's pointing to a memory location and now the star operator is getting the value that's stored in that memory location okay so let's do that for these other ones so we got so we have dial right so dial value and then we will do the same thing get raw parameter value and then we call this dial okay and then we will say Auto button value equals then we got get raw parameter value again and this was called power and then we will call this box choice and then same thing get raw parameter value and then this was called choice I believe okay let's go down here so it's called the choice okay so that's how we actually get the values here okay so let's now let's just print these out so let's just say slider value and slider value and then we will do pile value and dial value then button value so this will just this should just give us a zero or one when we click that on or off and then we got button value and then box combo box choice then we got box choice okay so let's see so that should and then this box choice will just give us the choice of whatever we've actually chosen so it'll just be an index it won't actually be a the string okay so now we're just gonna open this back up in Ableton right quick here we are so now we see our values printing out once again do not when you're making a quote-unquote real plugin you don't want to be consoling out in your audio callback so this is just this is just for demonstration purposes here so as we can see we move the the slider value and it's moving up and down you see that that's refreshing properly here okay same thing here so that's working properly okay then we got our value button value turning on and off properly then we have combi book box choice turning on and off proper properly turn into the proper choice so that's it so that's how you that's how you do it okay so just to refresh on that you have very quickly you have different types of range to audio parameters that you can create for your value tree on the audio sides that you have a float an INT a bowl or a choice okay and that's how you instantiate this there's a longer considers a longer constructor for these but I just wanted to make it easy just to demonstrate it here those get pushed into this vector that we call parameters then we'll return the vector here that's our parameter layout we've we uploaded that to our audio processor value tree state okay I say uploaded in kind of quotes okay and wavy then in our plugin editor we have these unique pointers which are our different attachments so we need a attachment that's appropriate for the type of visual component that we've created so if we have a slider needs a slider attachment it's a combo box it needs a combo box attachment okay once again make sure that these are created after your visual components okay if they're because the when the editor d-structs it destructs in the reverse order which means that the these attachments will be destroyed first before the actual components okay then heading over to our plugin editor cpp we beneath all of our parameters for our different sliders then we are actually allocating using stood make unique okay then that's where we actually have our processor audio processor value tree state object from our processor then we're getting the gain the the parameter ID and then we're just associating that parameter ID with our actual component and we're just doing that for all of these so that is it I hope you enjoyed this tutorial if you have any questions or suggestions on how to improve this process or if you feel that I've missed anything please feel free to make a comment below I'm always I always enjoy checking out the comments and seeing ways that we can all improve our code so I'm going to go ahead and in this tutorial please give it a thumbs up if you enjoyed it and I will see you next time

Channel: The Audio Programmer

Views: 3,626

Keywords: Juce Framework, framework, juce audio, creative programming, audio coding, vst development, vst, software development, c++, audio programming, juce, plugin development, valuetree, audio processor value tree, audio parameters

Id: jUsWeki7GGc

Length: 28min 43sec (1723 seconds)

Published: Mon Dec 30 2019