Deviation Actions

UkIntel's avatar

Vista Image + Content Margins

By
Published:
16.9K Views

Description

[HEX EDITING] IMAGE and CONTENTS MARGINS
Modify Vista Image properties in the .msstyle

Download the PDF Tutorial for easier reading.

INTRODUCTION

This Tutorial is not Text book information, and anything I write in my tutorials is to be used with caution and at your own risk.
All my Finds are thanks to 50% Guess work and 50% Luck.

I have only tested this technique on a few images, you can try it for any image,
This tutorial is based on searching for image properties, if you cant find it then its probably not there.
Pscyob has shown how to insert some image properties for the start menu images.

The following information is aimed towards those of you who have already had experience with Hex-editing. Confidence is a Plus!
IF YOU DONT KNOW HOW TO EXTRACT THE VARIANT OR NORMAL.RES FILE - THEN THIS TUTORIAL IS NOT A GOOD PLACE TO START

you will need the following:
Restorator 2007 or ResHacker
Mirkes Tiny Hexer
Windows Calculator (calc.exe)

Nothing is ever simple when working with the .msstyle and it is even more difficult to explain to others.
In the attempt to make reading easier I have divided this tutorial into sections...


INTRODUCING IMAGE MARGINS
INTRODUCING CONTENTS MARGINS
DECIMAL TO HEX (using Calculator)
FINDING IMAGES IN THE VARIANT
HOW TO CHANGE THE MARGINS




INTRODUCING IMAGE MARGINS

Image margins DO NOT enlarge an image, but they determine usage of areas within the image.

For Example I will be using Image 913.png (System Tray & Clock area)

Image 913 lays on top of the Taskbar and will stretch Horizontally across to suit
your screen resolution and contain the system tray Icons you have within it.

Most Images will have 4 image margins. Left, Right, Top, Bottom.
In this example we will only need to change the left image margin.

Microsoft has chosen to leave this png blank and the image margins
are too small to create a shape like in the image shown below...

(My 913.png Image is 100x30px)

Original Left Margin is set to 1 pixel.
This will mean that the 1st left hand line of pixels will maintain its true colour and shape when the image is stretched
but anything in between the left and right image margin will be used for stretching.
Therefore my Curved png would look a mess if my system tray area gets bigger,
so to maintain my curve on the left side I would need to set my Left Image margin to 17px.



INTRODUCING CONTENTS MARGINS

Contents margins DO NOT enlarge an image, but they determine usage of areas within the image.

again I will be using Image 913.png (System Tray & Clock area)

The Contents of image 913.png is the Icons and Clock

for example you can move the entire contents to the Left by Increasing the Right hand Content margin.

(because the system tray area is designed to stretch towards the left when more contents is added,
there is no real need to make any adjustment to the left hand contents margin,
but in other areas of vista the images are not designed to stretch,
so adjustments may be needed, if u increase the right, you may need to decrease the left)



DECIMAL TO HEX (using Calculator)

In order to edit the Variant you will need to know how to convert Decimals into Hex codes.

This will be useful for finding Image numbers and inserting your margins

Calculator will give you a conversion result,


Start/Run/Calc.exe
Click View, and tick "Scientific"
Type in the decimal number then tick the Hex Button.



You will get a Result However the code will still need Manual Conversion depending on how many digits it gives you.

Use the chart Below as a guide

Number of digits : 1
Calc Result Example: A
Method: add 0 to the front
Final Hex Code: 0A

Number of Digits: 2
Calc Result Example: F1
Method: N/a
Final Hex Code: F1

Number of Digits: 3
Calc Result Example: 263
Method: add 0 to the front, move front two digits to the back
Final Hex Code: 6302



FINDING IMAGES IN THE VARIANT

You can find any image in the .msstyle recorded in the variant.

Simply coverts the image number to Hex using Calculator.

for example image 743 becomes E702
or 913 becomes 9103


Open the Variant or normal.res with Mirkes Tiny Hexer
Click Edit
Click Find/Replace (ctrl+F)
Type 9103 click find

(some Image numbers appear twice in the variant because the image is used in more than one area of Vista)



HOW TO CHANGE THE MARGINS

Make sure you are NOT using "Insert Mode" (View/insert mode) as we only want to overwrite the hex code

Take a look at the image above, you will start to see a hex pattern after the image number.

i always use the 10(s) as a marker. (after the second 10 is image margins) (after the third 10 is contents margins)

the order is as follows.

Image margins : Left Right Top Bottom
Contents margins: Left Right Top Bottom
© 2008 - 2024 UkIntel
Comments9
Join the community to add your comment. Already a deviant? Log In
s4r1n994n's avatar
Thanks u very must dude. :+devwatch: + :+fav: