|
Object Properties Overview
So let’s create an object. To do that you
will need to be in the DesktopX development environment (i.e. have the DesktopX
builder loaded). Then either right click on its system tray icon and choose “new
object” or from the builder dialog go to the desktop tab and press the “New”
object button.
The object properties dialog has 4 pages:
-
General
-
Relation
-
States
-
Summary
Object Properties: General Tab

The General tab on the object properties dialog
Object Label field
This field lets you specify a text label for your object. This is much like the
label you’d have for an icon.
Object Type
This specifies what type of object. Default is “Layer” which is just a techie
word for “a picture that’s really not doing anything but looking pretty”. By
pressing the “Change..” you load a dialog that displays other object type
options.
Object types include:
-
Shortcut. This links to a given program on your computer.
-
URL. This has the object link to a particular website.
-
Object Controller. This tells the object to perform some action on another
object.
-
Taskbar. This tells the object that it is to list the running tasks.
-
SysTray. This tells the object that it is to use the
system tray (note, this requires the MCP service to be running to be accurate).
-
System. This means that the object is to represent a special system command such
as the Find dialog, Shut down, log off, etc..
-
DesktopX Builder. This tells the object that it is to perform some DesktopX
specific command.
-
Widget. This means that if this object is exported as a widget that it will
function as some widget specific feature (such as closing the widget).
Default Appearance
This allows you to control how the object is going to look by default.
New Script
The “New” button will allow you to start working on a new script for the object.
See the 5.2 Developer's Guide: Scripting
sections & get the separate "Scripting Guide"
(PDF) to learn more on scripting.
Additional Abilities
More features can be added to DesktopX objects by loading a
plug-in. Plug-ins are
add-ons to DesktopX created by either Stardock or third-parties. Popular
plug-ins
include DXPlayer which comes with DesktopX and enables users to easily create
media players, DXPerf which also comes with DesktopX that makes it easy to
create performance monitoring objects.
When a plug-in is added, it will need to be selected and then configured.
Object Properties: Relation Tab

The Relation tab.
The relation page is designed to allow you to control how this object will
interact with the desktop and you.
| Action |
What it does |
|
Visible |
This determines whether the object’s initial state is visible or not. |
|
Z-Order |
This option controls the relative Z position of the object. Options are Desktop
(like icons), Normal (like programs) or always on top. |
|
Movement |
This controls how and when an object can be moved around. There are many times
when you may wish for an object not to be moved. However, even when an object is
locked, it can still be moved by holding down the CTRL key when selecting it. |
|
Activation |
This controls when the object will receive messages from the mouse. That is,
whether the mouse cursor actually needs to be on the visible part of the object
or just near it or not have it react to mouse messages at all which can be
useful if you want to make the object semi-transparent and therefore have the
object UNDER that object be what reacts to the mouse messages. |
|
Start with |
This controls what is necessary to make the object “execute”. Single click,
double click, mouse over or mouse down. |
|
Popup |
This determines whether this object is a pop-up object. Pop-up objects are then
controlled by other objects that are of the class “Object Controller”. The types
of pop-ups are: |
-
Static
-
Toggle (turn on and off)
-
Menu (acts like a Windows menu – as soon as something else is clicked, it hides)
-
Volatile (hides when another pop-up is opened, great for working with multiple
pop-ups).
|
|
Cursor |
This controls whether the mouse cursor changes when it is over this object. For
instance, a text link object may want to have the mouse cursor change to the
hand mouse cursor. |
|
Position Adjusting (for resolution independence) |
Objects can be set to move themselves upon resolution changing. For instance,
the object’s position can stay relative to the center the screen or to a given
edge when the resolution changes. |
Object Properties: States Tab

The States tab.
The states tab of the object properties is the most complex page in all of
DesktopX. That’s because states, like messages, are what make objects different
from say icons. DesktopX objects can have an infinite number of different
states.
For instance, a printer object might have its “default” state and it might have
a “printing” state and it also might have a “paper out” state and a “out of ink”
state and so forth. Each state can have its own image, color, animation, sound
effect, etc.. And upon a “State change”, a message can then be sent. So perhaps
that hypothetical printer object, upon changing to “out of ink” state could then
send a “Printer Attention” message to a “Administrative” object that, using some
scripting, sends an email to the system administrator.
Everything listed below in this section can work on a per state basis.
| Action |
What it does |
|
Add (state) |
This option allows you to add another state. There are some built in ones that
have to do with mouse actions (mouse over, mouse away, mouse down, etc.). |
|
Remove (state) |
This removes the selected state. |
|
Copy from.. (state) |
This option will copy the state data from an existing data (a time saver). |
|
Reset (state) |
Resets the selected state to the default settings. |
|
Appearance (tab) |
The contents of this tab allow you to control what the object looks like in the
selected state. You can choose “Image” to have a bitmap represent the state or a
text. Note that all states have to be either an image or a text (you can’t have
some states be text and others be an image). |
|
Image (based states) |
States that are represented by images are just a matter of selecting a ICO BMP,
TGA, or PNG to represent that state. |
|
Text (based states) |
States represented by a text field have more options such as selecting the font,
selecting the color of the font, selecting whether it has a border, whether it’s
anti-aliased, etc. Text will word-wrap if it becomes larger than its specified
size. |
|
Animation (tab) |
This determines the animation settings for this state. If the image is a “bit
strip” (an image with frames of animation in it horizontally) then you would set
the number of frames involved.
The static animation option indicates that the image only has one frame in it (a
single static image) but that want it to have multiple animation frames anyway.
This is useful on the transparency page where you might want to have the image
pulsate from 20% opacity to 100% in 20 steps (frames).
The loop option will tell the animation to keep playing. Interruptible
determines whether the animation will fully play out its animation on a state
change or stop immediately (if there are multiple states involved, you will
probably want this option selected). Scripted means that which frame is
displayed is controlled via a script.
The style determines which direction the frames will be played. |
|
Transparency (tab) |
This tab determines whether you want the object to be fully opaque or not. The
default is no transparency. However, options include having 0% to 100% opacity
or having it vary from X% to Y% in conjunction with the static image animation
option.
If it’s a bitmap that contains alpha blending information, you can use the
bitmap contains per-pixel alpha blending information. PNG files tend to include
an alpha channel in which case this option will be hidden. |
|
Shadow/Glow (tab) |
Objects can be given a shadow. Sharpness determines the size of it. Darkness is
on a scale from 0 to 255. Offset determines how many pixels the shadow is
offset. |
|
Color (tab) |
An object’s hue, brightness and contrast can be controlled here. So you could
easily have an object’s “mouse over” state have its contrast increased 50%
through this option. |
|
Sound (tab) |
When the object’s state changes to the selected state, a sound can be played (or
even looped for as long as it is in that state). Be the most popular guy in the
office by having a really obnoxious sound play and loop… |
|
Messages (tab) |
When an object changes to the selected state, you can have a message be sent to
another object. This will change that object to the state of the same name. |
Object Properties: Summary

The Summary tab.
The summary page provides some information for the object and allows the
you to configure the object in general. The X, Y position of the object is
displayed here. The Windows desktop uses the X,Y coordinates with (0,0) is the upper, left corner
of the screen. Positive numbers
count down (Y) & to the right (X). You can also control the size of the object by setting its width and height. Note that changing the height and width of some objects can have some nasty side
effects (such as if it’s an animated object).
You can also assign a tooltip to the object here.
| Action |
What it does |
|
Object ID |
The object ID is very important. By default, objects do not have a name (an ID).
In order to interact with a particular object, it needs a name. You can click on
the Object ID field “(unassigned)” by default to change its name. |
|
Parent/Owner |
You can also set what its parent object is if applicable. |
|
Child |
The child option determines whether the object has been merged as part of the
window of a parent object. |
|
Group |
If the object is part of a group, it’ll be displayed here.
|
|
Widget |
If the object was imported, it will be given a “widget” ID which allows DesktopX
to try to keep it distinct from other objects. It’s through this that it knows
what objects are “Related” to it. |
Basics
Creating objects
So let’s create an object. To do that you will need to be in
the DesktopX development environment (i.e. have the DesktopX builder loaded).
Then either right click on its system tray icon and choose “new object” or from
the builder dialog go to the desktop page and press the “New” object button.
When you select this a basic object will appear on the desktop ready for you to
customize.
When you do this the 'Object Properties' dialogue will also be displayed to
allow you to start configuring your object.
Object types
To change the object type, click the 'Change' button next to
where it says 'Type of object' in the ‘Object properties’ dialogue.
This will present you with a list of the other basic object types you can use
without having to even consider plugins or script.
Once a type is defined, the activity associated with that object type will occur
when an object is clicked, though the object's ‘Start with’ parameter can be
changed to alter when this occurs. Doing this is sensible as you can’t be sure
what the default activation action is defined by the user. More on this later.
We will go through each of these items in turn and explain how to use them. I
encourage you to try them out as you go and experiment with the functionality on
offer. This is the best way to learn.
Different object types will have a range of options. For a layer, you can choose
to make it 'Accept Drag & Drop'.
Layer
The default type of object created is a 'Layer'. A layer
object doesn't interact with the user in any way. There are several reasons why
you may want objects of this type. It may be a text label proving information to
the user, or it may just be a graphic enhancing the visual experience for the
user.
Normally, you can drag files from applications (e.g. Explorer) onto the desktop
to create a DesktopX object which links to that file. If you select this option
for a layer, it means that if you drag a file on top of it, it becomes
‘Contained’ within that object and moves when the ‘Parent’ object moves.
Shortcut
A ‘Shortcut’ allows the object to link to a file or a folder
on your machine. If you choose a file (e.g. Notepad.exe) you can add arguments
to that link. For example, if the file shortcut was Notepad.exe, you could add
the argument ‘c:\mydoc.txt’ which would launch Notepad and then open the file
‘mydoc.txt’. You can also how that application will appear when launched (e.g.
maximized).
In addition to the specific paths that you can enter, DesktopX provides several
variables that can be used to point to specific directories.
%exedir% - returns the executable directory.
%objectdir% - returns the object data directory (where custom files are stored).
%objectsdir% - returns the full \Objects directory.
%themesdir% - returns the full \Themes directory.
So, for example, if you wished to link to one of the default clock objects that
comes with DesktopX, you could link to this “%objectsdir%\Nicer Analog
clock.dxpack”
If you choose a 'Folder shortcut', you can either choose a system folder such as
the Control Panel, or you can choose to browse for any folder on your computer.
In either case, this will cause an Explorer window to open displaying the
contents of that file.
You can however, check the box below the dropdown menu to popup a menu of the
contents of that folder. You can then click an item on that menu to run that
item directly. You can even specify where the menu appears relative to either
the cursor or object itself.
What you should know is that these objects will function like the real target of
the shortcut. For example, if you drag the file c:\mydoc.txt to an object which
is a shortcut to Notepad.exe then that file will open up in Notepad. Dragging a
file to a folder shortcut will move or copy the file to that actual folder.
URL
A 'URL' object type is similar to the shortcut but it is
dedicated to launching web pages in your browser, so all you need to do is enter
the web address (e.g. www.wincustomize.com).
Object Controller
Objects can interact with other objects and this is a way to
carry out some of the most common of these interactions.
An individual object or groups of objects can be defined as 'popups', which
means that they can be shown on screen only when they are required. We will
define how to do this later, but at the moment it is enough to know that you can
select one of the first 2 options here to show or hide the object.
You can also choose to 'Destroy' an object. This might seem somewhat
destructive, but is sometimes useful. For example, when a theme is loaded you
may want to display a welcome message to the user. You don't want this after it
has been read though, so you may set it so it destroys itself when clicked.
Obviously these commands mean nothing without specifying which object is the
target of this action. You do this by selecting the object from the 'Target
object' dropdown list.
Taskbar
The 'Taskbar' object offers some immediate functionality. This
transforms the object into a display of the applications running on your
machine. Obviously there are a few configuration options to adjust how you
want the taskbar to look. You can choose whether the taskbar runs
horizontally or vertically, and at which end of the taskbar new items are added,
and the size of the icons used to represent the items on the taskbar. If
you want, you can add labels which display the name of the application, and
choose the color of the text used dependant of whether the item is selected or
not.
The final 4 items really define the structure of the taskbar. The first item
lets you define how much space the maximum size of each item on the taskbar.
Essentially this defines how wide (in pixels) each item will be where 'Use
labels' is selected. You also need to specify how much space there is
between items. The final option allows you to vertically offset the contents of
the taskbar. This may be important depending on the graphic used in your object.
The graphic is defined like any other except you get a customized 'Advanced'
option which you need to make good use of to customize the object. We will get
onto this in the appropriate section.
Normally, the taskbar just grows and shrinks depending on the number of items in
it, but the final option is a check box that allows you to lock the size of the
taskbar. When this option is set the size is defined by the height or width
option on the Object Properties 'Summary' tab (depending on the taskbar
orientation). This value can be an absolute number of pixels (e.g. 400), or a
percentage relative to the screen width (e.g. 80%).
System Tray
Once you have understood the taskbar type, the 'System Tray'
class is easy, as it uses a subset of these options that creates an object to
display the icons in your system tray.
System
The 'System' class allows you to access some of the other
standard Windows functionality.
Selecting this class provides you with a dropdown list of items from which you
can select. Each of these items has a corresponding Windows dialogue box that
will be displayed when the user interacts with the object.
DesktopX
The 'DesktopX' class provides you will a list of things to do
that relate to DesktopX and it’s user interface. Each of these items is fairly
self explanatory.
Widget
This class is useful if you are planning to export the widget
as a stand alone Executable file (or widget). You can use these to replicate the
commands that are available in Widgets – to close the widget, minimize it, or
display the About box. Widgets are explained in more detail in section 2.5.
Other Object Basics
The object is now created in a rough form, but now is an
opportunity to run through the other basic elements relating to objects before
we move onto more complex things.
Labels
The first thing you can do is to add a text label to your
object. You simply do this by entering the label text into the 'Label' box at
the top of the General tab.
If you want to explicitly set the 'Label color' just hop over to the Relation
tab, and at the bottom of it you will see 2 buttons where you can set the color
of the label depending on whether the object is selected or not. Clicking the
button offers you the choice of using the default color as set in the DesktopX
Settings ... Theme Settings ... Labels area, or defining a different color
specifically for this object.
Summary tab
If you look at the 'Summary' tab of the object, you will see a
range of other parameters that you can change.
Here, you can tweak the objects position and size as well as
assigning a 'Tooltip' message that appears when you hover over the object.
In the 'Description' section you can add some information to the object in order
to identify yourself as it's creator, and also add any comments that you feel
may be useful to new users of the object.
Most of the content of the 'Origin' section we will cover in the Interaction
sections, but for now, the 'Object ID' is important for you to learn about.
This is a unique identifier for the object. It is crucial to assign a unique
name to the object for a range of reasons. Any time you deal with object
interaction, all types of which we will come onto later you need to identify the
object you want to interact with so it must be identified using the 'Object ID'.
Even before you get onto object interaction you will quickly understand the need
for this when you try to use the 'Object Navigator'. This is a tool that allows
you to see all the objects within your theme, along with their properties. To
open the Object Navigator, right-click the DesktopX icon in the Taskbar and then
click “Object Navigator”. The Object Navigator will show you all your
objects, relationships they have with other objects, position and size, z-order
and images used. It is not designed to tell you everything, but rather a summary
reference that you can use to identify and tweak objects.
There are certain elements of an object’s properties that you can edit directly
via the Object Navigator for speed; the object position, width, height and
comments. You can select objects using this interface by clicking on them.
Use the SHIFT and CTRL keys to select multiple objects. You can also right click
an object to access its properties, just as you would by right clicking the
actual object on screen. The row selections on the Object Navigator are
synchronized with the actual object selections on screen. This means that at any
time you an clearly see which object you are working on.
Imagine the chaos if you didn't use the Object ID property and all the objects
were called <unassigned>!
Another useful thing to remember is that when an object is selected you can move
it by using the cursor keys to fine tune its position. In order to do this, hold
down the CTRL key and click the object(s) you wish to move to select. Keep the
CTRL key held down and use the cursor keys to move the object. If you hold down
the SHIFT key at the same time then the object will move by 10 pixels at a time
in the direction specified. You should also be aware that as you move an
object near a screen border, the object will attempt to “stick” to that border.
This is the most commonly required behavior, but if you want to precisely
position the object close to, but no on, the edge the above keyboard shortcuts
will be the best way to do this.
Alignment
In the summary tab, by default you align an object to the left
and top of coordinates specified at the top of the ‘Appearance’ section. You can
however choose to centrally or right/bottom align to these coordinates by
clicking the ‘Align’ buttons and specifying the alignment that you want to use.
This applies to System Tray and Taskbar type objects as well as regular image
and text objects.
Object Appearance & States
OK, well done, you've conquered the basics. Now let’s start
making the objects look cool!
There's no getting away from it - this section is a big one in which you will
learn a lot!
Don't worry though, you can take it bit by bit, and after this section you will
be well armed to create some visually stunning objects.
States
First of all you need to understand what 'states' are.
DesktopX does not restrict you to having one way that an object can appear.
Under different circumstances the object can have a different appearance. Each
different appearance is referred to as a 'state'. The default state is
'Mouse away' which is how the object looks when the cursor is not over the
object. Unless you create any other states, this is how an object will look at
all times. First we will go over the basics of what you can define in a
'state' and then we will return to looking at the creation of additional states.
Image objects
Below the list of states you will notice a series of tabs. The
tab shown by default is 'Appearance' so that is where we will start.
An object can fundamentally have two different types of 'Appearance', either
'Image' or 'Text'. If you want a graphical object, you can choose an image
already in the theme by selecting it from the drop-down list, or you can
‘Browse’ to find a new image on your computer. Images of various types are
supported (BMP, ICO, PNG, TGA and JPG). When you save images they are
saved as rectangular images, but obviously you don't want to be restricted to
having rectangular objects. Both PNG and TGA images allow you to include
transparency information with the file, which means that although the saved
image may be a rectangle, the actual image that you see on your screen can be
any shape you want, because the background is visible when transparent areas of
the object exist.
This image on the right is a
PNG image created in Macromedia
Fireworks with a checkerboard effect showing the transparency.
|

|
When this image is used in
DesktopX all transparency is preserved
and the background shows through as you can see on the right. |

|
| DesktopX even allows
this sort of effect in image formats that don't support transparency
such as BMP. In these image formats, DesktopX will interpret the color
referred to as "magic pink" to be transparent. 'Magic pink' is pure pink
with an RGB value of 255,0,255. |
| Although using this method you
can't have a graduated transparency as you find in the PNG example, you
can make a close approximation. Note, that you need hard crisp edges as
if you 'anti-alias' to soften the object edges, your object will have a
pink glow as these colors are not pure 'magic pink'. |

|
Image sizing and offsets
Once you have selected the image to use you can distort the image by entering a
width and height for the image in the appropriate boxes.
DesktopX is not content with sizing objects in such a brutal fashion, so
provides an advanced tab to allow you to resize the image more intelligently.
Clicking the 'Advanced' button brings up a new dialog. This allows you to
specify different scaling horizontally and vertically. At each edge you can
specify a number of pixels that you do not want to stretch and then you can
choose to either Tile (repeat) or Stretch the area in between.
For example, if you have an image that is 40 pixels by 30 pixels and you want
the outer 5 pixels at each edge to remain un-stretched, then the corresponding
values A-D would be 5, 35, 5, 25. You could then choose to either tile or
stretch the area in the middle.
Also in this dialog, you can offset the image position. This is not useful in a
single state object because you could just position the object where you want,
but in a multi-state object, you can offset the image in different states to
create useful effects. A particular example of this could be offsetting on
“Mouse down” to represent the click like a button being depressed.
Text Objects
If you choose a 'Text' object type then the configuration options change to a
more simple set.
You can enter the text you want in the text area, and set it's alignment in the
dropdown 'Alignment' list. To further customize your text, you can specify the
font (including style and size) and color in which the text will appear.
If you want, you can specify that the text has a border by clicking the box and
selecting a border color. By having a colored border and setting the text color
to 'Magic pink' you can create text which is purely an outline.
You can also make use of offsets here to create effects like you can for images.
Click the “Advanced” button to specify the offsets you want to use.
Object Transparency
We will come onto the ‘Animation’, and ‘Messages’ tabs later, but the remaining
four allow extra tweaking of your image.
The ‘Transparency’ tab allows you to make the whole object partially transparent
(in addition to any transparency specified in the image).
You have a ‘No transparency’ or you can specify a uniform level of opacity of
the image. For example an object with a uniform opacity of 40% will be 40%
visible and 60% transparent.
The final option allows you to vary opacity as the object animates but we will
discuss that in the appropriate section.
Shadows and Glows
The ‘Shadow/Glow’ tab allows you to apply either a drop shadow on the object
giving it the appearance of floating above the desktop, or a glow surrounding
the object.
If you click “Enabled” button you can specify four parameters to customize the
shadow.
Setting the offset defines in which direction the effect goes. Setting the two
offsets to ‘0’ will create a glow, whereas non zero values will create a drop
shadow in a direction dependant on the positive or negative values.
A low 'Sharpness' value gives a crisp edges shadow whereas a high value makes it
softer. The higher the 'Darkness' value the darker the shadow will be.
You can also specify what color you would like the shadow or glow to be by
clicking on the appropriate button.
This feature can be effectively combined with shadows to create great special
effects.
Color
One of the coolest features of DesktopX is the ability to change the color of
things without replacing the image. In the 'Color' tab you can adjust the
objects hue (color) by selecting a value between 1 and 255. Experiment until you
find a shade you like! Setting the value to 0 will set the object color to that
of its original image.
You can further fine tune the color by tweaking its brightness and contrast
across the specified ranges.
We will come onto additional states later but note that there is a button here
to quickly apply the change you have made to all different states of the image.
Sound
The final tab that we will cover in this section is the 'Sound' tab. Here you
can specify that a sound is played when the state occurs simply by browsing to
it on your hard drive. You can Browse for or select an existing WAV or MP3 file.
Although we will discuss animation later, you can see options for looping the
sound when the state is animated. You can choose to repeat the sound once with
every loop of the animation, loop continuously irrespective of where in the
animation you are, or not loop at all.
New States
You now know the basics of configuring a single state object. A multi-state
object is no more complicated.
To add a new state, simply click the 'Add' button. You will then be presented by
a list of the common states not yet used from which you can select:
Mouse over - occurs when the user moves the cursor over the active part of the
object (as defined by the 'Activation' option on the 'Relation' tab.
Mouse down - occurs which the user presses down the left mouse button over the
object
Mouse up - occurs when the left mouse button is released whilst over the object
Show - occurs when the object appears on screen (either when loaded or via
script)
Hide - occurs when the object is removed from the screen (either when unloaded
or via script)
Command executed - occurs when the object is activated as defined by the 'Starts
with' option on the 'Relation' tab.
You can then configure this state just as you did for the first one. One thing
to remember is that all the images used must be exactly the same size.
The other buttons in this are should be fairly clear as to what they do.
Obviously the 'Remove' button removes a created state though you obviously need
to have one state for an object.
Once you have spend time setting up the first state, the likelihood is that
other states will be fine tuned versions of that state, so for speed you can use
the 'Copy From' button to copy the settings from another created state to the
currently selected one.
The 'Reset' button clears all modifications in the currently selected state so
you can start again.
When you create a state the drop-down list shows you the states that exist by
default in DesktopX, but you aren't just limited to these. In the drop-down list
box you can just type any name in and a 'Custom State' of that name will be
created which can be configured just like any other.
Though these states are not triggered by user interaction they can be activated
by Messages and Script which we will come onto later and are very useful for
that purpose.
The one final thing to define in a multiple state object is the 'Default
Appearance'. On the 'General' tab you can specify the image to be used when the
object first loads. This will not change until the object is interacted with in
some way. Note that this image must be the same size as all the other state
images.
Animating Objects
Whilst everything you learnt in the previous section was
great, there's nothing that catches the eye like movement, so DesktopX makes it
easy for you to add animation to your objects. The ‘animation’ tab is where you
can define how your object animates.
The first thing to explain is that there are the two different types of
animation that DesktopX can do. A 'Static animation' is the most simple
animation option. This simply changes the level of transparency rather than the
image itself. Slightly more complex is a standard animation with different
images over time.
Static Animations
We will start with a 'Static animation'. To start with, set a
number of frames. A frame is an individual part of an animation, so the higher
the number of states the more different 'images' an animation has. Once you set
this value higher than '1', the 'Interval' is enabled. This is how long each
part of the animation lasts in milliseconds. The higher the value the longer the
animation takes. For example, a 5 frame image with an interval of 50ms will take
250ms (1/4 of a second). You also need to check the 'Static animation' checkbox
so that DesktopX knows not to expect an animated image, just to vary
transparency.
If you check the 'Loop' box then the animation will be repeated as long as the
object is in that state. Normally if the state changes then the animation will
play through to the end, but if you check the 'Interruptible' box then to state
will change immediately without playing to the end. After that you simply need
to set the direction in which the animation will fun by selecting one of the 4
options available.
If you are looping the animation it will probably make sense to choose one of
the bottom pair as this will lead to a nice smooth pulsing transparency effect.
The final thing that you need to do is specify the change in transparency. This
is where you get to use the third option on the 'Transparency' tab. Here you
specify how the transparency varies in one cycle of the animation. This will
then be impacted by the animation style you chose and whether you chose to
'Loop' the animation. Try experimenting with these options and see how they
change the appearance of the object.
Image animations
We will now look at actually animating the image itself,
rather than just animating the transparency. Though I said that this is more
complicated, it still isn't actually that difficult. The change you need to make
is to combine all the frames of the animation into your source image. What you
need to do is place the frames of the animation side by side from left to right.
The above is the source image for a six frame animation of the DesktopX logo
being worked on in Fireworks. There are six 100x100 images next to each other in
one 600x100 image. If you run this forwards then the image will increase in
size. Once you have done this then just change the other settings as you were
shown for the 'Static animation'. This includes transparency so you can change
both the image and the transparency over the course of an animation.
The Basics of Relationships
You've already learnt about how the objects you create can
interact with the user, and will now learn how they interact with each other.
DesktopX allows you to tweak how they interact with users, but also how they
interact with the desktop and other applications on screen. To access these
settings, open up the Object Properties dialogue and then click the 'Relation'
tab.
Visibility
The first thing you can specify is whether the object is
visible or not. You may wonder why you would want to hide objects. There are two
main reasons. The first is that the object may be doing work in the background
such as loading a webpage which you don’t want visible. Alternatively, you may
only want the object to be visible at certain times which are controlled by
script or popups which we will come onto later.
Z-Order
If you consider a desktop, then all objects on there have an
'x' and 'y' position which defines where they are on the screen. What you might
not consciously have thought about is their 'Z-Order'. This defines which object
or application appears 'on top' of the other when they overlap. Objects with a
higher Z-Order appear on top of those with a lower Z-Order.
You have three Z-Order options for your objects. The first is 'Desktop'. This
means that running applications will always appear above your objects. They will
open on the desktop. Those interacted with most recently (clicked/moved), will
be on top of other objects.
A 'Normal' Z-Order means like the object will behave like a mini-application.
Objects with a 'Normal' Z-Order appear above or below applications and other
'Normal' Z-Order objects depending on which were interacted with most recently.
An 'Always on Top' Z-Order means that this object will always be visible above
all applications and objects. It functions in the same way as the 'Always on
top' setting of the default Windows taskbar.
Movement
'Movement' can be defined as 'Normal' or 'Locked'. If it is
'Normal' then the user can drag the object around the screen. If 'Locked', this
is not possible. The user can still move the object by holding down the CTRL key
and dragging, but accidental movement is not possible. You can also choose the
'Default' mode, which means that its movement is defined by the User's DesktopX
Settings as we discussed in the last section.
Activation
'Activation' defines how the user can interact with the
object. If the setting is 'Default' then it simply follows the user's settings,
but you have three other options. 'Rectangular' activation is based on the size
of the source graphic and ignores any transparency in the object, whereas
'Visible Area' means that only those areas of the object visible on screen can
be interacted with. The final option 'None' means that the user cannot interact
with this object and any attempts to do so are ignored. This is usually most
important for cosmetic objects on the desktop.
Start with
'Start with' defines the way in which a user interacts with an
object. It is not always the case that you want a user to have to click an
object to activate it. In addition to the standard 'Default' option, you have
four more ways in which a user can interact with the object. Sometimes for
example you may simply want the user to move over an object for something to
occur.
Default Cursor
This option allows you to specify which cursor will be
displayed when the mouse moves over the object. This is a very useful way to
indicate to the user the effect of their interaction with the object, for
example if you want a user to drag and move the object rather than clicking it
then it would make sense to use the ‘Move’ cursor.
Popups
OK, now onto 'Popups'. These are a really cool feature in
DesktopX that we briefly mentioned in the Object Types section.
Earlier in this section we discussed visibility. You don't always want objects
to be visible on the screen, and in some cases you may want them to be 'Popups'
whose appearance on screen is controlled by other objects that have the 'Object
Controller' type. If the object is referenced by an object controller then it
will function as a popup depending on the value set here. If the object is not
used as a popup in this way, then this value is simple ignored.
You should note that when an object is called as a popup then all children of
that object or objects in the same group will also inherit the popup
functionality of that object. This is because popups are just really a shortcut
for the visibility setting. By this, I mean that popups are essentially a
dynamic way of setting the visibility of the object. Visibility is a property
the is shared by group members and children inherit it from their parent. Don’t
worry if you don’t understand the parent/children definition. We discuss them in
more detail later.
Here are the popup types:
'Static' popups - Normally, an Object Controller will toggle the appearance of a
popup (open it or close it depending on whether it already is visible). Once
these 'Static' popups are opened they must have a different Object Controller to
the original one to close them. Think of them like a normal program. Clicking a
link to a program will open it, but clicking the link again will not close the
application. A separate 'Object Controller', the close button, is required to do
this.
'Toggle' popups - Are the simplest types. If the popup is hidden when you click
the Object Controller it will be shown. If the popup is visible when you click
the Object Controller it will be hidden.
'Menu' popups - These popups once displayed, will only remain until the user
interacts with the desktop in anyway. They have this name because they function
just like menus; unless you click them immediately to carry out the function
they are there to do they disappear.
'Volatile' popups - Once a 'Volatile' popup is shown, it will remain until
either the controller is toggled or another popup is opened.
'Volatile (No toggle)' popups - This is just like the previous version, except
that toggling the Object Controller is disabled like in a 'Static' popup, so the
only way to make it disappear is to activate another popup.
Position Adjustment
When you are developing for yourself you will design
everything so it fits your screen perfectly. So, what happens if you change your
screen resolution or you give your work to another user who runs at a different
resolution? Well, DesktopX can make a fairly good guess but it is
certainly not perfect, so if you are going to make good objects you should pay
attention to the two options you see above. By specifying values in here,
you can define how the object will reposition itself when the screen resolution
changes. DesktopX logs what resolution the screen was designed on and therefore
detects changes and reacts according.
The 'Dock to Left' and 'Dock to Right' options mean that the object will remain
the same distance from that edge as it was when originally designed. 'Dock to
Nearest xxxx Border' means that the object will align itself to the nearest edge
of the screen (vertical or horizontal depending on option). For example, if you
have an object against the tight edge of the screen then increase the
resolution, you run the risk that it will end up floating away from the new
edge. An object that repositions based on the 'Center' option will be relatively
the same distance from the center of the screen as it was in the resolution for
which it was developed.
The final option 'Rescale' means that the object will be relatively the same
distance across the screen at different resolutions. For example, and object
positioned at 200,200 on an 800x600 screen would be positioned at 320x341 on a
1280x1024 screen (25% across, 33% down).
Object Grouping
Grouping is important if you want your objects to behave as a
single unit. As you’ve no doubt figured out, a given object can really only do
one thing at a given time.
This is best illustrated with an example. Imagine we wanted to create a simple
Drive C bar disk space bar graph.
I would need 3 objects:
Object #1: The background for my meter
Object #2: The text label to say “Drive C:”
Object #3: The actual bar graph
So I would create my 3 objects.
Object #1 – the background. I would change its default appearance to be
something relatively solid.
Object #2 – the text label. I would go to the appearance tab, change it to be a
text object and type “Drive C:”.
Object #3 – the bar graph. I would open the object properties, go to the
additional abilities area on the general tab, choose “add” and pick the
Performance Meter plug-in. Then select it, make sure its width and height fit
within the size of my background. Then I would click on the data source tab and
choose its data source to be the disk space from Drive C.

At this point I would have something like the above. Now, I
would drag and drop the objects together to make it look how I wanted it.
Then I would drag select (or right click on one of the objects and do a
select->all) all the objects. Then I would right click and choose group:

When I pick group I get this dialog:

First I would need to give my group a name, any name will do.
Next I would need to decide which of these options I would want to use.
Realistically, they’re all pretty much the same. The difference in the three
options is pretty technical but here they are explained:
Normal (grouping)
This puts the objects in a basic group. DesktopX doesn’t
modify the parent-child relationship of the objects, instead it manually keeps
track of how the objects are grouped to one another. This option is good if you
have a really complicated object with lots of very specific parent-child
relationships that you don’t want modified.
The down side is that when moving the object around, there is a loss of
performance since there’s a lot more book keeping by DesktopX to preserve all
the existing parent/child relationships.
Optimized (grouping)
In this scenario, DesktopX will generate parent/child
relationships between the various objects based on their relative Z-order to one
another. The objects are still individual entities as far as DesktopX is
concerned but they will now move together very smoothly. This is the most common
option (and the default).
The down side is that it will modify the parent child relationships of objects
which, if the object was counting on a particular object being its parent can be
a problem.
Combine (grouping)
In this option, the objects are effectively combined into a
single mega object. This provides the ultimate in performance when moving the
object around. The down-side is that it creates a single window for the whole
object. That means if you move a child object away from the parent, it’ll
disappear since it’s outside the “object window”.
Object Context Menu

As previously discussed, objects in the DesktopX development
environment (i.e. the builder) have a number of options available to them.
Options include:
-
Clone. Create an identical copy of the selected object.
-
Delete. Remove the selected object from your desktop.
-
Set Parent. Assign a parent to this object. By doing this,
when the parent is moved, the child is moved with it.
-
Z-Order. Change the relative Z axis position of the
objects relative to other objects that are at the same level. For instance,
if you have 5 objects that are “Desktop” z-order this will allow you to
determine which object is on top of which.
-
Select. Allows you to select all or related objects to the
selected object.
-
Export. Brings up the export dialog which will lead to
allowing you to export the object as an “object pack”, a “widget”, or in the
case of DesktopX Pro a “Gadget”.
DesktopX Plugins
DesktopX is a flexible program that opens itself up to
developers who can create plug-ins. These are additional modules providing
packaged functionality that you as a user can access. To create an object based
on a plug-ins simply create an object as normal, then in the 'Additional
Abilities' section of the 'General' tab, click the 'Add' button. This will then
pop up a list of available plug-ins on your system. All you need to do is select
the plug-in you want to use, and then click OK.
Each plug-in needs to be configured differently but we will go through a few
examples of the different types here.
If you need to remove a plug-in, simply select the plug-in in 'Additional
Abilities' and click 'Remove'.
Digital Clock (Text State)
When this is used the immediate
impression may be that nothing has happened.
However, if you go to the 'States' tab and check 'Text' on 'Appearance'
then all
or a sudden you have a digital clock on your desktop. What's cool about
this implementation is that it uses standard DesktopX text so you can
tweak the text any way you like including shadows, and it is exposed to
manipulation via script such as the ability to change its color
dynamically. |

|
Email Notify
| You can configure this plug-in
by entering your mailbox details and how often you want to check. The
way it works it to create two new Custom states (you recall we mentioned
these earlier?) called 'New mail' and 'No new mail'. You can define each
of these states to be representative of whether you have mail of not.
These could be images or simply different text. You may even decide that
it makes sense that rather than this object being a 'Layer' it is a
Shortcut to your email program. |

|
Scriptable Email Notify
| This plug-in offers totally
scriptable email notification functionality. For a complete discussion
refer to the Email notify plug-in section in the scripting guide. |

|
Performance Meters
This delivers dynamic graphics
to your desktop that would be difficult to create otherwise.
You can chart CPU and other performance measures in a range of graphs
and a range of colors, all accessible via the 'Configure' button. Tweak
to your hearts content! Remember that 'Magic pink' provides
transparency. Also remember that 'magic pink' doesn't work in gradients
because most of the pink in the gradient isn't 'pure' and hence 'magic'.
|

|
DX Player
This delivers complete interaction with your media player be
it ObjectMedia, Winamp 2.x or CoolPlayer. You can define what happens when the
user interacts with the object, even to the degree of whether they are holding
down any keys. In some cases images are needed and you can define them here as
well such as gauges for volume etc. I'm not going into the detail of the plug-in
here. Check out the player widget that comes by default with DesktopX to see
what can be achieved with this plug-in.
Custom Files
In the summary tab, there is a button labeled “Custom Files”.
This allows you to attach files to objects just as you would do to email that
you send.
The first reason that you may wish to do this is to attach fonts to a package.
If you have text objects that use a font that you are not sure a user has on
their machine then you can attach them as a Custom File.
DesktopX automatically installs any fonts that included with a pack, so then you
text objects will appear as intended. This introduces an important point. You
must ensure that by attaching Custom Files of any sort that you have the file
author’s permission or that the file is not subject to any copyright or
licensing agreement which does not permit distribution.
There are many other potential uses for Custom Files. When a package containing
Custom files is loaded they are automatically extracted to the theme directory
so they are accessible from there. For example, if you attach your brochure as a
PDF you could create an object that links to it using the shortcut “%objectdir%\Brochure.pdf”
You may want to attach a flash movie which can then be loaded into a web browser
control. Budding musicians may want to attach MP3 files and create a “demo
track” object that they want to send to record companies. The options are
unlimited.
Exporting Widgets, Objects and Themes
OK, you've learnt the basics of creating objects, but now you
need to know how to export Objects and Themes. First thing to note quickly, is
that though it's a great idea to save your work frequently, every time you click
OK or Apply on a dialog, the current work on the desktop will be saved and then
reloaded next time DesktopX is reloaded.
Saving a theme is quick and easy. In the DesktopX Settings dialog on the Theme
tab, all you need to do is click the 'Save As' button. You will then be prompted
to specify and name for your theme and choose where you want to save it. You can
also specify some additional information about your theme.
At various locations, you may see a 'Save' option along side the 'Save as...'
option. This simply saves details of your existing theme to the hard drive so if
anything went wrong with your machine, DesktopX would be able to restore to this
position when reloaded.
Exporting objects and widgets is also really easy. To do this, the first thing
to do is select the object(s) you want to export. You can do this on the screen
by dragging a rectangle with your cursor. A selection area will be highlighted
and those objects selected will take on a 'blue tint'. You can also do this by
selecting the objects in the Object Navigator. Once you've selected the objects
you can right click one of the selected objects and Click 'Export…'.
Following this, you will have a range of options. On the left of the dialog,
there is a choice of exporting specifically the objects that you have selected
or, also exporting and objects related to these (by group or parent/child
relationship). You also have a choice in how you export the file. The first is
the most common option. Use this to create a “.dxpack” file which is a standard
object pack that can be loaded by DesktopX users.
The second export type is as a “Widget”, which I introduced you too in the
User’s Guide. A widget is a standard executable file that you can run on your
computer alongside DesktopX, or even without running DesktopX. You can share
this widget with others, but you should be aware that the widget will only run
on computers which have DesktopX installed. After specifying one of these two
options, all you do is specify a name and location for the exported file and
then it is saved.
Remember that if you create a normal “.dxpack” you can upload your work to the
WinCustomize website. By doing this others can benefit from your creations and
you may get feedback from users that helps you develop in the future. DesktopX
Pro users have a third export option. This is also for the creation of a widget,
but this widget will run as a standard program on any machine without requiring
that DesktopX be installed. Selecting this gives you a range of options to
complete which are related to the object or are displayed in the ‘About’ box:
Application name: Specify the name for your application here.
Company: Place your name here, either yourself as the author or your company.
Version: You can specify the application version here.
URL: You can provide a website address that the user can link to from the
‘About’ box.
Application icon: Optionally you can check the box and specify a “.ICO” file
that will be used for the application. If an icon is not specified then the
default DesktopX icon will be used.
Run Type: You can specify how you want the application to run. Main applications
will probably want to run as “Taskbar items” and utilities run from the “System
Tray”.
Multiple instances: Specify this is you want to allow more than one copy of the
application to run at any time. For example, if creating an international clock
object you may want to allow users to run several instances to allow them to
have clocks for different time zones.
On the next page you have options to export the file in two ways. The first way
is similar to the standard widget, in that a single executable file is created
which can be run. All the files needed by DesktopX are placed in a temporary
directory when this is run, so it is still possible to access these via script.
The second export type separates all the files used so they can be installed
using another method. You will want to use this option if the widget is part of
a bigger deliverable that you want to package using a custom installer.
The final item on this page allows to specify a text file that will be
accessible from the “About” box. This can be used to communicate information
about the application or a licensing agreement for the applications use. Once
you have specified your choices here, the next and final page asks you to
confirm your agreement to the distribution of the executable files, and then you
can specify where you want to store your application/files.
Users can choose to have widgets run on startup from the widget’s right click
menu.
|