Skip to content

Instantly share code, notes, and snippets.

@blu-dev
Last active March 4, 2023 07:18
Show Gist options
  • Save blu-dev/6913aceb6781f858734a7d5ca72916c9 to your computer and use it in GitHub Desktop.
Save blu-dev/6913aceb6781f858734a7d5ca72916c9 to your computer and use it in GitHub Desktop.
Installation & Usage Guide for blujay's Better-SSS v1

Installation

Inside of the ZIP file that you should get with the Ko-Fi/Patreon release, there should be a folder titled "SD CARD". The contents of that folder need to be copied to the root of your SD card, so that in the result you should have the following files on your SD card:

sd:/ultimate/mods/better-sss/ui/script_patch/common/stage_select_actor3.lc
sd:/ultimate/mods/better-sss/ui/layout/patch/stage_select2/stage_select2/layout.arc
sd:/ultimate/mods/better-sss/plugin.nro

You should also have an info.toml and preview.webpin the better-sss folder, that is for ARCropolis's mod manager.

Usage

First thing to note is that the changes this mod makes to the stage select screen are not present on Wi-Fi or local wireless play, as it is not possible to send the required changes to the other console.

This mod creates a new "form" that you can select on the stage select screen, being the hazard form which is the opposite of your ruleset default. This means that if you have your ruleset set to hazards on by default, then the new form will be hazards off:

Example Images

Ruleset default of hazards on New form of hazards off

You get to this form the same way that you would get to the other forms (by pressing the X button on your controller, or by pressing the stage form button on the stage preview).

This mod allows this new form to function like the others, that means that you can select it independently for multiple stages in the first-to-X mods set by the rulset, as well as allowing you to pick the default form AND the hazards-inverse form for stage morph.

Example Images

Select both hazards on and hazards off in stage morph

In this image you can see that we would rotate between Battlefield, Hazardless Kalos, and Hazards On Smashville.

Select both hazards on and hazards off in stage morph

But it conflicts with my other stage select screen mod :(

Don't worry! In the release zip I've included some raw image files that I uses for the tab images and the medals. There is another file in this gist that covers how to modify a custom stage select screen to include the same functionality! If you follow the steps step-by-step it should be pretty easy!

Why should I add support for this mod to my own?

Well, it's quite simple. This mod does replace some of the internal textures, but that's just do to some material issues (you are free to work around this limitation on your own, I am simply going to describe the steps that I took to accomplish the same result), but with how we use them, if the user does not have my Better SSS mod installed, they won't know any different from the regular vanilla stage select screen.

If you are making a mod from scratch, I highly recommend basing it off of this one so that people aren't left with incompatible mods. If you want me to fix your layout for you, shoot me a DM on discord at blujay#7630 and we can work something out

Acquiring the Files

You're going to need the following files:

  1. medals.png, from the Source Files folder in the release ZIP
  2. tab.png, from the Source Files folder in the release ZIP
  3. preview.png, from the Source Files folder in the release ZIP
  4. layout.arc, from the ui/layout/patch/stage_select2/stage_select2/ folder in the mod that you want to add support for.

For this guide, I'm going to be using HyperNuke's Split Stage Select mod, which you can download on GameBanana.

You are also going to need to download Switch Toolbox, so make sure you have that downloaded.

Opening the file in Switch Toolbox (STB)

First, open Switch Toolbox, you should have a window that looks something like this: Switch toolbox home

You can either click on the File tab, and then the Open button and select your layout.arc file, or you can drag the layout.arc file onto the STB window. Once you have opened the file, it should look like this: Loaded layout.arc file

We are only going to be working inside of the raw layouts, so click the + button to the left of layout.arc, and then the + button to the left of blyt to expand a listing of all of the layouts. Once you've done that, it should look like this: Expanded layouts

Modifying the layouts

If you are unfamiliar with STB, please go in order as I describe how to do each step in great detail in the medals section, and then skip over the micro stuff in the following sections.

Modifying the medals

  1. The first things that we need to add support for are the medals, so go ahead and find the file named stage_select_btn3_medal.blyt in the layout listing. In the screenshot above, it is the first file. Double click it, and it should open up a layout editor in a new window that looks like this (I recommend fullscreening it): Opened medal layout

  2. On the right side of the window there is a list of all textures in the layout. Find the texture that is of the medal with the regular smash icon, it has the name stage_select_btn3_medal_normal^u. We are going to be replacing this texture. Right click on it and click Replace. It will ask you to select a file, this is where you want to select medals.png. Once you've done that, it should take you to another window like this: Freshly opened medals

  3. We want to change the medals to have the same format as the original texture, so click on the drop-down box next to Format and select BC7_SRGB. It will quickly produce a new image, which might look a little rough. Change the Compression Mode to Normal (Good Quality) and wait for it to finish processing the image. Once you are done, you should have everything look like this: Correctly formatted medals

  4. Go ahead and click ok. It should update the texture preview on the texture list, and then if you click on the medal in the layout, it should update the texture there. Your window should now look like this: Poorly displayed medals

  5. In order to fix this, we need to go to the Hierarchy tab on the left side of the window. It should display a list of expandable sections. We want to expand RootPane, then medal. You'll see a list of panes with names like flare_00, medal_normal, medal_battlefield, shadow, etc. (not in that order). Your window should now look like this: Expanded medal panes

  6. Click on the listing named medal_normal, and you should see the Properties tab in the bottom left fill out with the properties of the selected pane. We are interested in the Picture Pane tab in that Properties tab, so click on that to switch to it, and your window should now look like this (focus on the bottom left): Normal medal picture pane

  7. We need to change the texture coordinates of this pane. Since our normal medal takes up the left third of the texture, we want to change the Top Right and Bottom Right x coordinates to be 0.33. After changing those, your preview should update and your medal should look normal again: Normal medal picture pane after texcoord modifier

  8. Now we get on to the juicy part. We are going to need to create two new panes. Both of them will be Picture panes, one named medal_gimmick_on and one named medal_gimmick_off. To create a new pane, right click on the empty space in the layout view, expand the Create Pane drop down in the context menu, and then click Picture Pane. After doing so, you should have a white rectangle like on your screen and a new listing in the pane hierarchy on the left side: New medal pane

  9. First we need to correct it's position in the hierarchy. We want to drag that pane (currently named P_pict) on to the medal pane, and STB will put it under that pane. After doing that, you it should be under the medal pane and indented properly like the other panes: New medal pane under medal

  10. Next, click on your white pane so that it populates the Properties tab in the bottom left, then switch to the Pane tab from within that. It should look something like this, however your Translate coordinates might be different: New pane properties

  11. Change the Translate X/Y coordinates to both be 0, and then change the Size X/Y to both by 84. Once you've done that, your white pane should cover all of the medal and be a perfect square: New pane as a square

  12. Change the Name of the pane to be medal_gimmick_on, this is going to become the medal for hazards on. Once you've done that, it should update in the pane hierarchy and it should still be a white square. New gimmick on pane

  13. Repeat steps 8-12 again, but this time setting the X coordinate to -1 (trust me on this, something with the texture coordinates makes it look bad otherwise), and set the name to medal_gimmick_off. After you've done that, your complete pane hierarchy and layout should look like this: Both panes exist now

  14. Now that both panes have been created, all that is left is to map them to a texture. Before we do that, we want to set the alpha of medal_gimmick_off to 0, so that we can see the medal_gimmick_on pane that we are working with. Go ahead and click on the medal_gimmick_off pane in the pane hierarchy so that it populates the Properties tab. Click on the Pane tab, scroll down and drag the alpha slide all the way to the right so it is 0: Zero alpha gimmick off

  15. Now we are going to start making the hazards on medal. First, click on the medal_gimmick_on pane in the pane hierarchy. It will populate the Properties tab in the bottom left. Click on the Texture Maps tab inside of the Properties and you should see this:

    Texture Maps tab

  16. Click the Add button and it should open up a texture selector menu. You want to select the texture for the normal medal, so pick stage_select_btn3_medal_normal^u:

    Texture selector window

  17. Once you do that, you should see the same thing we saw earlier, where all three medals are compressed horizontally: Compressed medals

  18. We once again need to change the texture coordinates of our medal. So click on the Picture Pane tab under Properties and change the X coordinate for Top Left and Bottom Left to 0.33 and the X coordinate for Top Right and Bottom Right to 0.67, your window should look like this: Proper hazards on medal

  19. We need to do the same thing but for the hazards off medal. So repeat step 14 but for medal_gimmick_on (to make the hazards on medal invisible) and then change the alpha of medal_gimmick_off back to 255 so that we can see it (it should still be a white square). After you are done, your window should look like this: Back to hazards off

  20. Repeat step 15-17 for medal_gimmick_off: Compressed medals

  21. Change the texture coordinates for this medal to 0.66 on Top Left and Bottom Left, and your medal should take form: Finished

  22. Once you are done, set the Alpha of both medal_gimmick_on and medal_gimmick_off to 0, and then click the Save icon in the top left to save the layout. Then close the window so you are back in STB's main listing.

Modifying the tab

  1. Open the file named p2_stage_select_btn3_00.bflyt in the layout listing. Once it's opened in the layout editor, it should look like this: Tab layout

  2. Right click on the regular smashball texture in the Texture List and replace it with tab.png, setting the format to BC3_SRGB, like this: Tab icons

  3. Expand the RootPane hierarchy as shown, and change the right X coordinates to 0.33 for icon_normal, so that the smashball returns to a normal looking icon: Fixed smash icon

  4. Make a new Textbox Pane, setting the text to Hazards On (the better SSS mod does not support regional text yet). Drag it under tab_normal so that it follows the same hierarchy as the rest of the textboxes, and rename it from T_text to set_txt_gimmick_on: Hazards on textbox

  5. Set the X and Y coordinates of the pane to 40 and 42, respectively. Change the X and Y size to 151 and 70, respectively. It's outline should look like this: Textbox outline

  6. Under the Text Pane settings, change the X and Y Scale to 38.4 and 66 respectively (sometimes STB will change the scale very slightly, that's fine): Font scaling

  7. Repeat steps 4-7 but name the textbox set_txt_gimmick_off and set the text to Hazards Off. Now you should have two new textbox panes under the tab_normal in the pane hierarchy: Hazards off textbox

  8. Create a new Picture Pane and drag it under set_txt_gimmick_on in the pane hierarchy. Set the size to X: 60 and Y: 60, the translation to X: -103 and Y: -2, and the name to icon_gimmick_on: Hazards on pane

  9. Go to the Texture Maps tab for icon_gimmick_on, click Add under Textures, and select icon_stage_select_btn3_00_00^q. It should look compressed like we've seen before. Under Picture Pane, change the left X coordinates to 0.33 and the right X coordinates to 0.66: Hazards on icon

  10. Change the Alpha under Pane to 0 so that the icon is invisible: Invisible hazards on icon

  11. Repeat step 8 but drag the pane under set_txt_gimmick_off and name it icon_gimmick_off: Hazards off pane

  12. Repeat step 9 but for icon_gimmick_off and set the left X coordinates to 0.66 and leave the right X coordinates as 1: Hazards off icon

  13. You've successfully added all of the required panes. You still need to set the color on set_txt_gimmick_on, set_txt_gimmick_off, icon_gimmick_on, and icon_gimmick_off (yes all 4 of them) which you can do under the Colors tab of each of their properties. The color included in the default layout.arc is 24E582FF, however you can select whatever fits your mod best: Colored icon

  14. Change the alpha of set_txt_gimmick_on, set_txt_gimmick_off, icon_gimmick_on, and icon_gimmick_off all to 0, and check Influence transparency to children for set_txt_gimmick_on and set_txt_gimmick_off: Inivisble pane properties

  15. Click the save icon in the top left to save the layout and close the layout editor window.

Modifying the stage preview

  1. Open the file named melee_com_btn0_preview_stage_00.bflyt in the layout listing. Once it's opened in the layout editor, it should look like this: Preview button

  2. Right click on the regular smashball icon in the Texture List and replace it with preview.png. Change the format to BC7_SRGB, which is not the same as what we are replacing but it won't cause any problems. Make sure the quality is Normal (Good Quality) and then click ok: Texture replacement

  3. Expand the RootPane hierarchy to icon_blink_anime so that you see the icon_normal, icon_battle, and icon_end panes: Icon panes

  4. Click on icon_normal, go to the Picture Pane tab, and change the right texture coordinates X values to 0.33: Smashball preview fixed

  5. Create a new Picture Pane and drag it under icon_blink_anime, renaming it to icon_gimmick_on. Set the translation to X: -4 and Y: -1, the scale to X: 0.85 and Y: 0.85, and the size to X: 40 and Y: 40: Hazards on preview pane

  6. Go to the Texture Maps tab and click Add. Select melee_com_btn0_preview_stage_icon_01^s click Ok: Importing texture

  7. Go to the Picture Pane tab and change the left X coordinates to 0.33 and the right X coordinates to 0.66: Hazards on icon

  8. Go to the Colors tab and change the color to whatever you picked for your tab icon/textboxes: Colored hazards on icon

  9. Repeat steps 4-7 but name the pane icon_gimmick_off and change the left X coordinates to 0.66 and leave the right X coordinates as 1: Colored hazards off icon

  10. Set the alpha for both icon_gimmick_on and icon_gimmick_off to 0: Inivisible icons

  11. Create a new Null Pane named txt_gimmick_on and drag it under the anim_blink_txt pane in the hierarchy. Set it's position to X: 0 and Y: 0, leaving the rest of the fields as-is: Null gimmick_on pane

  12. Create a new Textbox Pane named set_txt_gimmick_on and set its text to Hazards On. Drag it under txt_gimmick_on on the pane hierarchy. Set it's position to X: -7 and Y: 0 and the size to X: 126 and Y: 70: Gimmick text pane

  13. Go to the Text Pane and change the font scale to X: 32 and Y: 55: Gimmick font scale

  14. Repeat steps 10-12 but for txt_gimmick_off, set_txt_gimmick_off, and setting it's text to Hazards Off: Gimmick off font scale

  15. Set the color for set_txt_gimmick_on and set_txt_gimmick_off to what you set it in the previous steps: Colored text boxes

  16. Click the save icon in the top left and close the layout editor.

Finishing Up

Click the save icon in the top left of the layout.arc window, and you've successfully adapted your mod!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment