Endless Paradigm

Pages: 1 2 3 4 5 6 7

RCOMage Tutorial :

What's needed :
RCOMage v1.2 «--- (you can find it at the bottom) Source : Original Thread
Clean RCO files for editing (you can get them from Power Tools Thread)
Notepad2 «--- needed for editing XML files (you can find it at the bottom)

ReadMe included with the app :

Code:

			General RCOXML structure
 ------------------------
The following should give you a general idea of the general structure for an RCO file.  Not all nodes below are required, and various object/anim entries are omitted.

RcoFile - XML root element; generally does not need to be modified
	MainTree - root RCO node from which everything must descend from
		VSMXFile - attached UMD virtual machine instruction code, for UMD and some LFTV RCOs.  Only one may exist in an RCO file
		ImageTree - parent node from which all image resources descend from
			Image
			Image
			...
		ModelTree - parent node from which all model resources descend from
			Model
			Model
			...
		SoundTree - parent node from which all sound resources descend from
			Sound
			Sound
			...
		ObjectTree - parent node from which all object pages descend from
			<Page>
				page objects go here
			<Page>
				page objects go here
			...
		AnimTree - parent node from which all animation sequences descend from
			<Animation>
				animation entries go here
			<Animation>
				animation entries go here
			...

************************************************************************************************************************
************************************************************************************************************************

Quote:OK i used system_plugin_fg.rco , had a real hard time asking around about how to do the animation ,
V1 helped Me also Zing , and Schmilk without to know his RCO helped me a lot.

How To :

Ok here ill give you some captures where you could see the changes i made
and compare with your original RCO XML file.

Most important! = Never Break The Cycle.

= its like an interweb Code Example : [animation]*******[/animation]
= When you start a tag , close it when your done, or --» (premature error)

* as you can see the Read Me file upthere the first TREE to edit is the:

IMAGETREE :

Spoiler for imgCapture :

Spoiler:

* in this tree you should add your images ; where you extracted the RCO
    and where your XML file + (images) folder is, inside you should put the new images
    you want to add to your RCO through the XML file.

* you have to understand what type of image you are use , i suggest PNG indexed.
    as you can see in the image i added ,
    for compression input Uncompressed

OBJECTTREE

Spoiler for ImgCapture :

Spoiler:

* in here you should make from your images Objects wich later will be used in
    the animation.

1* You must find in your edited RCO where the images have links(2*[onload=]) so you can
    link the images you added in the IMGTree.

3* Create an entry there , this way you will have a name for FIRE EVENT to use.
    = Name it whatever you want , but remember it because later you ll need it.

ANITREE (animation)

Spoiler for ImgCapture :

Spoiler:

1* In the animation tree now you input the name of your animation,
     use the one you set in the object tree (objecttree step-2*)

2* Observe the image i posted. This is for FADE (better use RECOLOUR) command.
     im not quite familiar with the commands yet. So i leave
     this journey for you to explore.

3* Look at the section 3 in the image , look how i used the NAME
     and then the FIRE EVENT. They must be the same or if you want
     you can link it to another animation like i did in the 2* i linked it to the 3rd selection.

*********************************************************************************************************
*********************************************************************************************************

Happy editing ....
also a bonus from me thanks to V1 and Zing ...

[attachment=3529]
This is how MOVETO looks like.

And also the commands are :
"MoveTo", "Recolour", "Rotate", "Resize", "Fade", "Delay", "FireEvent", "Lock", "Unlock", "SlideOut", ""

thanks , you know who you are.

If you don't understand me , look Here

nice guide! Madwin

Tha guidelines!!

HEhehe yeah, thanks man.

Do you know how the "Lock", "Unlock", "SlideOut", animations work?
I have never seen them before. Can you tell me a little more about it.

Oooh yay tutorials!

I always grab tools and have no idea what the fudge I'm doing... (main reason why I haven't made a single theme for CF.)

look's like I can understand this...

...maybe.

WoobiE Wrote:Do you know how the "Lock", "Unlock", "SlideOut", animations work?
I have never seen them before. Can you tell me a little more about it.

Yes i want to know also , i know the basic stuff.
Trying is the answer ... or wee should find an rco
in wich is used this command and voila.
i found it out only yesterday and wrote it down
for remembering , and also nobody else did this before.

Why?

Nice tutorial!

Just a few corrections:

gsmoke Wrote:* you have to understand what type of image you are use , i suggest PNG indexed.
as you can see in the image i added ,
for compression Use NONE (it might generate warnig in the app) «- no worryes

Should be "uncompressed" I think.
It defaults to that anyway. I believe the PSP will only accept uncompressed PNG (PNG is already compressed anyway).

gsmoke Wrote:And also the commands are :
"AnimTree", "Animation", "MoveTo", "Recolour", "Rotate", "Resize", "Fade", "Delay", "FireEvent", "Lock", "Unlock", "SlideOut", ""

AnimTree and Animation aren't actually commands - the former is where the anim sequences are stuck, and the latter just defines a sequence.

WoobiE Wrote:Do you know how the "Lock", "Unlock", "SlideOut", animations work?
I have never seen them before. Can you tell me a little more about it.

I don't know what Lock/Unlock do. Actually, as for the name, I just guessed them, so they may not even be accurate.
SlideOut is a weird one. It's ID doesn't fall in sequence with everything else, and it only seems to work once. Can see an example if you dump opening_plugin.rco

By the way, whilst I'm here, I'll post up the rcomage tutorial I wrote but didn't complete if it helps anyone:

Spoiler:

Introduction
This guide aims to explain how to add animations using Rcomage, focusing mostly on background animations.
This guide does assume knowledge of the XML format, however, even if you don't know it, it should be easy to pick up (basically, it's a text-based type of file which defines hierachical data; if you know HTML of even bbCode, it should look somewhat familiar).

I'll also walk through an example.

If you haven't done so already, you should get a copy of Rcomage and dump system_plugin_bg.rco and take a look at the XML file.  I also recommend using a _proper_ text editor (ie, not Windows' Notepad) for editing the XML file (I personally suggest Notepad++).

About RCO Animations
RCO animations are basically a sequence of actions the PSP takes to perform the animation.  To add your own, you basically define the animation sequence.  The animation sequence defines what to do (eg move, resize etc) and what objects to apply to.  Once you've defined your animation sequence(s), you need to specify a trigger - typically when a particular object is loaded, or perhaps, after another animation sequence has finished playing.

These animation sequences are defined inside the <AnimTree> (if it doesn't exist in the particular RCO, you can just add it).  The sequence is defined inside <Animation> tags.
When the animation sequence is triggered, the PSP executes the "instructions" in the animation sequence in order specified.  The instructions are run in parallel, that is, all at the same time, until a <Delay> instruction.  At that point, it will delay for the amount specified and then continue executing as before.

Animation Instructions
The following are the known types of instructions which may placed between <Animation> tags.  Most are transformations and will look something like this:
<Transformation object="object:obj_name" duration="time_in_miliseconds" unknownInt1="0" additional_properties />

Here's the list of transformations, with the additional properties in brackets:

MoveTo (x, y, unknownFloat4=0): moves the specified object to x/y coordinate; like for all coordinates in RCOs, 0,0 is the centre of the screen, negative x values are to the left, and (from memory) negative y means above the centre
Recolour (red, green, blue, alpha): apply colour strengths specified to the object; as with ordinary colour strengths values, 0 means no colour, 1 means full colour, >1 means more than full colour
Rotate (x, y, z): performs a 3D rotation on the object; x/y/z are angles to rotate, measured in radians. if x=0 and y=0, this is just a 2D rotation of z radians.
Resize (width, height, unknownFloat4=1): rescales the object, if memory serves me right, specified width/heights are scales, not dimensions. That is, width=1.5 means "make the width 1.5x the original width"
Fade (transparency): Changes transparency of object; this is subtley different to Recolour in that it doesn't change colour strengths
SlideOut (xspeed, yspeed, xcompress, ycompress): this is a weird one and doesn't appear to be used much; try it yourself I guess. Appears to be different in that it only works once? Also its ID is rather different from the above instructions' IDs...

Other non-transformational instructions:

<Delay time="time_in_miliseconds" />: delays further animation by specified amount
<FireEvent event="event_or_anim" />: executes the specified event or animation; note, this event/anim name should be prefixed with "event:" or "anim:"
<Lock unknownInt0="0xFFFFFFFF" />: this and it's "Unlock" variant - dunno what it does; where'd I get the name from? I made it up :P

Examples
Well, that's about it for animations.  So I'll give you 2 examples on how to apply it.

Example Animation
Here's an example animation I made which I'll guide you through.  Can grab the files here:
[attachment=3535]

Okay, dump a clean system_plugin_bg.rco file.  First wee add the two images by creating an <ImageTree> directly under the <MainTree> line and adding the images to the ImageTree:

XML Code

				<MainTree name="system_plugin_bg">
		<ImageTree>
			<Image src="bg.png" name="tex_bg_cover" format="png" compression="uncompressed" />
			<Image src="highlighter.png" name="tex_highlighter" format="png" compression="uncompressed" />
		</ImageTree>

The src attribute merely specifies where the image file wee're adding is stored, the name wee make up ourself. Wee're using PNG images, so set format as "png". Alternatively, wee could put format as "gim" and Rcomage will convert the supplied PNG into a GIM, but this is unnecessary (though would work). For PNGs, you should leave compression as "uncompressed", however, for GIMs, you should set this to "zlib".

Now wee want the images to actually show up on the XMB, so wee add the objects. These will be "Plane" type objects. Wee'll place this over the 01-12.bmp background thing (named default_theme_plane) by adding the objects directly under it.

XML Code

							<Plane name="default_theme_plane" posX="0" posY="0" objectScale="0" redScale="0" greenScale="0" blueScale="0" alphaScale="1" width="480" height="272" posUnknown="0" scaleWidth="1" scaleHeight="1" elementScale="1" iconOffset="0x0" onLoad="nothing" image="nothing" unknownInt18="0x0"></Plane>
				<Plane name="obj_bg_highlighter" posX="-380" posY="0" objectScale="0" redScale="1" greenScale="1" blueScale="1" alphaScale="1" width="279" height="272" posUnknown="0" scaleWidth="1" scaleHeight="1" elementScale="1" iconOffset="0x0" onLoad="nothing" image="image:tex_highlighter" unknownInt18="0x0"></Plane>
				<Plane name="obj_bg_cover" posX="0" posY="0" objectScale="0" redScale="1" greenScale="1" blueScale="1" alphaScale="1" width="480" height="272" posUnknown="0" scaleWidth="1" scaleHeight="1" elementScale="1" iconOffset="0x0" onLoad="nothing" image="image:tex_bg_cover" unknownInt18="0x0"></Plane>

Note that I've also changed the RGB colour strengths for the default_theme_plane object.  Since wee want a black background, the 01-12.bmp picture is of no use, so I'll conveniently just make it black by setting the colour strengths to 0.
As for the added entries, I just copied it from "default_theme_plane" and modified the various things that needed modifying.  This includes the names (make up any arbitrary name that isn't already used), the width and x position for the highlighter image (this image will initially be off the left side of screen) and the image property - for this, set it as a reference to the images wee added earlier.  Note that the prefix "image:" is required.

Now, wee've got the thing displayed on the XMB.  All that's left is the animation part!
Add the following within the <AnimTree> (preferrably just before the </AnimTree> line):

XML Code

						<Animation name="anim_bg_highlighter">
				<MoveTo object="object:obj_bg_highlighter" duration="1500" unknownInt1="0" x="380" y="0" unknownFloat4="0" />
				<Delay time="6000" />
				<MoveTo object="object:obj_bg_highlighter" duration="0" unknownInt1="0" x="-380" y="0" unknownFloat4="0" />
				<FireEvent event="anim:anim_bg_highlighter" />
			</Animation>

Hopefully you'll be able to see the intuition behind this sequence.  Basically, it tells the PSP to move the highlighter object towards the right.  Note again that the "object:" prefix is required for the object reference.  Duration times are in miliseconds, so the first action is to move the highlighter from off the left side of the screen, over to and off the right side of the screen, taking 1.5 seconds.
The next action is to wait for 6 seconds.  Remember that this wait is triggered at the beginning of the previous action.  In other words, this line effectively waits 4.5 seconds after the highlighter has finished moving off the right side of the screen.
After that, the highlighter is moved back to the left of the screen, with a duration of 0, meaning this isn't animated.  Then the animation is fired again, making this a looping animation.

Only one thing left to do now - trigger the animation.  Wee want this animation sequence to start executing when the objects are loaded.  So pick one of the background related objects, say default_theme_plane (it doesn't really matter which though) and modify the onLoad attribute to the animation sequence wee just made.  It should look something like:

XML Code

							<Plane name="default_theme_plane" posX="0" posY="0" objectScale="0" redScale="0" greenScale="0" blueScale="0" alphaScale="1" width="480" height="272" posUnknown="0" scaleWidth="1" scaleHeight="1" elementScale="1" iconOffset="0x0" onLoad="anim:anim_bg_highlighter" image="nothing" unknownInt18="0x0"></Plane>

Ok thanks mate. I'll take a look at it.

excellent guide Madwin

maybe eventually I'll finish up the theme I've been working on.
just don't have much motivation anymore Emptyone

Excelent addon Zinga , if i saw it before i might do the thing better.
For the animation command i give is just mistake from my part.
I just copy paste your post.

Pages: 1 2 3 4 5 6 7

gsmoke

Vegetano1

gsmoke

WoobiE

Cirehpsa

gsmoke

ZiNgA BuRgA

WoobiE

Nothingface420

gsmoke