Thread Rating:
  • 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
In Depth Background DC tutorial
#1
A background without a background is dull and boring; on the other hand, if we fight in a good one, our skillz might be enhanced! So here goes all the information that I know on DCing backgrounds.

name:
%s
width: %d
zboundary: %d %d
shadow: %s shadowsize: %d %d

name:
Quite obviously the name of the background

width:
the width of the horizontal plane of the background

zboundary:
the width of the vertical plane of the background

there are 2 values here. the one in front is the upper limit of the playable area, the latter defines the lower limit of the playable area
Since y: 0 ~ 120 is covered by the player HP/MP indicators, that's why the upper limit is usually set at a value greater than 200

shadow:
the file path for the shadow sprite of the background

shadowsize:
dimensions of the shadow
there are 2 values, so use the width and height of the sprite of the shadow

1st type (which uses only pictures)
layer:
%s (file path of the sprites)
transparency: %d
width: %d
x: %d
y: %d
loop: %d
cc: %d
c1: %d
c2: %d
layer_end

transparency:
0 non-transparent; black bits of the background would not be displayed as transparent
1 transparent; black bits of the background would be displayed as transparent

width:
This is to create the parallax scrolling effect, which gives a sense of depth to backgrounds
A norrmal background that is wider than 794 and you want to enable parallax scrolling, this value needs to be greater than 794 and smaller than the width of the background (not the layer)
for example: Lion Forest's width is 3200, and the layer width is 2900 for the forest trees (forestt)
here's an approximate formula:
(2900-800)/(3200-800) = 7/8; when you move 8 pixels to the right, the trees (forestt) of the background would move 7 pixels towards the left
another example: the skyline and some mountains (forests)'s width is 800
(800-800)/(3200-800) = 0; no matter how much you move around, this layer is fixed
As I said earlier, this formula is approximate, because 800 is not the actual value, but it does make nicer numbers for the ratios

x: y:
the starting coordinates where the layers are placed in the background

loop:
If you want repeated images on the same plane, looping makes it more convenient

Now for the animated bits
cc:
the total time which one loop of the animation lasts (time units should be the same as wait values in character data files)
the animation will keep on repeating

c1: %s c2: %s
The values there determine how long that particular picture lasts before moving on to the next layer.
For example in HKC, we have:
cc: 16 c1: 0 c2: 7
cc: 16 c1: 8 c2: 15
so the run time may seem to be 7 units of time, but it actually is 8 units of time, because "0" is one unit as well, so we have "0", "1", "2" .... "7", after that, we go to the second layer, which again has 8 units of waiting time "8", "9", "10", "11" .... "15", thus the total units of time for the whole animation to run before looping is 16, thus cc is 16

2nd Type (which uses blocks of colours to fill in the background)
layer:
%s(file path, any pic shall do)
rect: %d
x: %d
y: %d
width: %d
height: %d
layer_end

rect:
Colour codes under 16 Bit Colour Mode
It's still a mystery as for why marti did not implement it in the 32 bit colour mode...

x: y:
coordinates of the starting point

width: height:
dimensions of the desired colour block

Rect values' corresponding colours:
An extremely professional explanation by YinYin


legend:
%s = string
%d = number


Special thanks to Windmill who taught me everything that I need to know on background data.
Massive thanks to YinYin who made rect values clear as crystal.
you don't want to see this (Click to View)
avatar by Una
the other by xFire
Reply
Thanks given by: Dr. Time
#2
Wow, this was the result of your motivation!?

Best Background Tutorial I ever saw...

http://www.lf-empire.de/content/view/596/105/lang,en/

updated...
[Image: random.php?pic=random]
www.lf-empire.de
Once I had a fortune, it said: "Leave now. Life is short. Time is luck"
Don't dream your life, live your dream!
Reply
Thanks given by:
#3
seems like you replied faster than I could edit my post :P
you don't want to see this (Click to View)
avatar by Una
the other by xFire
Reply
Thanks given by:
#4
*giving a big hand for Yuan*
wow, I tried to mess around with the colors one day, but I gave up...

This is really useful but I just ask myself one thing...
why do you use these nice terms for numbers and strings, they remind me of programming & hex-editing :P
Silverthorn / Blue Phoenix
~ Breaking LFE since 2008 ~

"Freeze, you're under vrest!" - Mark, probably.

» Gallery | » Sprites | » DeviantArt
Reply
Thanks given by:
#5
lol@BP

YinYin Wrote:those rect colors ... are a pain
ive made a chart with which you should be able to manually mix any color available

[Image: rectyi6.png]

there are 65504 colors available ranging from almost black at 00000 (its #070707) to pure white at 65503
(an lf2 background without layers is totally black - if you need that color, dont waste layers)

-on the small one digit step the blue value goes from 7 to 255 in steps of 4, thus leaving you 32 colors in the smallest blocks (right)
-every time the blue resets back to 7 the green value increases by 4, thus making each small block become lighter (top)
-every time the green resets back to 7 the red value increases by 4, thus making the whole pattern grow warmer with each big block (bottom)

these are all big block ranges - first ones being more dark/green/blue last ones being more red/yellow/white (there is a nice grey somewhere right in the middle - used in hkc)

#00000-02015
#02016-04063
#04064-06111
#06112-08159
#08160-10207
#10208-12255
#12256-14303
#14304-16351
#16352-18399
#18400-20447
#20448-22495
#22496-24543
#24544-26591
#26592-28639
#28640-30687
#30688-32735
#32736-34783
#34784-36831
#36832-38879
#38880-40927
#40928-42975
#42976-45023
#45024-47071
#47072-49119
#49120-51167
#51168-53215
#53216-55263
#55264-57311
#57312-59359
#59360-61407
#61408-63455
#63456-65503

rect shall no longer enslave you in confusion :p
Reply
Thanks given by:
#6
http://www.lf-empire.de/content/view/598/105/lang,en/

You guys write to many tutorials the last time :p
[Image: random.php?pic=random]
www.lf-empire.de
Once I had a fortune, it said: "Leave now. Life is short. Time is luck"
Don't dream your life, live your dream!
Reply
Thanks given by:
#7
hm the rect actually isnt quite as easy as ive put it there (even tho its close enough to get the general idea)
the actual algorithm doesn seem to use whole numbers, hence my explanaition has some mistakes (the big box values are correct tho)

this lil thing should allow you to pick any rect color:
http://www.savefile.com/files/1542129
[Image: rectkj5.png]

bumpedit: mouse hold working, and you can also drag the cross outside the window to pick any color on your screen - it will display the picked hex color on the left and the closest rect on the right
Reply
Thanks given by:
#8
http://www.lf-empire.de/content/view/203/178/lang,en/

Added this tool and a lil description about rect to background tutorial. YinYin, if you can add some more information which I forgot / don't know yet please lemme know...
[Image: random.php?pic=random]
www.lf-empire.de
Once I had a fortune, it said: "Leave now. Life is short. Time is luck"
Don't dream your life, live your dream!
Reply
Thanks given by:




Users browsing this thread: 1 Guest(s)