The RPG Maker Resource Kit

RMRK RPG Maker Creation => VX => VX Tutorials => Topic started by: rafidelis on January 08, 2009, 07:16:23 AM

Title: [RGSS2]Understanding more about colors and RGB values
Post by: rafidelis on January 08, 2009, 07:16:23 AM
Today I will teach you how to "discover" the colors to use in your scripts without having to get to know what is killing the RGB code of a given color.
For this lesson we'll use the MS Paint, or the self RpgMaker To "discover" the RGB values.
Well, first of all, which is RGB?
RGB and an acronym for RED, GREEN, BLUE
And through these values and to achieve our colors.
Well before most of all, you must be wondering, because you need
of colors in your scripts.
Good For example:
• Change the color of text
• To fill a rectangle
• Etc..

So let us by the hand in the mass, open MS Paint (Start Menu> All Programs> Accessories> Paint
Or typing in the run (Start Menu> Run):
b]"Mspaint"[/b] (without quotation marks ( ""))
After open, double-click on any color in the palette of colors, a menu like the image below should appear:


(http://i328.photobucket.com/albums/l332/Rafis_Maker/Paleta.gif)

Click in Defining Personalized Colors, and must appear a sub-menu as of the next image:

(http://i328.photobucket.com/albums/l332/Rafis_Maker/paleta2.jpg)


It repairs where you are contouring of red to the side you find the word “[color="#FF0000"]red[/color]”, that is Red, that is, this responsible box and for value [color="#FF0000"]R[/color] In low we find the [color="#2E8B57"]Green[/color] value, that is value G, and soon in low of this To the Blue field, that and responsible for the [color="#0000FF"]blue[/color] value, or better Blue, then and value B That is, these 3 fields are respectively values RGB. Very, choice 3 colors with that desires to work, and it copies its values RGB Well (I go to use Red, Blue Green and). We go to start for the red, selects the red color in paleta of colors, you goes to perceive that values RGB are the following ones:

(http://i328.photobucket.com/albums/l332/Rafis_Maker/rgb.png)

Red = 255
Green = 0
Blue = 0 

Very well, we go to test if the codes really function in scripts. Script above of the Main creates one it nominates and it as Test Colors, in the field of creation of script writes:

Code: [Select]
class Colors < Window_Base
  def initialize
super(0,0,144,120)
refresh # Call de metod refresh
  end
end

def refresh
  self.contents.clear
  self.contents.font.color = Color.new(255,0,0) # red
  self.contents.draw_text(0,0,344,32,"Red")
  self.contents.font.color = Color.new(0,255,0) # green
  self.contents.draw_text(0,32,344,32,"Green")
  self.contents.font.color = Color.new(0,0,255)  # blue 
  self.contents.draw_text(0,64,344,32,"Blue")
end

It creates an event and in command to call Script types:

Colors.new It has tested the game and it goes until the event must appear a window as this


(http://i328.photobucket.com/albums/l332/Rafis_Maker/Cores.png)

   
Okay, you've seen a situation we can use the colors.
Now create another script and type the following lines:


Code: [Select]
class Rectangle < Window_Base
  def initialize(height = 544, width = 416, color = Color.new(255,255,255))
super(0,0,544,416)
self.opacity = 0
self.contents_opacity = 125   
self.contents.fill_rect(0,0,height, width, color)
  end
end

Well come on, first create a class with name of rectangles, and the second line
In def initialize I gave 3 arguments, that is, each time you call the script should be
indicate these arguments, but in our case if you notice in front of each argument
already has a value, for example, the argument height is equal to 544, that is if you do not set the
value of the argument when it is already 544, for the same height and color.
In the super I create a window with screen sizes of RMVX line at the bottom and I left the
opacity of the window at 0, ie the window not been visible, but its content is.
In self.contents.opacity, to say the opacity of the contents of the window, and I left at 125.
In line 6 I used a method which draws fill_rect it is used to design a
rectangle filled with a color wherever you want, the syntax of this command and the following:

fill_rect (pos_x, pos_y, width, height, color), or position of the rectangle x, y position of the rectangle, width
the rectangle, height and color of the rectangle that will complete the rectangle.

But before him I used the command self.contents to indicate that the method will be applied to
contents of the window
If you notice our 3's argument initialize were used here (height, width, color)
Look, if the syntax is (pos_x, pos_y, width, height, color), and our well this:
(0.0, height, width, color), or xey are in the position 0, and the width and height are
as defined when calling the script, or if you call when the script does not specify
or a value will be 544 the width and height 416, and color is equal to White (Color.new (255,255,255)
by default as defined in initialize understand?
To better understand you, def initialize if there were
def initialize (rafidelis, pindamonhagaba, cachorro_quente)
And in line 6 were:

self.contents.fill_rect (0,0 rafidelis, pindamonhagaba, hot_dog)

rafidelis would be responsible for the width, height pindamonhagaba would be responsible for
hot_dog and would be responsible for color.
But why? If the names do not have to anything to do?
The name does not matter, what matters and where you position the arguments, or
is in the example above rafidelis was placed where it set the width of the rectangle understand? ^ ^
Well, let us try our script, create an event on the map and draw in command script type:

Rectangle.new

Now test the game and click on the event, should see a window like this:


(http://i328.photobucket.com/albums/l332/Rafis_Maker/SS_janela_cor.jpg)


But because the size of the window is already set and color too?
In method initialize because they already have a value, because if not declared
they already have a default value.
If you do not understand, go back to line 2 and see that each of the 3
arguments already have a set value (eg width = 416)
find good that you should be beginning to understand, because if not
will hinder its development in that class, I suggest that if you do not understand this read
again until please ^ ^

Well back to the event calls the script and replace it with this code:

Rectangle.new(100)

Turn the game and see that the width of the rectangle decreases because you changed the argument width.
Come back again to the event that draws the script and replace it with this code:

Rectangle.new(544.416, COR)

But no test yet, where this writing COLOR, you must place an RGB code, for
facilitate their work below is a list of some of the most important and colors
used and so you copy the code (Color.new (R, G, B))
Where R, G,B are the values so you really think I better leave an example for you to understand:

Rectangle.new(544.416, Color.new (0,0,255))

Now turn the game and see that the color was blue rectangle.
And so one more thing, how about doing a gradient with 2 colors in a rectangle?
First comment out the line 6 (for a comment line you must enter a
# In front of words (Ex: # I am commenting on this line)
And this type below:

self.contents.gradient_fill_rect (0,0, height, width,Color.new(0,255,0),Color.new(255,255,0))

# The two colors are green and blue respectively, turn the game and go to the event which draws
  the script, should see a screen like this:


(http://i328.photobucket.com/albums/l332/Rafis_Maker/SS_janela_gradient.jpg)

Table Of Colors

# White = Color.new = (255,255,255)

(http://i328.photobucket.com/albums/l332/Rafis_Maker/branco.gif)

# Black Color.new = (0,0,0)

 (http://i328.photobucket.com/albums/l332/Rafis_Maker/preto.gif)

Red (Variations of color)

# Red Course = Color.new(255,0,0)
 (http://i328.photobucket.com/albums/l332/Rafis_Maker/vermelho_claro-1.gif)

# Dark red = Color.new(138,0,0)
 (http://i328.photobucket.com/albums/l332/Rafis_Maker/vermelho_escuro-1.gif)

# Red Course² = Color.new(222,34,34)
(http://i328.photobucket.com/albums/l332/Rafis_Maker/vermelho_claro.gif)

# Dark red = Color.new(181,68,68)
(http://i328.photobucket.com/albums/l332/Rafis_Maker/vermelho_escuro.gif)

# Red "Brown" = Color.new(109,30,30)
(http://i328.photobucket.com/albums/l332/Rafis_Maker/vermelho_marron.gif)

# Vibrant Red = Color.new(190,0,0)
(http://i328.photobucket.com/albums/l332/Rafis_Maker/vermelho_vibrante.gif)

Blue (Variations of color)


# Blue Course = Color.new(0,0,255)
 (http://i328.photobucket.com/albums/l332/Rafis_Maker/azul.gif)   
       
# Dark Blue =  Color.new(0,0,100)
(http://i328.photobucket.com/albums/l332/Rafis_Maker/azul_escuro.gif)

# Blue Course² = Color.new(95,95,247)
(http://i328.photobucket.com/albums/l332/Rafis_Maker/azul_claro.gif) 
       
# Dark Blue² =  Color.new(26,26,152)
(http://i328.photobucket.com/albums/l332/Rafis_Maker/azul_escuro-1.gif)   

Green ( Variations of color)

# Green = Color.new(0,255,0)
(http://i328.photobucket.com/albums/l332/Rafis_Maker/verde.gif)

# Dark Green = Color.new(0,83,0)
(http://i328.photobucket.com/albums/l332/Rafis_Maker/verde_escuro.gif)         

# Green "bluish" = Color.new(0,128,192)
(http://i328.photobucket.com/albums/l332/Rafis_Maker/verde_agua.gif)

# Green Lima = Color.new(168,255,0)
(http://i328.photobucket.com/albums/l332/Rafis_Maker/verde_lima.gif)

Purple ( Variations of color)

# Purple = Color.new(189,0,189)
(http://i328.photobucket.com/albums/l332/Rafis_Maker/roxo.gif)

# Dark Purple = Color.new(100,0,100)
(http://i328.photobucket.com/albums/l332/Rafis_Maker/roxo_escuro.gif)

# Purple course  = Color.new(170,0,170)
 (http://i328.photobucket.com/albums/l332/Rafis_Maker/roxo_claro.gif)

Other Colors


# Beige =  Color.new(255,141,141)
 (http://i328.photobucket.com/albums/l332/Rafis_Maker/bege.gif)           
   
# Dark Beige = Color.new(220,106,106)
(http://i328.photobucket.com/albums/l332/Rafis_Maker/bege_escuro.gif)   

#Yellow = Color.new(255,255,0)
(http://i328.photobucket.com/albums/l332/Rafis_Maker/amarelo.gif)

#Orange =  Color.new(255,108,0)
(http://i328.photobucket.com/albums/l332/Rafis_Maker/laranja.gif)
           
# Pink =  Color.new(255,0,255)
(http://i328.photobucket.com/albums/l332/Rafis_Maker/rosa.gif)

# Color of "Wine" =Color.new(128,0,64)
(http://i328.photobucket.com/albums/l332/Rafis_Maker/cor_vinho.gif)
           
# Gray = Color.new(128,128,128)
(http://i328.photobucket.com/albums/l332/Rafis_Maker/cinza.gif) 
     
# Brown =  Color.new(136,82,23)
 (http://i328.photobucket.com/albums/l332/Rafis_Maker/marron.gif) 
______________________________________________________________________
______________________________________________________________________

NOTE: Some parts, the "English" may be bad, because I'm Brazilian, I have difficulty with the English
Title: Re: [RGSS2]Understanding more about colors and RGB values
Post by: modern algebra on January 08, 2009, 02:59:39 PM
Excellent tutorial. Great work!
Title: Re: [RGSS2]Understanding more about colors and RGB values
Post by: rafidelis on January 13, 2009, 10:10:47 PM
Thankz^^