Icon Focus in different size?

[ruebyi]

Hi guys!

I try to make a new theme where the icon I focus is bigger than the others.
Just to make clear what I mean: I want some effect like on the Mac in the bottom bar!

I tried this code, but the Icon doesn't scale... it just stayes the same size!

<g id="Theme_Button_1"
transform="translate(-224 100)">
<!-- pz:tag type="button" -->
<useApplicationIcons app-id="slot0"
normal-group="normalImage"
focus-group="focusImage"/>
<g id="Theme_Button_1-Contents">
<!-- pz:tag type="layer" -->
<g id="normalImage">
<image id="img_1_5_72"
x="0" y="0" width="80" height="80"
xlink:href="Images/normalImage_img_1_5.png"/>
<image id="img_11_5_73"
x="0" y="0" width="80" height="80"
xlink:href="Images/normalImage_img_1_5.png" visibility="hidden"/>
<image id="img_21_5_74"
x="0" y="0" width="80" height="80"
xlink:href="Images/normalImage_img_1_5.png" visibility="hidden"/>
<image id="img_31_5_75"
x="0" y="0" width="80" height="80"
xlink:href="Images/normalImage_img_1_5.png" visibility="hidden"/>
</g>
<g id="focusImage">
<image id="img_1_5_76"
x="0" y="0" width="80" height="80"
xlink:href="Images/focusImage_img_1_5.png" visibility="hidden"
transform="scale(1.25 1.25)"/>
<image id="img_11_5_77"
x="0" y="0" width="80" height="80"
xlink:href="Images/focusImage_img_1_5.png" visibility="hidden"
transform="scale(1.25 1.25)"/>
<image id="img_21_5_78"
x="0" y="0" width="80" height="80"
xlink:href="Images/focusImage_img_1_5.png" visibility="hidden"
transform="scale(1.25 1.25)"/>
<image id="img_31_5_79"
x="0" y="0" width="80" height="80"
xlink:href="Images/focusImage_img_1_5.png" visibility="hidden"
transform="scale(1.25 1.25)"/>
</g>
</g>
</g>

Please help me!

Of course the Icons should be customizable, with fixed Icons it wouldn't be a problem.

Hope you can help!

ruebyi

[dimm0k]

I'm interested in this as well.

[ruebyi]

is really nobody here, who has an answer? or is it just impossible?

ruebyi

[Foppa_21]

Try this.

Find the location where your core icons are stored. For instance,

C: > programs files > research in motion > BB Theme Studio 5.0 > Samples > Themes > Images > Precision 480x360 > Icons

Copy all of those icons into a new folder at a place of your choosing.

Now using an imaging editor to resize the default_application_focus icon to the size you want. I"m assuming you want the normal icon to remain the same, otherwise you can resize default_application icon as well.

Now open composer and go to edit > preferences. On the miscellaneous tab, look for Theme Builder Icons. In the pulldown select "browse." Now navigate to the folder you just created, with the resized default app icons and select it. OK, OK and you're back in composer.

Now when you create a new button, and change it to "use device applicaiton order" in the inspector, the focus icon will automatically be resized. Should not need to edit the SVG file.

This will only work for "use device app order" icons, but I think that's what you wanted to do. It works for me making them smaller, so it should work going bigger.

[ruebyi]

This will only work for "use device app order" icons, but I think that's what you wanted to do. It works for me making them smaller, so it should work going bigger.

Sorry no, thats exactly what I know how to do!

I want to use any Applilcation Icon and want to be able to use "application order"

[Foppa_21]

Originally Posted by ruebyi

Sorry no, thats exactly what I know how to do!

I want to use any Applilcation Icon and want to be able to use "application order"

By changing the default_application_focus to a larger pixel size, and selecting "use application order" when adding a button, it will resize any app icon that the user puts in that app slot. This isn't working?

[ruebyi]

sorry! Now I understood!

I'll report what happen!

[ruebyi]

THANKS! this worked!

You're great! Now I have only to experiment with the aligment of the smaller/bigger Icon

[rlmesq]

What image editor are you using?

In Paint.net, you can change the image size, which grows or shrinks the entire image.

You can also change canvas size, which changes the dimensions of the image but keeps the picture at the same size. This can result cropping the image if you shrink it, or increasing the blank space if you grow it.

Here's a suggestion to keep the image alignment intact (assuming you're using 73x73 icons for a Storm; adjust accordingly):

Open your original icon in Paint.net, use Image-->Resize to take it down to 60x60. Save as icon_focus.png or whatever.

Now use Image --->Canvas Size and go back to 72x72. At the bottom of the canvas size window, you can set your anchor point; keep it centered so the canvas will grow equally in all directions.

The additional border space around your original image will be white, so you'll have to erase it if you have a transparent background.

[ruebyi]

sorry, but this Way didn't work for me! It only recognizes 2 files with the same pixel size not the drawn Item size! I edited the svg istead, works brilliant!

[kirksucks]

this is an old thread but I'm having trouble getting this to work.

i pointed composer to my folder with all 80x80 icons, non-focus icons have been shrunk in photoshop, the preview in composer looks right but when i import to theme builder and export its all one size. how is this happening?

[bbthemelab]

Do you want to resize the icons on the home screen while using app order?

Blackberry Tutorial: Resize buttons on home screen (video)