Related
Hi Guys
How do you make buttons have a transparent look? I have seen both some mods and roms that have made the sense launcher/navbar buttons transparent and or translucent. I have contacted the creators of the mods and roms and asked how they accomplished their effects but my requests for help have gone unanswered.
I imagine that the effects are made possible by an entery in one of the xml files I just don't know which files I should be looking at and what to be looking for inside those files.
Help would be greatly appreciated.
You need to find the PNG files that you want to change and create them so that they are transparent.
As an example, /system/framework/com.htc.resources.apk has a file called "lockscreen_arc.png. *see attached* It is semi-transparent (when viewed in photoshop).
What little I know how to do I learned from THIS, a few questions answered by JsChiSurf and some fearlessness to dig in and hope my nandroid saved me.
kelmar13 said:
You need to find the PNG files that you want to change and create them so that they are transparent.
As an example, /system/framework/com.htc.resources.apk has a file called "lockscreen_arc.png. *see attached* It is semi-transparent (when viewed in photoshop).
What little I know how to do I learned from THIS, a few questions answered by JsChiSurf and some fearlessness to dig in and hope my nandroid saved me.
Click to expand...
Click to collapse
So you are saying that it is the image itself that is transparent or translucent and not an attribute somewhere in one of the xml files?
What I am trying to do is actually undo the transparency/translucency of a an image. I figured it might be the result of an xml attribute since upon replacing the image with one of my own nothing changed (now I may not have replaced the correct image, this is always a possibility)
dsMA said:
So you are saying that it is the image itself that is transparent or translucent and not an attribute somewhere in one of the xml files?
What I am trying to do is actually undo the transparency/translucency of a an image. I figured it might be the result of an xml attribute since upon replacing the image with one of my own nothing changed (now I may not have replaced the correct image, this is always a possibility)
Click to expand...
Click to collapse
Well it can actually be done both ways some are controled by the image itself adn some are controlled my xml.
nfinitefx45 said:
Well it can actually be done both ways some are controled by the image itself adn some are controlled my xml.
Click to expand...
Click to collapse
If it is controlled by xml do you know what files I should be looking at and what inside the files I should be looking for?
Note this is for the laucher/navbar buttons in particular the ones found in konirosie (but I imagine any help could be applied generally)
I am just learning the editing of xml's myself, so I can really help much, this is a question that should be directed to JsChiSurf. That man is the expert on editing the xml's and could probably guide you to what you are looking for.
Ive been searching and searching but just cant find the background for the music bar on the notifications pulldown so I can change it, see screenshots
Anyone know where it is??
EDIT: I have noticed that the same background is used when in a call behind the call in the notifications pull down so that means that it cant be music specific so it must be in framework-res or com.htc.resources but I have searched and just cant find it :-(
What a coincidence... just sent you pm with this...
Did you checked if this is the topround_v1.9.png in HtcMusic\res\drawable-hdpi ?
Edit: Or check the topround_v3.9.png in the com.htc.resources\res\drawable-hdpi
kalagas said:
What a coincidence... just sent you pm with this...
Did you checked if this is the topround_v1.9.png in HtcMusic\res\drawable-hdpi ?
Edit: Or check the topround_v3.9.png in the com.htc.resources\res\drawable-hdpi
Click to expand...
Click to collapse
Nope its not them......
common_transport_play_rest.9.png in com.htc.resources\res\drawable-hdpi???
edit: or common_slide_bar.9.png in com.htc.resources\res\drawable-hdpi???
kalagas said:
common_transport_play_rest.9.png in com.htc.resources\res\drawable-hdpi???
edit: or common_slide_bar.9.png in com.htc.resources\res\drawable-hdpi???
Click to expand...
Click to collapse
it cant be that one, if you look at my image in first post its purple.....
EDIT: actually its doesnt look purple at all, maybe i was tired earlier lol, its a weird grey color and also it is 1 solid color
It's not purple for sure...
Have you tried to change any icons i have told you???
I believe it's on of them...
kalagas said:
It's not purple for sure...
Have you tried to change any icons i have told you???
I believe it's on of them...
Click to expand...
Click to collapse
I have tried them all and its none of them :-(
I think i found it
status.png in HtcStreamPlayer\res\drawable-hdpi
kalagas said:
I think i found it
status.png in HtcStreamPlayer\res\drawable-hdpi
Click to expand...
Click to collapse
It looked promising but its still not it :-(
Please someone must of found this?
It is very easy to find in other roms just a simple png in tw-framework :-(
I have noticed that the same background is used when in a call behind the call in the notifications pull down so that means that it cant be music specific so it must be in framework-res or com.htc.resources but I have searched and just cant find it :-(
bumping for possible solution???
I never took care for that one so far, since it looks fine to me, but you can try the following procedure, since it seems an RGB value, not a png.
1. Make a screenshot
2. Sample the RGB color code in Photoshop
3. go to first xml folder like layout in com.htc.resources and mark all xml and open all of these at the same time in Notepad++
4. Search all files for the sampled RGB value
5. Repeat this folder by folder until you find an entry, that makes sense
he_stheone64 said:
I never took care for that one so far, since it looks fine to me, but you can try the following procedure, since it seems an RGB value, not a png.
1. Make a screenshot
2. Sample the RGB color code in Photoshop
3. go to first xml folder like layout in com.htc.resources and mark all xml and open all of these at the same time in Notepad++
4. Search all files for the sampled RGB value
5. Repeat this folder by folder until you find an entry, that makes sense
Click to expand...
Click to collapse
Notepad++ has a nice feature that allows you to search through all files in a folder. (Search menu -> "Find in Files" or something like that) With this it should be quite easy to find.
I tried that method and came up with 292c31
I decompiled com.htc.resources, framework and system ui and I found some instances in colors xml and one in drawables but changing all of them didnt work so it must be somewhere else or maybe ive missed something........
Hi all!
I would change colour of bar of music time or the bar of volume
which png I have to change?
thanks!
If it's a progress bar then it is most likely going to be an .xml file somewhere within the .apk of the app. But to help further we would need to know what Music app you are using, on what ROM etc...
progress_horizontal.xml
Sent from your nearest toilet
kevin2516 said:
progress_horizontal.xml
Click to expand...
Click to collapse
Yup, that's the one. It's located in /system/framework/framework-res.apk/res/drawable/progress_horizontal.xml.
L0cke said:
If it's a progress bar then it is most likely going to be an .xml file somewhere within the .apk of the app. But to help further we would need to know what Music app you are using, on what ROM etc...
Click to expand...
Click to collapse
It's default Music.apk on Tattoo's ROM
I change most of .png (like album, artist, playlist or play/pause prev and next icon)
now i would change colour of background and of the time bar
dangerous93 said:
It's default Music.apk on Tattoo's ROM
I change most of .png (like album, artist, playlist or play/pause prev and next icon)
now i would change colour of background and of the time bar
Click to expand...
Click to collapse
Time bar is going to be the same file as the volume, the progress_horizontal.xml mentioned above.
Background color most likely is from colors.xml, which should be located in Music.apk/res/values/colors.xml. To access the values folder, you will have to decompile the .apk, if you just unzip it won't show up.
Dont Panic said:
Time bar is going to be the same file as the volume, the progress_horizontal.xml mentioned above.
Background color most likely is from colors.xml, which should be located in Music.apk/res/values/colors.xml. To access the values folder, you will have to decompile the .apk, if you just unzip it won't show up.
Click to expand...
Click to collapse
Some advice to open the xml file?
Here is the guide I used when learning to theme progress_horizontal.xml: http://droidpirate.com/2010/08/21/development-theming-guide-for-progress-bar/
If you click the link in my sig, all my basic and standard morphs have a themed version of it in them, feel free to use one of those if I have the color you are looking for.
Hey guys, what edit to SystemUI.apk or twframework-res.apk would be necessary to get rid of the text below the status bar toggles? I assume removing the entry in strings.xml would leave a gap, so how was it done on i9000 ROMs? Thanks!
Yeah, removing the strings left empty space. Any help?
Haloruler64 said:
Yeah, removing the strings left empty space. Any help?
Click to expand...
Click to collapse
There is a how to posted somewhere in the i9000 threads. Can't find link as I am mobile. It requires editing the lines in the expanded status bar xml
It was actually quick panel xml, but thanks for telling me it was in the i9000 section, for a thread on it.
8/14/2011 Update: See this post for details. Now you can make circular progress bars, dotted progress bars, the text is anti-aliased and smoothed, and more!
Attached is a very simple, small Windows .NET application that will generate a 101 Battery Icon images (for percentages 0-100) with a growing battery indicator bar and also the battery percentage text using the font, style, format and position that you desire.
Using an XML configuration file and some image templates, you can quickly generate a wide range of icons for your battery icon theme.
To start, just unzip the files into a folder and open up the "Config.XML" file in a text editor. Here's the one I've included to use as a guide/template/example:
Code:
<?xml version="1.0" encoding="utf-8" ?>
<batteryIcon>
<output folder="output" filename="stat_sys_battery_{0:0}.png" />
<batteryLevels>
<level max="24">
<background filename="Files\template.png"/>
<bar startX="6" startY="21" endX="31" endY="21" filename="Files\bar-red.png"/>
<pctStyle colorRGB="FFFFFF" fontFamily="Arial" fontSize="11" italic="false" bold="true" formatString="{0:0}%"/>
<pctPosition centerX="true" centerY="false" offsetX="1" offsetY="3"/>
</level>
<level max="49">
<bar filename="Files\bar-orange.png"/>
</level>
<level max="74">
<bar filename="Files\bar-green.png"/>
</level>
<level max="100">
<bar filename="Files\bar-blue.png"/>
</level>
</batteryLevels>
</batteryIcon>
In addition, in the "Files" folder, I have an example image called template.png, which is the example icon's background image, and some bar-xxx.png images, which are different colored 1-pixel-wide images that are used in the example to draw the horizontal battery meter over the background. Attached to this post is a picture of the output from this configuration and image files so you can get a basic idea of what it can do.
Using this application is (hopefully) quite simple: Create your template images, edit the config file to specify your parameters, then run the executable. 101 images, for battery levels 0-100 percent, will be created as specified. Tweak and run again as needed until you get it right. The "level" elements allow you to change any of the icon's characteristics (text color, size, position; background image; progress bar image) for different battery level intervals. Anything not changed from the previous level is carried over, so you only need to specify changes.
For most of you, editing the config.xml file is probably obvious from the example; you can probably just tweak it file and get what you want, but below are more details.
Documentation
The output element just indicates where the final images will be stored and how they will be named. The {0:0} part is a standard .NET format string and indicates where and how to put the battery percentage in the file name. (You probably won't need to change this; {0:0} will format numbers from 1-100, no leading zeroes, and we don't need to worry about commas or decimal places or anything).
After that, under the batteryLevels element, there are a series of level elements that define the icon options at each battery percentage interval. The end of the interval is defined using the "max" attribute, which is a number from 0-100 for the battery percentage.
The first level should include all layout and image and formatting options, but then after that, you just need to specify things that change from the previous interval. The level elements should go in order from lowest battery level to highest.
At each level, we can specify:
The background element which sets the base background image for the icon, on which the progress bar and pct text will be overlayed.
The bar element which determines how the progress bar is drawn over the background. startX/startY and endX/endY are the range of positions for which the progress bar image will be drawn. The image should be 1 pixel tall or wide, depending on if the bar is progressing vertically or horizontally. Omit this element completely if you do not wish to draw a progress bar -- i.e., for just the battery percentage text on top of one or more background images.
pctStyle lets you theme the battery percentage text a bit. formatString is a .NET format string, and is probably fine as is, except notice that it ends with a % symbol. Remove this if you don't want a % after the number. (i.e., it would be just "{0:0}")
pctPosition is used to indicate where on the background image the text is drawn. centerX/centerY are true/false if you want the text to be centered in that dimension, otherwise it is drawn at the top and/or left of the background. offsetX/offsetY let you move the text up/down or left/right pixels as needed from either the center or top/left position.
That's really it. Anything that doesn't change from the previous battery level will be carried over, so you just need to specify what has changed.
Tweak the XML file and re-run until you get the battery icons you are looking for! You can also create and drop different configuration XML files on the executable (or specify the file via the command line as the first argument) and it will run using that file as opposed to the default "config.xml" file in the application directory.
Additional Notes:
Specify an empty string ("") for the filename attribute of the bar element if you do not want a progress bar drawn.
Specify an empty string ("") for the fontFamily attribute of the pctStyle element if you do not want the percentage text drawn.
Remember that the background image can change at any interval as well, if you'd like to use a series of different backgrounds with percentage text overlayed and no progress bar, for example.
the start/end positions of the progress bar should be specified once and cover the entire range of the progress bar, from 0-100 %, and not change at different intervals (unless that is an effect that you want for some reason).
You can specify the filename for any valid configuration file as the single parameter for the executable to use that file instead of the default config.xml file if you like.
WOW! Are you kidding me. You mean I don't have to make 100+ Battery icons. THANKS. I'll definately be donating next time I get paid. DO YOU REALIZE how much time you just saved me? Thanks. DL'ing now.
EDIT: DUDE! Where's your donation link? I just tested this and IT'S INSANE! IT WORKS PERFECT! Seriously, post a donation link. You deserve a lot for making this. I'll also post a link to your thread at "themikmik.com". They'll love this program.
EDIT: Could you please give me an idea of what pctposition I would need to accomplish this type of battery? Thanks. I tried a pct of 1:1 but had an FC. Or Offest. I'm still trying to figure it out.
EDIT: I almost have it down. offsetX="3" offsetY="10"/> gives me:
Will the Font be transparent? Answer: YES
I finally got it looking the way I wanted. I used:
<bar startX="10" startY="15" endX="31" endY="15" filename="Files\bar-red.png"/>
It looks like I just have to modify the PNG bar's to make it the size I want so it fills up the battery.
To think, it took me 20 minutes to do TWO battery PNG's in Adobe photoshop! LOL.
How can I change which way the bar is going? It currently goes from Left to right. I'd like it to go from Left to Right.
Answer: I feel like an air-head. I figured it out. You just have to reverse the Start X. For example:
<bar startX="33" startY="9" endX="7" endY="9" filename="Files\bar-red.png"/>
Great!!!!
THX for this tool
Made my life much easier
raider3bravo said:
It looks like I just have to modify the PNG bar's to make it the size I want so it fills up the battery.
Click to expand...
Click to collapse
Yeah, those images are just examples, modify as needed. Glad it is working for you!
jsmith8858 said:
Yeah, those images are just examples, modify as needed. Glad it is working for you!
Click to expand...
Click to collapse
Can you give me an idea of some fonts we can use? I was thinking if I used a certain font that wasn't on the phone then it might not show.
EDIT:
On another note, I'd like to share with everyone the coding I used to achieve a perfect battery using a 38x38 icon and 1x21 bar colors.
Never before have I been able to custom make batteries this fast. Thanks!
Code:
<?xml version="1.0" encoding="utf-8" ?>
<batteryIcon>
<output folder="output" filename="stat_sys_battery_{0:0}.png" />
<batteryLevels>
<level max="24">
<background filename="Files\template.png"/>
<bar startX="34" startY="8" endX="6" endY="8" filename="Files\bar-red.png"/>
<pctStyle colorRGB="A7CEA7" fontFamily="Arial" fontSize="11" italic="false" bold="true" formatString="{0:0}"/>
<pctPosition centerX="true" centerY="false" offsetX="2" offsetY="9"/>
</level>
<level max="49">
<bar filename="Files\bar-orange.png"/>
</level>
<level max="74">
<bar filename="Files\bar-green.png"/>
</level>
<level max="100">
<bar filename="Files\bar-blue.png"/>
</level>
</batteryLevels>
</batteryIcon>
raider3bravo said:
Can you give me an idea of some fonts we can use? I was thinking if I used a certain font that wasn't on the phone then it might not show.
Click to expand...
Click to collapse
Use any font you have available on your pc that looks good. On your phone it's just a PNG image, it doesn't matter .
HTC style battery meter
I modified HTC battery png files to include the battery percentages.
Attached is the preview and output folder. Use as you please.
It would be awesome if we could get the charging icon pngs. Anyone care to post?
Sent from my ADR6400L using XDA Premium App
raider3bravo said:
It would be awesome if we could get the charging icon pngs. Anyone care to post?
Sent from my ADR6400L using XDA Premium App
Click to expand...
Click to collapse
Attached are all HTC battery pngs including the charging ones.
I just made another battery icon. This program is a huge time-saver.
When I asked about the power widgets. I was wanting to know if it's possible to include those images in the battery icon similar to the numbers being populated in the icon. The battery power widgets are easy to get but populating them inside a battery icon can be tricky and again time consuming. Just putting the thought out there. I'm happy the way it is, but maybe consider it for a future update?
raider3bravo said:
I just made another battery icon. This program is a huge time-saver.
When I asked about the power widgets. I was wanting to know if it's possible to include those images in the battery icon similar to the numbers being populated in the icon. The battery power widgets are easy to get but populating them inside a battery icon can be tricky and again time consuming. Just putting the thought out there. I'm happy the way it is, but maybe consider it for a future update?
Click to expand...
Click to collapse
I'm afraid that I don't really understand what you are requesting, can you be a little more specific or explain a bit more what you are trying to do?
jsmith8858 said:
I'm afraid that I don't really understand what you are requesting, can you be a little more specific or explain a bit more what you are trying to do?
Click to expand...
Click to collapse
Sure thing. Right now, the script populates 100 icons. However, there are 110 "battery icons." The other 10 are for charging. What I'm requesting is if the script could somehow, populate those charging icons along with the modified battery png's. I can easily add the charging icons but theming them will be a huge hassle. If it's possible, great. No big deal if it can't be done right now. I'm just thankful we have this script to make all 100 Png's.
How do I compress series png files as 1png file?
I'm running MIUI galnet 6.0 and need to add 1 png file that has all the percentage inside (0-100)
Do you guys know how I need to do this?
Thanks
This is amazing! Why doesen't everyone use it! Please create charging and different types of batteries like circular ones!
Circle battery indicators
see next post!
Version .2
Here's version .2. The OP will be updated at some point when I have time to rewrite it.
Changes:
1) The % text is now smoothed and anti-aliased.
2) You can draw a circular progress bar by specifying rotateStart and rotateEnd attributes for the bar element. These are in degrees (0-360). The "bar" image will be drawn at the startX, startY point (usually 0,0; omit if you like as this is the default) and then repeatedly rotated and drawn up to the currently drawn battery level. endX and endY are ignored if you use rotation. (The included config.xml file has an example of using this feature.)
3) You can now specify a "step" attribute in the batteryLevels element. This allows you to draw icons for only every nth battery level, say, 0,5,10,15...90,95,100. (the default config.xml file includes this attribute so you can see where it is; it is set to 1, which is the default.)
4) in the bar element, you can specify drawCount and skipCount attributes to toggle drawing the progress bar on and off to make a "dotted progress bar" effect. This is often done for circular battery icons. Basically, specify how many % to draw and then how many % to skip using these attributes. (The included config.xml file has an example of using this feature.)
5) An image called "preview.png" will be created in the output folder with a simple compilation of all of your icons in one image. This is useful for posting for others to see or for you to quickly review all in 1 place.
The standard horizontal bar example included with the app has been renamed to "config-bar.xml", while the default "config.xml" included creates a dotted circular progress bar and includes most of the features described above.
Have fun! See some attached examples. (PLEASE NOTE: I literally threw the examples together in 10 minutes, they are a little sloppy since I didn't take the time to line things up perfectly, you can do better!)
this tool is premium quality!
Since no one really knows about this tool, I have two requests:
1) If you use this for a theme you make available to others here on XDA, if you could include a link to this thread and (very) briefly mention that you used this to generate your icons that would be much appreciated.
2) Maybe a few clicks to "Submit to Portal" (on the top-right) can get this thread on the XDA home page! (I apologize if soliciting this is against forum rules)
3) Share your work here! Use the cool "preview.png" feature to post some examples of what you've created.
Enjoy!
R3D X said:
this tool is premium quality!
Click to expand...
Click to collapse
Thanks, glad it works for you!
jsmith8858 said:
Since no one really knows about this tool, I have two requests:
1) If you use this for a theme you make available to others here on XDA, if you could include a link to this thread and (very) briefly mention that you used this to generate your icons that would be much appreciated.
2) Maybe a few clicks to "Submit to Portal" (on the top-right) can get this thread on the XDA home page! (I apologize if soliciting this is against forum rules)
3) Share your work here! Use the cool "preview.png" feature to post some examples of what you've created.
Enjoy!
Click to expand...
Click to collapse
Ya, this should have been on the homepage of XDA months ago. lol. Thanks for the update. I know I included a link on my first theme to this thread, but forgot about the others. I'll mention you now in every OP. Thanks a million. My themes wouldn't be possible without this. Submitting to portal now!