Overview

By reading this document, you will learn the basics of using NextPCG Tools to create editor tools. Compared to directly using Unreal Engine's built-in Editor Utility, NextPCG Tools provides users with a more unified workflow and makes it easier for developers to create editor tools.

This document will guide you through implementing a simple tool, as shown below. This tool allows you to configure a series of grid-related parameters and visualize the grid in the viewport, helping you visually verify whether the configured grid meets specific requirements or debug issues related to world grids. Since this guide focuses on the fundamentals of tool creation, the tool's logic will not be overly complex.

ShowWorldGrid.mp4

Environment Setup

1. nstall the NextPCG Unreal Engine plugin and enable the following plugins:

   1. NextPCG
   2. NextPCGTools

   

2. Download the following compressed package and place it in your project:

   Content.zip

Create Tool Widget

1. In the Content Browser, right-click and create a NextPCG Tool Widget. In this document, we will name it WBP_ShowWorldGrid.

   

2. Double-click to open this Tool Widget, then switch to the Designer tab.

   

3. Remove the default Canvas Panel component.

   

4. Create an Editor Utility Scroll Box，which is named body in this document.

   

5. To enhance user recognition, create an icon and title for this tool.

   1. Create a Horizontal Box under the Body, then add an Image and a Vertical Box inside it. Next, create a Text component within the Vertical Box.

      

   2. Assign an image and set the dimensions for the Image component.

      

   3. Set the text content and dimensions for the Text component.

      

6. Add a Details View panel under the body, and make sure to check the Is Variable option.

   

7. In the Graph tab, connect the following logic

   

8. Currently, you can see the Detail View of the Editor Utility itself.

   

9. To ensure this Detail View only displays parameters related to the tool's logic, you can select the Detail View and enter the desired category under Categories to Show. For now, enter "Parameters" as the category. However, since there are currently no variables under the "Parameters" category, the Details View will temporarily remain hidden.

   

10. To add a trigger button to this tool, create a variable of type NextPCG Tools Button and name it Execute, then place it under the Parameters category. Now, when you return to the Designer view, you will see the Details View displaying the Parameters category, which includes the button.

    

    

11. Modify the properties of the Execute button as shown in the image below. After compiling, you will see the button displayed correctly in the Designer view.