10-15-09 01:05 AM
26 12
tools
  1. jbrill1012's Avatar
    I'll go ahead and throw up a crazy solution to this I found on accident. I'm sure some of the below steps aren't necessary. I needed some of these for the theme I was making anyways, and since this feels like a (beneficial) glitch, some of the seemingly random steps might be needed. My example is changing an 80x80 icon to a 40x40.

    1) Open up your favorite image editing app (e.g. Photoshop) and create a PNG of your desired app icon size. What the PNG actually contains makes NO difference. I fill mine with red with the bucket tool so if I make a mistake somewhere down the line and the PNG shows up on my BB I'll know right away.

    2) Open Composer and start a new project.

    3) Place your buttons in the locations you'll want them to end up on your phone using the "Theme Button" tool in the toolbox. The third tab in Composer allows you to set the exact location. For example if you have a 60 pixel banner and want your first icon to start 10 pixels below the banner, enter 70 as the y value.

    4) On the first tab of the inspector choose "Third Party Application" and in the text bow below type the name of an app. It doesn't matter what name, call it "foobar" for all it matters. You just need some arbitrary text in that box.

    5) Under the "Images" heading, click EACH icon and replace it with the PNG you made in step 1. You can assign the exact same icon to both Normal and Focus.

    6) Double click the button in the "Objects" window and give it an easily recognized (and easily searchable) name. "Button1" is fine.

    7) Repeat the process for each button you'd like to resize. If you're not resizing a button you can just use "Use Device Application Order" like usual or add it later in Theme Builder.

    ** Hard Part! **

    8) Once you're finished your button layout and whatever else you need to do in Composer export your project as an SVG.

    9) Open the SVG file in the text editor of your choice and look for the following bit of code near the top:
    Code:
    <g  id="Button1"
    	transform="translate(-240 80)">
    	<!-- pz:tag type="button" -->
    <g  id="Button1-Contents">
    	<!-- pz:tag type="layer" -->
    10) Add in the following bit of code on the line before <g id="YOURBUTTONNAME-Content">:
    Code:
    <useApplicationIcons app-id="slot0"
          normal-group="normalImage"
          focus-group="focusImage"/>
    11) Your code section should now look like this, only with the name you assigned your button in place of "Button1":

    Code:
    <g  id="Button1"
    	transform="translate(-240 80)">
    	<!-- pz:tag type="button" -->
    <useApplicationIcons app-id="slot0"
          normal-group="normalImage"
          focus-group="focusImage"/>	
    <g  id="Button1-Contents">
    	<!-- pz:tag type="layer" -->
    12) Change "slot0" to the Application Screen icon number you'd like to use for that button. It's 0 based so "slot0" refers to the first app on the app screen, "slot3" would be the fourth button, etc.

    13) Repeat steps 10-12 for each button you need resized. You may or may not need to do this to the buttons you're not resizing depending on how you've setup your theme. Most likely you wont.

    14) Open up Theme Builder and start a new project. Go to "Theme the Home Screen" in the inspector and import your modified SVG File in the "SVG File" box.

    15) Scroll down to Navigation and setup the navigation order. Even though you won't see your SVG's buttons in the "Applications" box you'll be able to select them in the Navigation area.

    16) Check your work in an emulator or just export the ALX and drop it on your BB through Application Loader.

    17) Profit! Actually, don't profit, charging for themes has always seemed ******** to me. Get a real job hippie.


    This is a correct walkthrough up to the point of getting the application to launch.

    There is something you needed to add to this for the application order to be able to launch from the homescreen.

    Once you get that changed you need to change the following:

    Locate
    Code:
    <!-- pz:tag output="anim" -->
    
    <loadScene xlink:href="x-exec://"  begin="Button1.activate"/>

    After the x-exec:// enter in slot0 so that it would look like the following:
    Code:
    <loadScene xlink:href="x-exec://slot0"  begin="Button1.activate"/>
    This lets the BlackBerry know to launch the application that's in slot0 if you don't change this part of the code you will just have the icon from slot0 on the homescreen and it will not launch any application at all when selected. You must do this for each button you use. Changing it to the correct slot# you want it to launch.

    Example:

    Button1=slot0
    Code:
    <loadScene xlink:href="x-exec://slot0"  begin="Button1.activate"/>
    Button2=slot1
    Code:
    <loadScene xlink:href="x-exec://slot1"  begin="Button2.activate"/>
    Button3=slot2
    Code:
    <loadScene xlink:href="x-exec://slot2"  begin="Button3.activate"/>



    Ok, I love to overcomplicate things massively apparently. Let me try again:

    1) Just create an icon bound to "Use Device Application Order", export to SVG, open up the SVG and find the button entry. Change all the image widths/heights to the new res. Example: width="80" height="80" becomes width="40" height="40". The end.
    Much easier way !! Sorry for digging up the old thread but I thought I had done the resize and it didn't work apparently I did something wrong somewhere when using notepad++ and replaced something I shouldn't have when I hit replace all. I tried it a second time with just 1 icon in composer and it worked just fine.
    10-15-09 01:05 AM
26 12
LINK TO POST COPIED TO CLIPBOARD