this tutorial is going to go through how to make a vista sidebar gadget of your own usiing swishmax, notepad and paint.
Files that are needed for the sidebar gadget.
Html File, Swf File, Xml File and a PNG file. compiled together to make a .gadget file.
Step.1
open swishmax your canvas for the gadget must be no more than 130 x 130 pixels, this is your maximum size. in this tutorial we are going to make a simple digital clock gadget just to get you familiar how to make one, once you know and understand the possibilities will be endless. so make your movie 130 pixels wide x 60 pixels high.
any colour background, i have chosen white, the font colour i have chose Black and the font size i have chose 28 as the size.
Step.2
create a dynamic text box and name it time
add the following code to Scene_1 of the movie.
mydate = new Date();
Hours = mydate.getHours();
Minutes = mydate.getMinutes();
Seconds = mydate.getSeconds();
if (Minutes<10) {
Minutes = “0″+Minutes;
}
if (Seconds<10) {
Seconds = “0″+Seconds;
}
time=Hours+” : “+Minutes+” : “+Seconds;
}
Step.3
save the file as digital_clock, then export as html+swf as digital, you then need to edit the html file that you have just created by the export and add the following javascript to the head section of the html file, you can edit the file with notepad.
document.onreadystatechange = function()
{
if(document.readyState==”complete”)
{
document.body.style.height = 60;
document.body.style.width = 130;
document.body.style.margin = 0;
}
}
</script>
Step.4
Now open up Notepad and add the following code to it and save as gadget.xml
<gadget>
<name>Simple Digital Clock</name>
<namespace>www.loweonline.co.uk</namespace>
<version>1.0.0.0</version>
<author name=”Craig Lowe www.swish-designs.co.uk www.loweonline.co.uk”>
<info url=”www.loweonline.co.uk” />
</author>
<copyright>2009</copyright>
<description>Simple Digital Clock
<icons>
<icon height=”48″ width=”48″ src=”gadget.PNG” />
</icons>
<hosts>
<host name=”sidebar”>
<base type=”HTML” apiVersion=”1.0.0″ src=”digital.html” />
<permissions>Full</permissions>
<platform minPlatformVersion=”1.0″ />
</host>
</hosts>
</gadget>
Step.5
now you need to take a print screen of the movie running, and make it into an icon for your gadget dimensions need to be 48 x 48 or 64 x 64 save as gadget.png
Step.6
Now all thats left to do is to compile the four file you have just created into one gadget instalation file, the way this is done is with a zip program such as winzip, select all four files right click on one of them and select add to archive select zip but rename the zip to gadget and save. you should end up with a gadget instalation file if you have done this corectly.
Double click the instalation file and you gadget will be displayed in your windows vista sidebar, the instalation file can then be shared with others, however if you are going to share the file it is a good idea that you zip the file.
Enjoy making your vista sidebar gadgets.
Buy the files that go with this tutorial for £3.00
you will get
digital.html
digital.swf
gadget.PNG
gadget.xml
digital_clock.swi (swishmax source file)
digital.gadget (sidebar gadget installation file)
Social Connect
Login with one of the following.Enter your WordPress.com blog URL
http://.wordpress.com
Proceed