[GUIDE] The SUI Service & SUI Windows - ProjectSWGCore/NGECore2 GitHub Wiki
What's an SUI Window?
SUI Windows are any windows that are shown in SWG. This includes generic list menus such as selecting a travel ticket to use for boarding a shuttle, and even more complex windows such as the commodities market. All SUI Windows are generally sent a packet telling the game which window should be opened, how it should look, and how it should interact. The SUIService makes creating these windows very easy for us. It should be noted that not all windows displayed in-game must be created through the SUIService. Windows such as the one that shows up when you purchase a travel ticket are shown through the EnterTicketPurchaseModeMessage, and the rest is done client-side with the /purchaseticket command being sent when "purchase" is selected in the window. The travel terminal aren't the only ones that are handled through the client. Others include the Build-A-Buff Workshop and Commodities market. Generally, the complex windows are handled through the client itself and only show when a certain packet is sent specific for that window.
Structuring
Every window used in the game has a script. These scripts are found in the TRE files of SWG under the "ui" folder of SWG. The one that you'll be referring to the most is probably going to be "ui_scripted.inc". Inside, you'll notice scripting that seems to be similar to XML. That's basically what it is. Below is a brief overview of the structuring.
- Each window is made up of one or more pages. Typically there will be 2 pages for every window.
- Everything that makes up a window is considered a component (including pages, labels, buttons, and images)
- Components contain wide parameters and narrow parameters. (These are the properties of the component which defines the name, color, and even style)
I strongly recommend reviewing the scripts in the "ui" folder to better understand the structuring. It will make your life a whole lot easier when you're trying to get it to show in-game.
The SUI Service
NGECore2 is made up of services which basically (simply put), tells the server how to interpret the packets that it receives or a service can even be a helper service such as the scripting service. The SUIService helps with the creation of the packets that are sent to the client in order to display windows and how to handle them when an action is performed, and even populate data on that window should it be needed (such as list boxes). In order to call this service, all you have to do is the following, where core is NGECore:
core.suiService
Displaying an SUI Window
Typically an SUI Window will be shown after selecting a option on a radial menu. Once the right option is selected, the window associated to it will be displayed. Most of the SUI Windows are done through scripting in a radial script for the certain object. Radials are a topic of it's own, however I recommend looking at "scripts/radial/bank.py" or "scripts/radial/npc_ticket_collector.py" for an idea of how the radials are displayed (Great resource for studying SUI Windows too!). For this section, scripts will refer to the UI script that is located in the UI folder of the game, not to be confused with the scripts that you create for NGECore2.
Creating the SUI Window
By calling the createSUIWindow method within the SUIService, you can show an SUI Window the player. This method only displays the window according to the script (Remember, these are in the ui folder of the client), it does not do anything else. The following code (Jython/python) demonstrates how to display a simple message box, where suiSvc is defined as core.suiService.
if option == 21 and target:
suiWindow = suiSvc.createSUIWindow('Script.messageBox', owner, target, 0)
suiSvc.openSUIWindow(suiWindow)
return
Notice how another method was called? This is how we get the window to display onto the client. Without this, the window will not be able to display. The method simply takes the Object of an SUIWindow and sends a packet to the client based on the window's information (which we just created).
Setting Parameters & Displaying Window
I explained earlier at the start of the guide that there are narrow parameters and wide parameters. Wide being the property and the narrow being the value of the property. In order for our window to look how we want it to instead of the generic properties that are in the script, we can tell the game how to read this window by changing the components. In order to do so, you must first know the name of the property you wish to change (wide parameter), as well as the location of the property.
if option == 21 and target:
suiWindow = suiSvc.createSUIWindow('Script.messageBox', owner, target, 0)
suiWindow.setProperty('bg.caption.lblTitle:Text', 'Hello Title');
suiSvc.openSUIWindow(suiWindow)
return
Notice how the location of the parameter is simply "bg.caption.lblTitle:Text" and doesn't include "Script.messageBox"? We don't need to specify that, as the server already knows what we're talking about (We're setting the properties of an SUIWindow Object). Once you've called the SUI script that you want, and you have set the properties that you wish, all you have to do is call the
openSUIWindow(SUIWindow window)
method, which will show the window on the acting client. You don't have to set any properties for an SUI Window if you don't want too. It'll just be defaulted to what is defined in the window script.