Custom Dialer Tutorial
Okay first bare with me here and I will do the best I can to get you from start to finish on doing the custom dialers that I've been producing. I will show you how to do the easy method which I have done most of here, the more advanced method which I started with and Zigg did for our Gears of War/Halo themes I will not be showing due to the complexity of those. Zigg does have a request thread
going for those, if interested you can hit him up. Before I forget the original design goes to ZiggSevo and I took it a step further an came up with this "easy" method to make mass producing these dialers fast and easy.
1. Grab your favorite editor like Paint Shop Pro or Gimp (Free just Google it).
2. Next you need to have a few things...
(pull this from your /system/app/
directory or from the same location in a stock version of deoxdexed Froyo)
- Image you wish to use. Look for images that are 800 x 600 or bigger, these reduce/resize very nice.
- WinRAR or 7zip (for pulling and placing pngs in the DialerTabActivity.apk)
- Optional blank flashable zip
to flash your dialer or you can push it manually using Root Explorer or ES File Explorer, etc..
- Some basic skills in these programs. I will not go into great detail on how to color or add borders to the buttons in these programs because I'm not the best of teachers and there are many different ways you can accomplish this. A little messing around and you should be able to figure it out, its very basic skills needed to do this..
Alright once you have all the above in order you need to pull the following files from the " DialerTabActivity.apk/res/drawable-hdpi/
(This is the stock GREY dialer button background. Controls numbers 0-9 and *, # and backspace key.) call_dial_btn01_normal.png
(This is the stock GREEN dialer button that controls the Phone key) call_dial_btn03_normal.png
(This is the stock ORANGE dialer button that controls the Message key) call_dial_panel_bg_01.png
(This is the background behind the stock dialer keys that gives you the black grid lines on a stock dialer)
Okay now pull all those files using 7zip or WinRAR and place them in a folder so you have them all in one place.
Next find your image on the internet, then open up Paint Shop or Gimp, etc and look under Image or similar for RESIZE or SCALE. Your looking to reduce/resize the image dimensions. They need to be reduce to 480 X 454 pixels and make sure you have the LOCK ASPECT RATIO "unchecked". This will give you the exact dimensions you need for the image on your phone dialer.
Now save that image in the same folder as you put the files you pulled from the DialerTabActivity.apk. Save the resized image as call_dial_panel_bg_01.png
Next onto the buttons.... You can open up any of those buttons you pulled from the DialerTabActivity.apk and look at them so you can see what they look like or whatever. We won't be using them but I had you pull them so you know which images you will be working with and replacing.
Okay so you've looked at the buttons great.. Stock ugly grey buttons haha.. Now to the fun part you want to create a new image. Do this by going to FILE and select NEW image. You want your image to be 148 x 82 pixels and you give it a transparent background. Most programs even offer the option to create a BUTTON or have a button maker, you can use this option to create one using the same 148 x 82 dimensions with a transparent background and give it a border so it outlines the button.
Regardless of what you do you need the button to be TRANSPARENT so your call_dial_panel_bg_01.png shows threw the buttons.
Okay so if you took the route of using the optional button maker then ignore the following.
If you made an image from scratch then you now have a 148 x 82 pixel transparent image. You will need to add a small border to the button if you want your buttons or keys to be defined or you could leave them without edges for a complete transparent look. I will not go into detail how to do this because I'm not a great teacher in this area and there are many different ways you can go about creating a border over a transparent image.
Okay so now you have you button or key how you like it and ready to save it. Save the file as call_dial_btn_normal.png
Now you need to make a few copies of that button you just saved to replace the ones you pulled from the DialerTabActivity.apk. You will need 3 copies total
Name them the following. call_dial_btn_normal.png call_dial_btn01_normal.png call_dial_btn03_normal.png
Now its time to put everything together and place it all in your DialerTabActivity.apk.
Take the 3 button images you just made and named as I stated above, and also the call_dial_panel_bg_01.png
(your resized image) and place them all back in " DialerTabActivity.apk/res/drawable-hdpi/
" and close it up.
Push it directly to your device or use the included flashable, and put them in the " system/app/
" directory of the flash zip I provided.
That's it your done and if all was done correctly you should have your very own custom dialer pad.
If anyone has any questions I will do the best I can to answer them. I can't promise that I can aid you in working with the transparent image and borders because there is different ways to do it and each graphics application is a bit different in tools/locations/names.
I hope I was able to get you through the hoops of performing this and enjoying doing a bit of customizing on your own. I will still be here to take requests and answer questions and please feel free to hit the Thanks button or leave a comment or whatever if this worked out for you.