|
|
Skin
Design Manual
|
Skin
Making Manual
Part 4: Using the Data.ini File
The data.ini file is the place where we put all the parts
of the skin together. You can use a template for your skin. Click here for template.
An example of the data.ini file is the
one we use for the default skin:
[GENERAL]
SKINNAME=Oligo
COMMENTS=Design by InKline Global
VERSION=210
[BACKGROUND]
BITMAP=bg.bmp
TRANSPARENTCOLOR=0,0,255
ORIGINALWIDTH=770
ORIGINALHEIGHT=562
WIDTH=770
HEIGHT=562
[BUTTONS]
NUMBEROFBUTTONS=97
[BUTTONINFO]
1=BUTTON_PRINT,540,33,31,31,Print,print.bmp,NULL,1
2=BUTTON_HOME,389,33,31,31,Home,home.bmp,NULL,1
3=BUTTON_STOP,237,33,31,31,Stop,stop.bmp,NULL,1
4=BUTTON_BACK,97,33,31,31,Back,backward.bmp,NULL,1
5=BUTTON_FORWARD,169,33,31,31,Forward,forward.bmp,NULL,1
6=BUTTON_REFRESH,309,33,31,31,Refresh,refresh.bmp,NULL,1
7=BUTTON_INVOKEMANAGER,615,33,31,31,Oligo
Manager,manager.bmp,NULL,1
[SPECIAL]
FAVORITES=464,33,31,31,Favorites,favorites.bmp,NULL,1
MINIMIZE=689,0,29,23,Minimize,minimize.bmp,NULL,1
CLOSE=717,0,28,23,Close,quit.bmp,NULL,1
MENU=43,2,31,24,Menu,menu.bmp,NULL,1
ANIMATOR=687,41,56,35,animator.bmp,8,1,1
GO=GO,go.bmp,NULL
TITLEBAR=123,6,499,15
[WEB]
VIEWER=10,89,752,464
Explaining the data.ini file
[General] (Example
of data.ini file)
You should put the name of your skin, the designer's name
and other comments here. "Version" shows the version of Oligo
this skin is created for. Eg. Version=200 where 200 is version
2.0
You should find out the version from the "About"
box in the menu.
Go to Menu-->Help-->About Oligo.
[Background] (Example
of data.ini file)
- Bitmap - You have to put the filename of the background
bitmap Eg. BITMAP=bg.bmp
- TransparentColor - This should be in RGB format.
RGB is a way of specifying a color.
RGB(0,0,0) is black.
RGB(255,0,0) is red.
RGB(0,255,0) is green.
RGB(0,0,255) is blue.
RGB(255,255,255) is white.
RGB(255,0,255) is purple, (red + blue).
RGB(0,255,255) is yellow, (green + blue) and so on.
You can try different combinations as long as the numbers
do not exceed 255 in any of the three numbers.
For our default browser, Eg. TRANSPARENTCOLOR=0,0,255 (BLUE
is the transparent color)
(Tip: Try to use a primary color as the transparency may not
show up well on some systems.
- OriginalWidth & OriginalHeight - Input the dimensions
of the original bitmap size.
Eg. The ORIGINALWIDTH=770 and ORIGINALHEIGHT=562
- Width & Height - These values are dynamic and
are generated by the program.
[Buttons]
(Example of data.ini file)
You should put in the number after you have decided how many
buttons you will use for the browser so leave this last. Eg.
for our skin we have 7 buttons so, NUMBEROFBUTTONS=7
[ButtonInfo] (Example
of data.ini file)
- The buttons should be always numbered from 1 to another
number (but max is 12, because there are only up to 12 different
buttons for customization.) If you include all 12 buttons,
they will all show up in the browser.
Tip: Removing Buttons
- When you remove a button, you should remove the entire line.Make
sure that after you have removed a number, you re-arrange
the numbers again so that they are in sequence. If they are
not insequence, these buttons may not show up.
- Once you have the numbers sorted, all in sequence, enter
the last number into the "NumberofButtons" under the [Buttons]
section. so if you took out 8, 9, 10, 11and 12, the "numberofbuttons"
under the buttons section should read 7 instead of 12.
Q. What do the values in the lines
mean? (Example of data.ini file)
Taking the example of the button "PRINT":
1=BUTTON_PRINT,540,33,31,31,Print,print.bmp,NULL,1
This is the breakdown:
1=button name,x,y,width,height,tooltip
text,enabled bitmap filename,disabled bitmap filename,a
Where:
- Button name is a "preset name"
and should not be edited. Eg. if you want to use the PRINT
button, you MUST USE "BUTTON_PRINT" in the button name value.
Here
is a list of button names for your reference.
BUTTON_PRINT for print button
BUTTON_HOME for home button
BUTTON_STOP for stop button
BUTTON_BACK for back button.
BUTTON_FORWARD for forward button
BUTTON_REFRESH for refresh button
BUTTON_INVOKEMANAGER for invoking the Oligo Manager to
organize favorites.
BUTTON_CUT for cut button
BUTTON_COPY for copy button
BUTTON_PASTE for paste button
*BUTTON_EDITSOURCE* for edit source button
*BUTTON_WORKOFFLINE* for work offline button
[*These two buttons are not included in the default
skin. But you can include them
in your data.ini if you wish to use them in your
skin*] |
- x is the left point where the
button should be placed. x=0 pixels when you count from extreme
left. Here the x value for the PRINT button is 540.
x,
y, width and height values
- y
is the top point where the button should be placed. y=0
when you count from top downwards.
Here the y value for the PRINT button is 33.
- width is the width of the button
in pixels. The button has a width of 31 pixels.
- height is the height of button
in pixels. The button has a height of 31 pixels.
- tooltip text is the text that
will be shown when the cursor mouse is over the button.
Eg. 
- enabled bitmap filename is the
filename of the enabled button. Eg. button_print.bmp
- disabled bitmap filename is the
filename of the disabled button. Eg. The value of the disabled
bitmap filename is NULL for the "PRINT" button as
there is no disabled button for it.
- a=1, the button will resize
when the browser is stretched. a=0 means
no resize.
Eg. The value for a is 1 for the PRINT button and this makes
it stretchable.
Tip: The buttons can be resized
when the user resizes the browser. This may cause some distortion
to it. You can turn off resizing by putting "0" in the value
for 'a' so that it does not become distorted. However, this
may cause other problems like buttons that are placed close
together may overlap when the browser is resized smaller.
IMPORTANT:
There should not be any spaces in between. So you should do
it like this:
1=BUTTON_PRINT,540,33,31,31,Print,print.bmp,NULL,1
[SPECIAL] (Example
of data.ini file)
This includes Menu, Minimize, Close, Favorites, Go,
Animator and Titlebar.
IMPORTANT: You must include
the Menu, Minimize, Close, Favorites and Go buttons. If you
delete or input incorrect values, the browser WILL NOT LOAD.
Menu, Minimize, Close and Favorites have the same value sets
as the usual buttons, like: Item=x,y,width,height,tooltip
text,enabled bitmap filename,disabled bitmap filename,a.
(For more information on what these values are, click
here)
The Animator has the following
values:
Animator=x,y,width,height,enabled bitmap
filename,frames,time,a. (more about
values)
-frames being the number of frames of the icon.
-time in milliseconds. This controls the rate of animation.
Eg. ANIMATOR=687,41,56,35,animator.bmp,8,1,1
This animator has 8 frames and each frame rotate at 1 milliseconds.
Tip: If you put "NULL" in the enabled
bitmap filename, it loads the default animator, so that you
do not need to design one.
Tip: You can control how fast the
frames change or how fast is the animation by adjusting the
time value. The recommended value is 5 milliseconds.
The Go button is always fixed after
the address bar.
The values are: Go=tooltip,enabled bitmap,disabled
bitmap.
Eg. GO=go,ButGo.bmp,NULL 
The Titlebar holds the location
of the title bar.
The values are: Titlebar=x,y,width,height
Eg. In our default skin, the value for TITLEBAR=123,6,499,15 means
that there is a titlebar. If you do not want to put in a
titlebar,
you should leave the values as TITLEBAR=0,0,0,0.
[Web] (Example
of data.ini file)
The Viewer has the following values:
Viewer=x,y,width,height
IMPORTANT:
The width of the Viewer must be at least 470 pixels.
If not your skin will not load.
Tip: You will need to make the
viewer height more than what you expect since the viewer contains
the components below:
-an area for an ad banner (in ad supported versions of the software),
-the address bar (the place where you type in the web address)
-viewing area and
-the status bar (which shows the current action).
|
|
