Overview - Part 1
This Pano2VR RGTP V6 Component tutorial will take you step-by-step through the workflow required to add the RPGT_COMPONENT.GGSKC to an existing Version 6 project and populate it with gallery and text popups.
Final Output
The tour below is a sample of the final output from this tutorial.
Tutorial Files
1. Download the zipped tutorial folder and unzip it.
In the tutorial folder, RPGT_Tutorial_V6, there are a number of folders as shown in the image below. Included are Custom icons, Project Files, and Tutorial Files (figure #1)
Figure #1: Tutorial Folder
Note: The equirectangular image, component and project files supplied with this tutorial are copyright Tony Redhead 2022 and not to be sold, used or modified in any way without the express written permission of the author.
Click on any image in the tutorial to enlarge it
This tutorial assumes a basic knowledge of Pano2VR V6
Tutorial Overview
In this tutorial, we will modify the RPGT_Tutorial_Simplex.p2vr project and skin by:
Installing the RPGT component
Adding the Component to the current skin (Simplex)
Adding Externalized colors to the skin.xml (optional, requires WinZip or another extraction software that can show the internal files of the .ggsk)
Creating a Single image gallery popup with a Description
Creating a Multi-Image gallery popup with a Description
Creating a Text only popup
Adding Individual Slide Titles
Adding Individual Slide Descriptions
Adding a Custom Icon
Setting Project Colors
Integrating the RPGT component with the Simplex Skin
Reviewing the Edit Skin Configuration options and Variable Previews
Installing the Component
1. Locate the component, RGTP_COMPONENT.ggskc, in the Tutorial folder > Component
2. Double click the component to add it to your Component Toolbox
Note: if you aren’t familiar with the use of the Component Toolbox please review the video below.
Adding the Component to the Current Skin
1. Open the project file ‘RPGT_Tutorial_Simplex.p2vr’ in Pano2VR V6 (figure #2)
Figure #2: Project window
Note: This is a simple single node tour with a standard Simplex skin
3. Open the Skin Editor
4. Set the Canvas size to 900 x 600 (figure #3)
Figure #3: Set Canvas size
5. Open the Component Toolbox and locate the folder that you saved the RGTP_COMPONENT into (figure #4)
Figure #4: Component Toolbox and RG
6. Double-click the RGTP_COMPONENT to add it to the skin (figure #5)
Figure #5: RGTP_COMPONENT added to the skin
6. Close the Component Toolbox and open the Properties > Variable dropdown menu and you can see the variables added by the component (figure #6)
Figure #6: Variables added to the skin
7. Select Save As.. and save the skin into the tutorial folder Project Files 270722 as Simplex_RPGT_Skin.ggsk
8. Close the skin
9. In the project window click on the Edit Skin Configuration button
10. Check ‘Show Variable Previews (Debug)’ and click on OK to close the window (figure #7)
Figure #7: Check ‘Show Variable Previews (Debug)
Note: This will test and see if the component is working within the skin. This element is great for debugging as it shows you the state of the variables that affect the component elements. This will be covered in more detail in Part 10 of the tutorial.
11. Output the project
Note: It should look like the example below.
Note: if you are interested in using the component please contact me at tony@tonyredhead.com and we can discuss your requirements.
Note: This is the end of Part 1 lets move onto Part 2: Adding Externalized Colors