DroidForums.net is the original Verizon Android Forum! Registered Users do not see these ads. Please Register - It's Free!
Page 1 of 8 123 ... LastLast
Results 1 to 10 of 74

Thread: Theming Guide for Progress Bar

  1. Beta Team
    thebowers's Avatar
    Member #
    8519
    Join Date
    Nov 2009
    Location
    Iowa
    Posts
    2,548
    Twitter
    dabowerman
    Phone
    Rooted Droid, OC @ 1.1 Ghz
    DroidForums.net Theme Developer
    Premium Member
    #1

    Lightbulb Theming Guide for Progress Bar

    Making this thread for people having issues figuring this out. Hope this helps you all.

    Apps and resources needed
    HxD hex editor can be found here Downloads | mh-nexus .
    Color guides to go off of. I use this site for color gradients. #9d9e9d Gradient Color Chart
    7-zip for opening .apk files with out changing .zip to extract. 7-Zip
    framework-res.apk (after all this file is located in here).

    Starting the process
    1. Take 7-zip and extract framework-res.apk somewhere on your computer.
    2. Navigate with in the new folder called framework-res to /res/drawable.
    3. In here you will find the file progress_horizontal.xml
    4. Open this file with HxD.

    Understanding Hex values
    The hex color values are backwards of what they would be in normal xml. The first default value in this xml is 9D 9E 9D FF. People get confused here so we are going to break it down.

    The first 9D is for blue (B)
    The 9E is for green (G)
    The second 9D is for red (R)
    Last is FF for alpha (A) - I always leave this value alone.

    In normal hex it would be this way FF 9D 9E 9D.

    First is FF for alpha (A)
    The first 9D is for red (R)
    The 9E is for green (G)
    Last is the 9D for blue (B)

    Do you see the difference? Lets do another example with different hex value. 9D128D is a purple color (just using it as different values).

    9D = R
    12 = G
    8D = B

    So in binary, here in Hxd it would be this way 8D 12 9D FF

    8D = B
    12 = G
    9D = R

    Now to edit the file
    1. Now the file is open in HxD. Hit Ctrl+F to bring up the find box.
    2. In this box put 08 00 00 1c in the Search for box. For data-type switch to Hex-values. Search direction should be for forward. Go ahead and click ok.
    3. Now 08 00 00 1C will be highlighted. The eight numbers next to it are the color value in hex format. There will be nine of these values in this xml.

    Default values in the xml > normal hex format
    1. 9D 9E 9D FF --- FF 9D 9E 9D
    2. 74 76 74 FF --- FF 74 76 74
    3. 5A 5D 5A FF --- FF 5A 5D 5A
    4. 00 D3 FF 80 --- 80 FF D3 00
    5. 00 CB FF A0 --- A0 FF CB 00
    6. 00 B6 FF 80 --- 80 FF B6 00
    7. 00 D3 FF FF --- FF FF D3 00
    8. 00 CB FF FF --- FF FF CB 00
    9. 00 B6 FF FF --- FF FF B6 00
    The first three are for the background and the last six are for the foreground (fill progress).

    4. Click next to the highlight hex string of 08 00 00 1C. You can edit the 9D 9E 9D FF or leave it alone. I skip the first three since they are the background. These values represent the start, end and middle of the gradient

    value 1 = start
    value 2 = end
    value 3 = middle

    Middle is going to be the darkest one.

    5. To get from one value to the next hit Ctrl+F again and hit ok. Make sure that you don't have 08 00 00 1C highlighted or it won't go to the next one.
    6. Go to value 4 (00 D3 FF 80). In this example I am going to change it to FF00DC (pink). I put that hex color in the website from above. Get color info. Then click the link for color gradient colors. We will look at that in a bit. Back to HxD. I would put it in as DC 00 FF 80. Then hit Ctrl+F and hit ok.
    7. We should be on value 5 (00 CB FF A0). When doing this color I go to the gradient chart for the start color to black. I go down 12 colors from FF00DC to CC00B0. That is what I am going to put in for value 5. So in HxD I put in B0 00 CC A0. Then hit Ctrl+F and hit ok.
    8. Value 6 (00 B6 FF 80). Back to the chart. I go down 8 colors from CC00B0 to AA0092. This is going to be value 6. In HxD put in 92 00 AA 80. Hit Ctrl+f to go to value 7.
    9. Value 7 is going to be the same as 4 but with alpha of FF. (DC 00 FF FF). Ctrl+F to go to value 8.
    10. Value 8 is going to be the same as 5 but with alpha of FF. (B0 00 CC FF). Ctrl+F to go to value 9.
    11. Value 9 is going to be the same as 6 but with alpha of FF. (92 00 AA FF). This is the last value. Go to file and save. Now you will have a progress_horizontal.xml and a progress_horizontal.bak (the .bak file is the orginal.

    Pushing the new file to the system
    1. Open the framework-res.apk as an archive with 7-zip. Go to /res/drawable. Take the progress_horizontal.xml we just did and put it in here. Hit the folder up until all the way out of framework-res.apk.
    2. Either take the framework-res.apk and put in the tools folder of ADB and push to phone or use Root explorer to do this. I would stay away from doing this with terminal as it usually causes problems. Also with using ADB, you may want to do this while in recovery.
    3. Reboot you phone for the changes to take affect. All progress bars should now be the gradient color you just made, enjoy.


    I will add pics later of what the above example of pink will look like when done. Feel free to post your new bars here as well.
    Last edited by thebowers; 07-17-2010 at 06:16 AM. Reason: proof reading
    If you like what I do, thanks



    Your can follow me as follows

    @dabowerman - Twitter
    Derek Bower - G+ - this is where I will be @ the most and where stuff gets released first.

    Theming Guides that might come in handy
    Theming Guide for Progress Bar
    Notification Text Color Change (How to)
    Theming Guide for System Text
  2.  
     
     
     
  3. Developer Relations
    tp7six's Avatar
    Member #
    61666
    Join Date
    Apr 2010
    Posts
    11,512
    Liked
    361 times
    Twitter
    DroidForums
    Phone
    [MDK] S4
    Premium Member
    #2
    Bowers you always have good information. This one is pretty detailed, I have had success in changing my own progress bar but it looks like I could learn more here, thanks for posting this

  4. Master Droid
    skurtz1313's Avatar
    Member #
    56546
    Join Date
    Apr 2010
    Posts
    358
    Phone
    Enter Current Phone Model Here
    DroidForums.net Theme Developer
    #3
    Great guide thank you for putting this together!
  5. Theme Developer
    kook's Avatar
    Member #
    20945
    Join Date
    Dec 2009
    Posts
    2,041
    Liked
    13 times
    Twitter
    KookDoes
    Phone
    Droid Bionic
    DroidForums.net Theme Developer
    Premium Member
    #4
    Are 4,5,6 the top part of the progress bar and 7,8,9 the bottom? If not, how would you go about doing a fade?

    Sent from my Droid using Tapatalk
    Search "kookahdoo" on the market for my themed apps.
  6. Droid Ninja
    microsnook's Avatar
    Member #
    35836
    Join Date
    Feb 2010
    Posts
    1,292
    Phone
    Enter Current Phone Model Here
    #5
    That will come in handy, thank you
  7. Master Droid
    HermitObserver's Avatar
    Member #
    35229
    Join Date
    Feb 2010
    Posts
    310
    Phone
    DROID
    #6
    Thank ya' very much It's the small things like that that complete a theme
    Theming Guide for Progress Bar-cap201007170002.jpg
    ^-^-^-^-^-^-^-^-^-^-^-^-^-^-^-^-^-^-^-^-^-^-^-^-^-^
    There are 3 kinds of people: those who can count, and those who can't.

    I wasted 30% of my life in school. The other 60% was fun, though.
  8. Beta Team
    thebowers's Avatar
    Member #
    8519
    Join Date
    Nov 2009
    Location
    Iowa
    Posts
    2,548
    Twitter
    dabowerman
    Phone
    Rooted Droid, OC @ 1.1 Ghz
    DroidForums.net Theme Developer
    Premium Member
    #7
    Quote Originally Posted by kookahdoo View Post
    Are 4,5,6 the top part of the progress bar and 7,8,9 the bottom? If not, how would you go about doing a fade?

    Sent from my Droid using Tapatalk
    4 = top or start of gradient
    5 = bottom or end of gradient
    6 = middle or darkest part of gradient

    7,8,9 are the same colors in the same order. Only thing different is the alpha or transparency to the colors. This is just by going from the orginal values.

    Experiment and see what happens. I am just giving info on what the defaults are and a quick way to change colors that are not a flat color.
    If you like what I do, thanks



    Your can follow me as follows

    @dabowerman - Twitter
    Derek Bower - G+ - this is where I will be @ the most and where stuff gets released first.

    Theming Guides that might come in handy
    Theming Guide for Progress Bar
    Notification Text Color Change (How to)
    Theming Guide for System Text
  9. Master Droid
    erikfig's Avatar
    Member #
    67791
    Join Date
    May 2010
    Posts
    545
    Phone
    Galaxy S 3
    #8
    This looks kind of crazy but I will give it a try!
  10. Beta Team
    thebowers's Avatar
    Member #
    8519
    Join Date
    Nov 2009
    Location
    Iowa
    Posts
    2,548
    Twitter
    dabowerman
    Phone
    Rooted Droid, OC @ 1.1 Ghz
    DroidForums.net Theme Developer
    Premium Member
    #9
    Quote Originally Posted by HermitObserver View Post
    Thank ya' very much It's the small things like that that complete a theme
    Click image for larger version. 

Name:	CAP201007170002.jpg 
Views:	457 
Size:	268.7 KB 
ID:	11912
    What color codes did you use for your fill? I like it and might make it my background for the progress bar.
    If you like what I do, thanks



    Your can follow me as follows

    @dabowerman - Twitter
    Derek Bower - G+ - this is where I will be @ the most and where stuff gets released first.

    Theming Guides that might come in handy
    Theming Guide for Progress Bar
    Notification Text Color Change (How to)
    Theming Guide for System Text
  11. Theme Developer
    kook's Avatar
    Member #
    20945
    Join Date
    Dec 2009
    Posts
    2,041
    Liked
    13 times
    Twitter
    KookDoes
    Phone
    Droid Bionic
    DroidForums.net Theme Developer
    Premium Member
    #10
    Thanks....that's exactly what I wanted to know....

    Quote Originally Posted by thebowers View Post
    Quote Originally Posted by kookahdoo View Post
    Are 4,5,6 the top part of the progress bar and 7,8,9 the bottom? If not, how would you go about doing a fade?

    Sent from my Droid using Tapatalk
    4 = top or start of gradient
    5 = bottom or end of gradient
    6 = middle or darkest part of gradient

    7,8,9 are the same colors in the same order. Only thing different is the alpha or transparency to the colors. This is just by going from the orginal values.

    Experiment and see what happens. I am just giving info on what the defaults are and a quick way to change colors that are not a flat color.


    Sent from my Droid using Tapatalk
    Search "kookahdoo" on the market for my themed apps.
Page 1 of 8 123 ... LastLast

Links

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  

Similar Threads

  1. Replies: 68
    Last Post: 06-26-2010, 11:33 AM
  2. Daily Progress
    By woodyman in forum Droid Concepts
    Replies: 15
    Last Post: 04-25-2010, 02:26 PM
  3. Progress bar colors?
    By roberj13 in forum Android Themes
    Replies: 1
    Last Post: 03-03-2010, 05:56 PM
  4. Eris ROM 1.17.605.1 OTA update in progress
    By Jolest in forum HTC Droid Eris
    Replies: 13
    Last Post: 01-19-2010, 09:40 AM

Search tags for this page

android progress bar color

,

android progress bar theme

,

android progressbar color

,

android progressbar theme

,
android skin progress bar
,

android theme progress bar

,

android theme progressbar

,
panel background.9
,

panel background.9.png

,

toast frame.9.png

Click on a term to search our site for related topics.
Find us on Google+