• Summary
• 1. Enter Theme definitions
• 2. Add themes
• 3. Add background layers
• 4. Add background colors
• Fin.

Summary

This wiki explains how you can create and configure game themes using the ThemeSettings editor found in the MapEditor. You can manage things such as:

• GameThemes & Themes
• Animated parallax auto-scrolling background layers
• Custom sky colors
• Background objects

This wiki doesn't cover everything, but you can easily figure the rest out by yourself. I hope this helps!

1. Enter Theme definitions

1. Click the Manage GameThemes button on the home tab of the Map Editor.
   • 
2. Select a theme you want (and are able) to edit.
   • To modify an existing theme, clone it and name it something like {GameTheme}_fix.
   • To make a new custom theme, clone a theme you want it to be based on and name it as you wish.
   • You can read a bit more about creating themes in this tutorial: [[sfmb_how_to_make_game_theme]]{How to make a game theme}.
3. If it's not already, set the Theme Version to 2!
   • 
4. Click the Edit ThemeDefinitions button at the bottom of the window.

2. Add themes

On the Theme tab you can create, browse and configure themes for your GameTheme.

1. Add / create a theme by clicking Add, then name it as you want.
   • 
2. If the name of your background music file doesn't match the name of your theme, define which file it should play by entering the name of that file here.
3. You can change the Environment if needed to the following:
   • Plain -> Nothing special, default.
   • UnderWater -> Makes the entire theme swimmable.
   • Airship -> The camera and liquid layers move up and down.
   • Castle with lava -> Adds a lava liquid layer by default.
4. You can also override which themed resource the theme should use if needed, by filling in the values under Sprite Inheritance.
   • For example, when both your Underground and Space themes should use the MapObjectUnderground spritesheet, you can set the MapObjectSprite of the Space theme to Underground.
     • You can leave it empty for Underground. If the name of a theme matches the name of a themed resource (theme name: Mars, resource name: MapObjectMars) it will use that by default. -
5. We will get back to the other options here later.

3. Add background layers

On the Background Layer tab you can link, browse and configure background layer resources for your GameTheme.

1. Make sure the background layer resources are created and configured correctly (.png & .sprite files).
   • If not, check this detailed tutorial: [[sfmb_tutorial_sprites]]{How to work with sprites}
2. Click Background Layer.
3. Add a layer resource by clicking Add, then enter the name of the layer file without the word "Layer". e.g. OverworldClouds.
   • 
4. Set the FixedTo field as follows:
   • Bottom -> Things you want to appear on the ground or only once vertically (e.g. hills, towers, city, water).
   • Bottom + Repeat -> Things in the sky or vertically repeating backgrounds (e.g. clouds, underground).
   • Top & Bottom -> Don't use if possible.
5. Adjust the ScrollRatio to make the layers feel further away or closer to the camera.
   • Most games use two layers for parallax scrolling: one at 0.25 ScrollRatio and the other at 0.5 ScrollRatio.
   • There is an option to make the scroll ratio different on the x and y axes, but this can cause very unnatural visuals and should only be used in very specific cases. -
6. Test it to see if it feels and looks good.
7. If you need, set the AutoScroll values to make the background layer scroll by itself. Make sure the parallax scrolling feels and looks right before setting up the autoscroll!
8. To use these, you have to enter the added names to a theme, in order, separated by commas without spaces (e.g. OverworldHills,OverworldClouds). Layers cover each other from front to back.
   • 

4. Add background colors

On the Background Color tab you can create and browse named background colors.

By using Background colors for the sky instead of a separate sky sprite layer, the color of the sky can change with wind, rain and lightnings.

1. Add and name a Background color (e.g. Sky).
2. Set its color.
   • 
3. Go back to the Theme tab, select a theme, and enter the name of the Background Color in the BgColor field.
   • 

You should ignore the Color of {something} fields on the main ThemeSettings window.

Fin.

These are still just the basics, there are still plenty of options in ThemeSettings. Don't be afraid and try experimenting with it!

If something is not clear, DM me, the author (marci599), and if I'm available I’ll try to help!