• Import and export images
• Change, add or remove properties
• Import and export STREAM images
• Compile into a totally new MsStyles-file

In this post I will highlight some details of Vista Style Builder (VSB) which show how much easier this application makes it to edit MsStyles.

The Main Window

Most of the time when creating Visual Styles, you will be looking at the main window of VSB. This main window exists basically of four parts:

• The command bar in the top of the window to do things
• The UI parts browser on the left which displays every UI part in a MsStyle neatly grouped into categories
• The Preview pane, which will show the images used in a UI part
• The property view in the bottomright, showing an editable list of all properties for a UI part

As you might notice, there is no menu bar anymore. In line with most Vista applications, VSB uses a commandbar for all possible actions that can be done.

Importing Images

VSB allows a user to export the images used in a Visual Style in order to edited the images in an external application, such as Adobe Photoshop. It is possible to export a strip of images (e.g. all different button states in one image), but it is also possible to just export one state of an image (e.g. the button-pressed image).

Importing is done in a similar fashion: you can import an image with all states or just one state directly. VSB always provides a default name for importing and exporting, so if you follow that naming schemes, you can quickly import and export images.

VSB will notice it if you try to import an image of different dimensions than the original; it will actually ask you what you want to do:

Alpha Channel Importing

One of the problems people are currently facing with Vista Styles is that photoshop and Vista uses a slightly – or so it seems – different format: the alpha channel comes out wrong in MsStyles for files imported manually.
Vista Style Builder fixes this incompatibility when importing images.

Adding Properties

Another feature in VSB is the possibility to add new properties to UI parts. This makes it possible, for example, to give the taskbar fonts a glow or even make the breadcrumb bar glow.

Properties are added through a easy to use dialog which allows you to select the type of property (e.g. enum or color), the name (e.g. iconeffect or textcolor) and the value. For enumeration-types, such as Iconeffect, a listbox will automatically show all possible values.

StyleHacks

People often want to change the same things in their Visual Styles. Some good examples are a thinner taskbar and a small startmenu. Most of the time, these things involve editing a number of properties in some unexpected way.

To make it easier for everyone to use often done things in their styles we invented StyleHacks in VSB. A StyleHack is an easy way to apply an often done thing (a`hack`) to your Visual Style. For example, there is a StyleHack to change the height of the taskbar to 18px.

Visual Style Builder provides an in-application menu to browse the available StyleHacks with a preview image and apply them with a click of the mouse:

Import XP Styles

A featue of Visual Style Builder that has been secret until now is the ability to Import XP MsStyles.
That’s right, VSB makes it possible to use your favorite XP Styles on Vista! Most XP Styles only need some small modifications after importing to work correctly on Vista .

Here’s an example of XP Luna after having it converted to a Vista Style after importing:

As you can see, the dialog uses the Luna window borders as well as Luna buttons. As a bonus, the Luna theme got dropshadows and is rendered by the DWM. For this theme, I opted to keep the Aero buttons because I personally think they look great on the Luna theme.

Of course, not all themes can be imported 100% correctly: Vista has some more restrictions on the window frames than XP had. However, it will make porting much easier and it works for a lot of themes without modifications.

Availability and price

The big question is now when will VSB be available? Unfortunately, I can’t really give a date yet. The technical side of the application is completely done; the business side, however, is not.

I know a lot of people expect this application to be free, but I can tell you that it will not be free. There went a lot of work in VSB and, at the very least, I need to earn the invested time back.

Editor’s Note: A distribution policy for Vista Style Builder and AeroXperience members is currently being researched

Yes that’s right, Builders! This week, AeroXperience was the first to get exclusive previews from Andreas Verhoeven’s Vista Style Builder.

I happen to be one of the fortunate people testing this application and giving feedback to Andreas mostly from an End-users Perspective. This Application does everything we could do before plus loads more. Whereas before we could only see numbers for images, now we will be looking at descriptions or, at the very least, class names. Instead of Hex-editing, we can insert/edit class properties using a language we can one day understand. At the moment, most of us will not understand what each Visual Style class does as they have not been publicly documented, so this is where I hope to step in and help.

I don’t want to Speak for Andreas as I am sure you will be hearing from him soon, but from what I gather, his plan is to make an application that the end-user can understand and use easily. Due to the large content of .msstyles, that will not be an easy thing to do. At the moment Avestyle is a Work in progress, but Andreas worked hard to make the application as usable and functional as possible. The actual core of the application works beautifully, but the UI is still in the process of being built. In the early builds, the Vista classes will be displayed in the application with the class name and a description.I am currently researching these classes to organize the Treeview in the application in a way where the user can find what he/she is looking for.

So Instead of researching image numbers and variant hex-edits, I will be focusing my attention on researching Vista class names and property names. This will most likely be more useful to us all as I am really confident that AveStyle is the way forward. Look out for more blog’s right here at AeroXperience about the new Customizing possibilities avestyle has to offer.

www.vistastylebuilder.com | Aves Pages | AeroXperience Forum Discussion

If anybody else would like to start getting familiar with class and property names, you will find the following links useful.

• Vista Visual Style Class names
• Property Identifiers

After I created a few Visual styles and struggled with the graphic design side of things, I turned my efforts to researching and documenting my methods for Resource Hacking and Hex-Editing. Resource Hacking is where it all starts. The first time I opened the .msstyle with Restorator, I did not know where to begin. All those image numbers meant nothing to me, but 12 months of research for much of what we need has already been documented.

In October 2007 Stardock released their solution to Customizing Vista; WindowsBlinds 6.0 adds full support for skinning Windows Vista as well as applying a host of new special effects to skins (blurred glass, advanced animations, etc.) Users also can create their very own WindowBlinds skins using SkinStudio 6 Pro.

However Stardocks solution does not suit everyone and In the last 12 months, skinners using the hacking methods have been documenting what they find; the vista customization community has really pulled together to share expertise.

UxTheme Patches: (To Date)

• Raphael’s uxTheme Patches
• Vista Glazz
• PsycoB’s Style Selector

Tools:

• ResHacker (Resource Hacker)
• Restorator 2007 (Resource Hacker)
• Mirkes Tiny Hexer (Hex-Editor)
• XVI32 Hex Editor (Hex-Editor)
• Alpha Image Converter
• Png Alpha Fixer

Documentation: (Threads and Tutorials)

• How to make Aero.msstyles compatible pngs
• How to make a Visual Style for Windows Vista
• The Resource Research Thread
• Aero Resource ID’s (Wiki)
• Decimal to Hex (Calc.exe)
• Hex-Editng (general)
• Hex-Editng (Margins)