Advanced GUI Tutorials

RackAFX Version 6.6 (currently in Beta Testing) adds a whole new paradigm to your ability to generate beautiful, platform independent GUIs. This new “Advanced GUI API” allows you several new options:

  • create tabbed-GUI windows for a compact, professional look
  • create custom versions of RackAFX VSTGUI objects
  • create custom view objects for plotting data (FFT analyzer, waveform view, oscilloscope) which will update and animate as audio streams
  • create VSTGUI objects that RackAFX does not support such as OpenGL views, rocker switches, check boxes and several other controls/views
  • show/hide and manipulate your GUI controls from within your plugin
  • create a fully custom designed GUI completely programmatically from within your plugin

In order to get you up and running, I have created seven tutorials called “modules” and five projects to go along with them. These projects are graded to take you from beginner to advanced as you progress through them. I will also add a video for each project as time permits.

Module 1: Making Tabbed GUIs

In this module you will learn how to make a tabbed GUI. There is no example project – you can simply use one of your existing projects but the Synth projects will work the best with the supplied graphics. There is also no custom coding – this is purely done with drag and drop in the GUI Designer. I used the MiniSynth project to make a simple tabbed GUI (the tabs look like buttons, but that is totally up to you and your graphics design). See Module 5A below to learn how to control the view switching programmatically from within your plugin, if you like. Updated December 11, 2015.

MINSNTH GUI 1

Check out this awesome tabbed GUI interface from Andy Stockton, assembled in the RackAFX GUI Designer. It includes embedded tab controllers on the MOD panel!

Synthboy1

Synthboy2Synthboy3

Synthboy4Synthboy5

 

Document: Advanced GUI Module 1.pdf

 

Module 2: Getting Started with VSTGUI4 and RackAFX

This module will ease you into the Advanced GUI API by introducing you to VSTGUI4 and the RackAFX Plugin function showGUI() that you will need to implement for these advanced new capabilities. You will learn how to install the VSTGUI4 library and get set up for the rest of the modules. Updated December 11, 2015.

Document: Advanced GUI Module 2.pdf

Project: CustomViews.zip

 

Module 3: Subclassing VSTGUI4 Objects

Here we dig in and subclass two VSTGUI4 objects:  CKickButton (momentary on/off) and CAnimKnob (the standard knob control). This will teach you how to subclass and instantiate these objects inside your plugin code. They will also advance your knowledge of VSTGUI4 by overriding both mouse click and drawing functions. The projects also includes examples of several more VSTGUI objects as custom views. In the screen shot below, the CKickButton (the momentary “Prophet V” button) is customized and subclassed to show how to control mouse behavior, and the left volume knob is subclassed to show how to modify drawing behavior. The COptionMenu (ON/OFF drop-list shown below) is also implemented showing you how to customize many of its attributes, colors, font and drawing styles. Updated December 11, 2015.

 

CustomViews1Document: Advanced GUI Module 3.pdf

Project (same as for Module 2): CustomViews.zip

 

Module 4: CViewContainer Custom Views and Caching Custom View Pointers

In this module, you learn how to implement a custom CViewContainer and cache its pointer. Then, you can manipulate the container from within your plugin. This example shows you how to:

  • show/hide controls
  • move controls around
  • change the text on controls
  • change the bitmap (graphic) of controls

The sample project shows how to make this all happen from within your plugin. Updated December 11, 2015.

CustomViews2

Document: Advanced GUI Module 4.pdf

Project: CustomViewsTwo.zip

 

Module 5: Custom View Objects for any VSTGUI4 Object

Here you will learn how to implement any VSTGUI4 control or view object as a custom view. This allows you full access to the entire VSTGUI4 library and begins the advanced portion of the modules. In the simple accompanying project, you create the CCheckBox and CTextButton controls as custom views — these are not part of the RackAFX GUI Designer. Here the Boost and MUTE controls are our new custom additions. Updated December 11, 2015.

 

CustomViews3Document: Advanced GUI Module 5.pdf

Project: CustomViewsThree.zip

A RackAFX user asked about creating a Custom View drop-list (the COptionMenu object) that could be populated with menu strings programmatically, and not connected to an underlying RackAFX variable. This bonus project uses a Plugin User Variable and a Custom CView object, which becomes the COptionMenu. The User Variable is a special type called VSTGUI which is discussed here: VSTGUI User Variables

Project: CustomDropList.zip

 

Module 6: Subclassing CView for View Objects

This is a really powerful tutorial – it shows how to subclass CView, the mother of all VSTGUI4 view objects, to create a waveform view that scrolls the audio waveform across the window. You can use this as a basis for creating all kinds of graphing/plotting controls. You can also create your own completely customized control or view — the sky is the limit when you subclass CView. Updated December 11, 2015.

 

CustomViews4Document: Advanced GUI Module 6.pdf

Project: CustomViewsFour.zip

 

Module 7: Custom GUI Design using VSTGUI4

In this final module, you learn how to design a VSTGUI4 GUI programmatically, without the RackAFX GUI Designer. This is the most powerful way to develop a GUI – you own the GUI so you will cache its control pointers and you can implement stock or subclassed controls and views. The sample project produces a very simple GUI as it is there to get you started. If you dig deeper into the VSTGUI4 library and apply some practice and patience, you can develop GUIs that rival professional plugin developer versions. Below the Document/Project links are a few examples of commercially available products that use VSTGUI4 in order to whet your appetite! (There are many more examples out there!) Updated December 11, 2015.

Document: Advanced GUI Module 7.pdf

Project: CustomViewsFive.zip

phosphor from audiodamage: http://www.audiodamage.com/instruments/product.php?pid=AD027

pp2_phosphor

 

DSP Trigger from Audio Front: http://www.audiofront.net/dspTrigger.php

DSPT1506

 

 

Comments are closed.