How to skin Rainlendar 2

Rainy hasn’t documented the skinning of RL2 yet, so I thought I would start with explaining some general aspects of it relating to the Shadow skin.

Skins are saved to a compressed file zip file renamed with a .r2skin extension. One can develop their skins in a new folder under the skinning directory.

At the root of the zip file is a file called skin.xml; this is the heart of the skin. While I do believe you can put all your xml code here, what Rainy does is put his code for specific windows in their own file (calendar, events list, todo list). These are put in the xml directory then referenced to in skin.xml using an include element.

Skin.xml: The fist part is <info> which is what is displayed when the person clicks on the skin from the options menu (the details panel), very self explanatory. Next is the variables. Each window can have its own set of variable that can be changed from the advanced options. Here are the attributes I know of:

Variable element Attributes:[quote]
name: The variable, what ever is entered here is then referenced to in other xml by using %name_value%. Note that the underscore is used instead of spaces. The name is also what is used when the user goes into the advanced skin settings.

default: The starting value for the variable.

window: Which window is the variable associated with.

description: Along with ‘name’ this is what will show up in the details panel when the skin is selected.
[/quote]
images/: Not much to say here, a bunch of images that are used with the skin. Elements.xml handles referencing the images.

xml/elements.xml: I won’t go into much detail but I’ll break it down by element.
Some common attributes are:
id: Used for referencing the element elsewhere, can be whatever you want.
file: Usually the location of an image.

Elements:[quote]
bitmapfont: a way to use images as a font. I really don’t know how to work this one out so someone else might pitch in if they find out.

bitmap: Creates a reference to an image you can use elsewhere.

font: A way to describe a font that can be referenced by the ‘id’ given.
[/quote]
This is probably the best part of elements.xml. Specifying the appearance to a category is done in the <categories> element. A new category appearance is created with <category id=””> where the ‘id’ is the name of the category used in the calendar.
Appearance:[quote]
target: This attribute specifies what ‘window’ is the target. I will give a list of what I know the numbers reference to in my next quote.

layer: Think of each category as though it had a level at which it reside and the user is looking at it top down. If one category is at “1” and another is at “2” then the category at 1 would fall behind 2.

priority: I can’t really say to much on this, the higher the number the higher its priority. I don’t really know how different it is from layer or the best way to use the two, but I’m sure there is a good use.

element: Reference to an element specified above. Use the elements ‘id.’

color: Used with fonts this uses red, green, blue, transparency(255: opaque). Actually I really don’t know so please take this with a grain of salt and maybe have some stake with it.

align: Alignment. I don’t know all the values for this, I tried TOP_RIGH,T but it gave me the same this as TOP_LEFT. I’ve also seen CENTER.
[/quote]
Target:[quote]
1: The Calendar.
2: Events List.
6: Todo List
8: Alarm.
16: Tooltip.
[/quote]
Add the numbers together to obtain multiple windows.

scripts/ Rainy isn’t actually using the scripts in this directory, he has commented out the code that imported them in elements.xml. These scripts can be found in the Rainlendar application directory. I have been told that scripting as it should be has not be implemented yet, he has only got it to the point that the old skin can be supported. I am looking forward to exploring this.

I’m done for now. I will need to update to the latest skin, as this was written during the beta stage. I may later explain each “window” xml file, and the more I’m bugged for explanations the more likely I will write one.

If you are going to change category names there are three places you must go.

  1. The elements.xml file.
  2. Each event that uses the old category name.
  3. In the advanced options there is a field &quot;DefaultCategories,&quot; That sould also be renamed.

It might be a good idea to change 3 before 2. Either way changeing one will not change the other.

Hello, I am sorry, but in spite of my goodwill and the translator integrated into the forum, I do not include/understand anything with these instructions. If somebody could indicate to me as good French the method to create a skin with the format &quot;r2skin&quot;, I would be eternally grateful to him. Thank you!

Hi,

I’m new to Rainlendar2 and skinning and I’ve had a problem with a very minor skinning attempt.

I’m using the default ‘Shadow4’ skin but find the red circular ‘Today’ marker to be a bit too fat and obscures the date.

So, I tried to amend the graphic by unzipping the ‘r2skin’ file, finding the ‘Today.png’ file, loading it into Photoshop, changing the circle to a thin square (without changing the resolution of the bitmap) and re-saving the file.

When I re-zip the file into it’s r2skin format, copy it back into the skins directory and refresh the calendar, the skin isn’t shown i.e. it seems Rainlendar doesn’t recognise the file anymore.

Any suggestions as to what I’m doing wrong? Is it a particular format of PNG file or something?

Thanks.

Post edited by: andygrunt, at: 2006/11/29 09:33

Maybe…did you zip the complete &quot;shadow&quot; and not only the files?
like:
>shadow
>>skin.xml
>>xml
>>>files…
>>images
>>>files…

the zip-file must contain only
>skin.xml
>xml
>>files…
>images
>>files…

Post edited by: anja, at: 2006/11/29 09:47

Yep, that was it :slight_smile:

Fixed now, thanks.

One thing I did to make the today marker a little less obtrusive, was to edit the xml/calendar.xml file and change the <today> element to have layer=&quot;-10&quot;.

It should look like this when you are done:

[code:1]<today>
<appearance layer=&quot;-10&quot; element=&quot;bitmap.today&quot; align=&quot;CENTER&quot; />
</today>[/code:1]

This places the today marker behind all of the other elements in the calendar (like the date number, the event bitmaps, etc.)

One thing to note though, is this fix only works the type of calendar that you change it on.

For instance, if you change the xml/calendar.xml file, then switch to the long calendar format, the edit will not be shown. To fix that one, you will need to change the xml/long calendar.xml file to fix it for that format. The same goes for the other calendar types that you might be using.

Thanks for the alternative suggestion but I’ve changed the today marker bitmap now and I’m happy with the new version.

Hello !

I would like to add a few buttons to my skin, to toggle windows, but I don’t know the actions for the xml file.

I tried a few guesses from what I saw in various skins, but I could not find any xml version with toggle buttons…

And also, is it possible to assign several actions to one button? i.e. I would like to toggle both eventlist and todolist in one click.

Thanks a lot !

The actions are functions in the lua-scripts. If you take a look at the windows.lua file in the Rainlendar’s scripts folder you can see the window related functions. You can for example toggle the todo list like this: action=&quot;Global_ToggleWindow(Todo List)&quot;

It’s possible to run only a single function so if you want to do complex you have to create a new function for it. E.g. something like this:

[code:1]function Global_ToggleTodoAndEvents()
local todoVisible = Rainlendar_IsWindowVisible(&quot;Todo List&quot;)
local eventVisible = Rainlendar_IsWindowVisible(&quot;Event List&quot;)
if todoVisible or eventVisible then
Rainlendar_HideWindow(&quot;Todo List&quot;)
Rainlendar_HideWindow(&quot;Event List&quot;)
else
Rainlendar_ShowWindow(&quot;Todo List&quot;)
Rainlendar_ShowWindow(&quot;Event List&quot;)
end
end[/code:1]

Post edited by: Rainy, at: 2007/01/07 13:10

Thank you for the tip about where to find the functions.

And thank you for the new function, I wouldn’t have come to it by myself.

Is there any way to put this function in a lua file in the skin\script folder, so that it won’t be overwritten by an update ? (not a critical issue, if I ever update rainlendar I can copy/paste it back in a couple of secs.

And most of all thanks for this very lively forum.

You can just create new file for the function. Rainlendar reads all .lua files from the scripts folder. Or you can also put the lua file to the skin archive but in that case you need to define the script file with the <script> element.