O.k guys this thread will based on video tutorials,so you ask how to make something and ill make a video on showing how to make it.
This is going to be fun and very useful for those trying to learn and even for those who know and have got stuck on some parts. =) O.k guys I do know a lot of other things besides just graphics like editing the .xml and stuff but this is mainly graphic photo shop work.
Subscribe To My Channel----> www.youtube.com/MrManup456
Watch Videos On Site----> http://www.nexus-nation.com/root-your-nexus-one/theme-guide
Thank you, bro....subscribed already. Great first tutorial. Thanks again!
How do you make a rom lol
Well these are going to be all graphic based,but once I am done getting my ubuntu setup I was thinking of making a few of those as well.
!!
Wow cool manup - I have always been impressed on your work, can you show us how to do icons, I have learned by my self, but your an expert
creating icons from scratch is harder work,now you can edit icons or take two and make it your own. ill do a video on this in a sec.
!!
manup456 said:
creating icons from scratch is harder work,now you can edit icons or take two and make it your own. ill do a video on this in a sec.
Click to expand...
Click to collapse
By the way, it loos like your using photoshop right?
make a tutorial about oc and uv ing (the steps involved) can't seem to figure it out
@frankzua77
Done check it the tutorial is up on my channel,I hope this is what you wanted.
Could you please make following tutorials: "how to edit notification text color" and "how to edit luncher2 appdraw selection"
Well the selection is more java code not really graphics at all and there is a colorchanger app that does that. And the white notification text is a statusbar.xml edit now the time on the bar Is in service.jar. I really dont mess with java at all,but the statusbar.xml I can prob do a guide but the program works better than spending time to hex edit. The progress bars as well is a .xml.
I think my next guide will be on adding guides and signing .9.png unless I get a request.
Bro and if you want a guide on editing that .xml ill do,but I wanted to stay more into the making themes and graphic part.
!!
Thanks BRO! you rock homie!
np bro! ill try to keep them coming.
Hi manup456,
I want to request a tutorial on how to optimize graphics (icons, wallpaper..etc) for devices like the nexus one.
For example, if you use PS and save an image the normal way (jpeg, png,...) it comes out quite large compared to the original. Then there are options for coloring, transparency... all that's stuff.
Anyway, If you could show me how to save icons so that they are displayed well and still have small size, that would be awesome.
thanks
If you can do a vid on editing the progress horizontal xml will be cool
How did you get the dots on the bottom of the launcher (that represent the different screens) to be as clean as they are in NexDeep? I am trying to port it over to the newer 7 screen Launcher found here, but having some issues getting them to look as nice.
Thanks.
@daveid
Well the dots on the modded launcher I made from scratch thats why there so clean.
@icegad
I can do this will be the first video I do tomorrow.
@duylong186
Well to optimize a icon in cs4 you would save for web and devices and use png-28 that will optimize the icon,but threre are also programs that can optimize a icon even more.
Oh and checkout my new video I posted tomorrow ill have a few more.
manup456 said:
I think my next guide will be on adding guides and signing .9.png unless I get a request.
Bro and if you want a guide on editing that .xml ill do,but I wanted to stay more into the making themes and graphic part.
Click to expand...
Click to collapse
You know this is one I need to learn, would greatly appreciate a video for editing .9.png images!
Related
^_^ well, im in the process of learning about making themes... and I wanted to share what i have so far.
these all support landscape. They are QVGA.
(I did not draw these... I only made the themes.)
im still struggling with getting the Start menu text from white to black upon changing a theme... Is there a way for this to be done automaticly instead of with a reg tweek on the end user's side? ...
hmm...
*******edit update: whoa! the setting to change start menu colors was right in my face. wow... so im fixing all the ones that need fixed. *done*
Download my all tasks made before 12-21-2006...
(including, christmas and recently fixed versions)
all the others will be posted throughout this thread.
***yet another edit...
I set up a page with my themes located:
http://ookami.n2-network.com/pda/index.html
Feel free to download from there ^
any christmas themed-anime-theme? something in red-white-green would be fine
ah sure ^_^ I didnt make any because Its so close to being over with the season. But yeah, not a problem. As soon as i get home today. Looking forward to it.
These themes are really good, 0okami. I'm using the nekomimi theme now. But you are right that it'd be nice to see the text in black in some of the others.
Must a say nice work !!! Keep it up !
I've got this image.. but lazy to do a tsk. See if you can use it. (PNG in ZIP attcahed)
UPDATE: TSK uploaded. Frosty effect on the start menu. Made the tsk a bit way too big though.
Guys, I'm sure it doesn't need to be said, but try not to go too explicit/hardcore. Ie nothing with four legs or feathers... otherwise, please use your own judgement.
V
here's another...
vijay555 said:
Guys, I'm sure it doesn't need to be said, but try not to go too explicit/hardcore. Ie nothing with four legs or feathers... otherwise, please use your own judgement.
V
Click to expand...
Click to collapse
Eh? nothing with 4 legs? or feathers? ... *confused*
hardcore? no problem I know my limits in public ^_^ no hentai.
Hahaha! random imaginative thought: "vijay555: echhi na no wa ikenai to omoimasu"
(refference from an anime called "mahoromatic" for those who dont know it... its phrase from a maid who dislikes ero ero) I Will comply. (^_^)/
hanmin said:
I've got this image.. but lazy to do a tsk. See if you can use it. (PNG in ZIP attcahed)
Click to expand...
Click to collapse
kawaiii !!! dejiko-chan of digi-charat! I Will definetly do some of digi-charat! but that image is a little small to play with.
All things said, here are some more themes for you:
the first one suffers from the same as the other light color ones... the start menu's white text...
Which software package do you use to make these themes, 0okami?
Quite cute!
ennui: isn't it themegence?
V
This program is pretty cool.
0okami, to change the start menu text color, see below:
vijay555 said:
... but try not to go too explicit/hardcore. Ie nothing with four legs or feathers...
Click to expand...
Click to collapse
four legs or feathers ... Ooops
lol - hanmin, you've met my wife?! Where'd you get that photo? She's nekkid!
V
ennui said:
This program is pretty cool.
0okami, to change the start menu text color, see below:
Click to expand...
Click to collapse
OMFG! it was right in front of my FACE all the time! i cant believe that! awesome! Thanks.
*fixing* I'll re upload a full zip of all the ones i've made so far. You will; find that in the second post on this thread. ^_^
for quicker access follow this link:
http://forum.xda-developers.com/showpost.php?p=1081624&postcount=2
I gota admit, I love some of these themes. Keep up the great work! Looking forward to seeing more!
These are really nice Ookami! Keep up the wonderful work ^_^
I understand which one vijay555 decided to give his warning about. Dp_moe_2 I have that image as one of the 2000 or so images that are randomly selected for my computer's wallpaper ^_^ I also like the xmas ones. It's too bad that the memory in the 8125 is so small since I can't store themes on the storage card >_<
Souseiseki from rozen maiden.
^_^
*taken down for a moment. * issue with bg and messages. looks terrible.
*updated... fixed as of 7:27pm.
Guys, just to re-iterate, I love this work. Try not to go too explicit or you'll get Flar on your tail, but otherwise, great work.
V
Does anyone have a list of all the locations of image files for editing your own theme? I want to jump into the theming world.
Something just to get started.
riggsandroid said:
Does anyone have a list of all the locations of image files for editing your own theme? I want to jump into the theming world.
Something just to get started.
Click to expand...
Click to collapse
not that i know of. Your gonna have to go through all the files and figure out what files go where. Sorry I know it sucks but at the same time its part of the learning process.
ya. download a theme and start seeing what icons and stuff they changed. That's the best way to get acquainted. Good luck! It's fun and addicting. Feel free to hit up cbarlan or myself if you have questions. We'd be more than happy to help! God bless!
Thanks guys. I'll download some themes and see what I find.
What software do you guys use? Gimp, paint.net? Photoshop?
Thanks again. Also will try to compile a basic list as I go to help others.
-------------------------------------
Sent via the XDA Tapatalk App
One piece of advice as you get into this...
Take note of the approximate filesize of whatever you are changing and try to save it in png-8 or png-24 with as few colors as possible.
I have made some taskbar icons and after the first couple sets it was weeks later that I realized the originals were less than 400bytes and the ones I made were like 1.5 to 2.5 KB!!! May not sound like much but it adds up.
PhotoShop's color replacement tool will save you hours!
Most of the stuff u r going to change will be in com.HTC.resources.all and also framework:-res .apk. not all of them but a lot. They will be in the "drawable" folders that are in the res folder. Hope that helps u start.
ok im sorry if this is posted i have been looking all day on XDA and other forums nothing so far. im trying to learn how to make my own mods im not looking for a step by step guide but more a point in the right direction to some of the programs that are used maybe the file names and types (i have my own image editing program) just looking for a little help i guess. i am trying to make my own slider right now if you have any useful tips or anything please help me out thanks in advance
So you are looking to modify the images? If so this is not so much a mod but a theme. Changing the graphics is one thing but to make an actual mod like Cookies HomeTab or MaxSense, takes modding the actual file structure and the writing of code.
So if you are looking to just modify the graphics and theme of the phone look into modifying manila graphics. You want a program like CFC_GUI. This will allow you to download the manila image files and see there size and upload your own. You will still need something like GIMP or Photoshop to make your own image into a png of the proper size. You can also use a program called Mode9 to resize the size of the image allowed in a certain spot or even it's location all together. There are other things you can do and this would be getting more into modifying manila.
thank you! yeah im more thinking about themes i will let the pros handle the heavy stuff i have photoshop and Jasc PSP so thanks this was a lot of help i will look for that program.
Here is a post that gives a pretty good description on how to edit the graphics.
Post of other thread
First of all, major thanks to JsChiSurf for his amazing work on this port!
http://forum.xda-developers.com/showthread.php?t=877003
This is a separate thread for themes of this mod.
I've always wanted a clean, slick looking shade on the notifications pull down and thanks to JsChiSurf, it's pretty easy to theme it.
Here are two that I made today. I haven't gotten around to skinning the buttons yet though.
Try these, static images don't do them justice, it's neat seeing the way they move. For more details on flashing these, please refer for JsChiSurf's thread above. These already contain the updated 2.1.1 services jar.
After zipping, you can use this:
http://circle.glx.nl/
to restore your battery %. Thanks chogardjr!
PCS_v2.1.1 Brushed_Metal_Grate_Small_Circular_Light
PCS_v2.1.1 Brushed_Metal_Grate_Small_Circular_Dark
PCS_v2.1.1 Brushed Metal Grate Small Circular Dark Industrialized
PCS_v2.1.1 Brushed_Metal_Grate_Small_Dark_Industrialized_Android
PCS_v2.1.1 Brushed_Metal_Grate_Small_Dark_Industrialized_Android_v2
PCS_v2.1.1 Brushed_Metal_Grate_Small_Light_Industrialized_Android_v2
Neo3D said:
First of all, major thanks to JsChiSurf for his amazing work on this port!
http://forum.xda-developers.com/showthread.php?t=877003
This is a separate thread for themes of this mod.
I've always wanted a clean, slick looking shade on the notifications pull down and thanks to JsChiSurf, it's pretty easy to theme it.
Here are two that I made today. I haven't gotten around to skinning the buttons yet though.
Try these, static images don't do them justice, it's neat seeing the way they move. For more details on flashing these, please refer for JsChiSurf's thread above. These contain the 2.1.1 services jar.
Click to expand...
Click to collapse
Wrong section to post this in, however, nice MOD.
Hi. How do i go about installing this mod please?
Jason Black said:
Hi. How do i go about installing this mod please?
Click to expand...
Click to collapse
jschisurf has intructions in his thread:
http://forum.xda-developers.com/showthread.php?t=877003
since he originally ported this, it's best to refer back to his thread.
oh, i already included his latest 2.1.1 services jar, so there's no need to flash twice.
SteelH said:
Wrong section to post this in, however, nice MOD.
Click to expand...
Click to collapse
Sorry Thanks for moving it to the correct section!
Using with Myn rom
I think the brushed metal version looks great and want to install, but would that change myn's black notification menu power control back to white or just add the metal screen drop down. I like the black notification menu power control over the white version.
Thanks
terence74 said:
I think the brushed metal version looks great and want to install, but would that change myn's black notification menu power control back to white or just add the metal screen drop down. I like the black notification menu power control over the white version.
Thanks
Click to expand...
Click to collapse
Hmm, honestly, I'm still new at this, so I don't know. Can you make a Nandroid image, then flash it and let everyone know?
terence74 said:
I think the brushed metal version looks great and want to install, but would that change myn's black notification menu power control back to white or just add the metal screen drop down. I like the black notification menu power control over the white version.
Thanks
Click to expand...
Click to collapse
yes, it will.
This is all very easy. If you have done this much then you can do it all. I have faith in you.
chogardjr said:
This is all very easy. If you have done this much then you can do it all. I have faith in you.
Click to expand...
Click to collapse
Is it just a matter of replacing the PNG's?
What PNG optimization do you recommend?
Also, how do you change the color of the fonts? I tried to look at the xml files but they open up as strange characters in any text editor I use (Notepad++, notepad, etc)
I also noticed that I lost my battery % after flash jschisurf's mod?
Thanks for your faith! The hardest part is knowing where all the PNG's are that need to be replaced!
Replacing png's is the noob way to do it. But is is the best place to start. You need to find apktool and learn how to use it. This will solve most of your problems with xml's. You also need a program called xml editor. This is my starters list. Here is a link you might learn a lot from.
http://developer.android.com/guide/developing/tools/index.html
As far as learning which png's, most are in the drawable-hdpi folder. Stay away from .9.png files untill your ready for them. Apktool will let you know when you make a mistake and where the mistake is to fix. Search youtube and do a lot of reading in this forum. It seems like a lot but after a while you will start to understand how the OS works and manages the files. Happy Themeing!
Neo3D said:
Is it just a matter of replacing the PNG's?
What PNG optimization do you recommend?
Also, how do you change the color of the fonts? I tried to look at the xml files but they open up as strange characters in any text editor I use (Notepad++, notepad, etc)
I also noticed that I lost my battery % after flash jschisurf's mod?
Thanks for your faith! The hardest part is knowing where all the PNG's are that need to be replaced!
Click to expand...
Click to collapse
Neo3D said:
I also noticed that I lost my battery % after flash jschisurf's mod?
Click to expand...
Click to collapse
Go to the sticky where the rom wiki is and at the bottom of that page you will find kitchens. One is for changing battery icons. That one is the easy fix to getting the icons you want into the his mod. But if you must know more, there are 3 xml files in the drawable folder that needs to be replaced to work with more png files than his stock ones. All I can say is APKTOOL and 7ZIP is the bread and butter.
Thanks for the awesome tips and info!
I found the .png for the toggle switches (stat_power_background.9.png) and yea, it must be some kind of special PNG cuz I measured it out to be 80x75 but rendered incorrectly.
Sweet, looking forward to learning more about Android!
BTW, just finished looking over that Android page and is this the APKTool you're referring to?
Android Asset Packaging Tool
Thats one of them. Here is a post made by a guy who compiled them all together for anyone who wants them. Use just the tools and use that link I gave to learn about them. APKTOOL is something made by someone here on xda but I can't find his link.
http://forum.xda-developers.com/showthread.php?t=882742&highlight=apktool
Neo3D said:
Thanks for the awesome tips and info!
I found the .png for the toggle switches (stat_power_background.9.png) and yea, it must be some kind of special PNG cuz I measured it out to be 80x75 but rendered incorrectly.
Sweet, looking forward to learning more about Android!
BTW, just finished looking over that Android page and is this the APKTool you're referring to?
Android Asset Packaging Tool
Click to expand...
Click to collapse
I found the website: FWI use v1.3.1 as v1.3.2 has bugs
http://www.google.com/url?sa=t&sour...8j1-bcnOf1Rz8k9fA&sig2=4MkcxzG_ROaqAr4-tWwlGw
As stated, just changing the .png's is the starting way of theming. Just make sure you do a nandroid backup before you go around messing with anything.
When you get comfortable with that, the next step is to look into XML. XML is generally easy to learn but can be complicated at parts. I don't really know of a good starting guide to XML for android but I'll post one if I see it.
NinePatches (*.9.png) aren't as complicated as people think. Once you get the concept of it, they are actually pretty easy. I'm creating a guide for it when I have time. But the basic concept is:
The NinePatch tool ads a 1px border to an image.
The new border can be colored black (except the 4 corners).
The left and top borders defines the stretchable area.
The right and bottom borders defines where content is allowed.
Like I said, I'm making a guide to it which will explain it better and have pictures.
chogardjr said:
Thats one of them. Here is a post made by a guy who compiled them all together for anyone who wants them. Use just the tools and use that link I gave to learn about them. APKTOOL is something made by someone here on xda but I can't find his link.
http://forum.xda-developers.com/showthread.php?t=882742&highlight=apktool
I found the website: FWI use v1.3.1 as v1.3.2 has bugs
http://www.google.com/url?sa=t&sour...8j1-bcnOf1Rz8k9fA&sig2=4MkcxzG_ROaqAr4-tWwlGw
Click to expand...
Click to collapse
ok sounds good, thanks!
Skullmonkey said:
As stated, just changing the .png's is the starting way of theming. Just make sure you do a nandroid backup before you go around messing with anything.
When you get comfortable with that, the next step is to look into XML. XML is generally easy to learn but can be complicated at parts. I don't really know of a good starting guide to XML for android but I'll post one if I see it.
NinePatches (*.9.png) aren't as complicated as people think. Once you get the concept of it, they are actually pretty easy. I'm creating a guide for it when I have time. But the basic concept is:
The NinePatch tool ads a 1px border to an image.
The new border can be colored black (except the 4 corners).
The left and top borders defines the stretchable area.
The right and bottom borders defines where content is allowed.
Like I said, I'm making a guide to it which will explain it better and have pictures.
Click to expand...
Click to collapse
I tried the 9patch app and it's pretty easy to use (I have experience with Illustrator and Flash). However, when I replace the original 9path file w/the new one, it shows the 1 px border on my android. Also, it seems to scale it wrong. I attached an example of what I'm talking about. I measured the bkg of the power toggles to be 80x75, but on the Android, it shrinks the graphic and you can see the 1 pixel border?
Looking forward to that guide!
Neo3D said:
I tried the 9patch app and it's pretty easy to use (I have experience with Illustrator and Flash). However, when I replace the original 9path file w/the new one, it shows the 1 px border on my android. Also, it seems to scale it wrong. I attached an example of what I'm talking about. I measured the bkg of the power toggles to be 80x75, but on the Android, it shrinks the graphic and you can see the 1 pixel border?
Looking forward to that guide!
Click to expand...
Click to collapse
are you talking about the background of the icons or the entire power area?
the background of the icons look fine to me even zoomed in.
if your trying to make the entire power area be the caution image, then there is an xml edit involved in res/layout-hdpi-v4/status_bar_expanded.xml. ill give you the exact change you need if you cant figure it out.
just keep in mind that ninepatch will only stretch images, not repeat.
Skullmonkey said:
are you talking about the background of the icons or the entire power area?
the background of the icons look fine to me even zoomed in.
if your trying to make the entire power area be the caution image, then there is an xml edit involved in res/layout-hdpi-v4/status_bar_expanded.xml. ill give you the exact change you need if you cant figure it out.
just keep in mind that ninepatch will only stretch images, not repeat.
Click to expand...
Click to collapse
ahh ok, i wasn't sure how the background of that area worked. so there's a background png and a background png for each widget?
i found this png: stat_power_background.9.png
which other one is for the background of the entire thing?
about the extra 1 pixel showing, you can see on the sides of the background a black vertical line. on 9patch png's, is the 1 px border that defines the 9patch actually supposed to show? i think there might be something wrong with my 9patch png's.
also, if you look at the screen cap again, there's horizontal white space above and below the toggle widget bkg graphics. is there a way to make them larger so they cover the white space? seems like android likes to shrink them to that size (in the screen cap) no matter how tall the image is.
Neo3D said:
ahh ok, i wasn't sure how the background of that area worked. so there's a background png and a background png for each widget?
i found this png: stat_power_background.9.png
which other one is for the background of the entire thing?
about the extra 1 pixel showing, you can see on the sides of the background a black vertical line. on 9patch png's, is the 1 px border that defines the 9patch actually supposed to show? i think there might be something wrong with my 9patch png's.
also, if you look at the screen cap again, there's horizontal white space above and below the toggle widget bkg graphics. is there a way to make them larger so they cover the white space? seems like android likes to shrink them to that size (in the screen cap) no matter how tall the image is.
Click to expand...
Click to collapse
Well theres a solid color using a ARGB hex (for the background of the power control area) and a png for each icon background by default. you can set it up so there is an image for each.
the stat_power_background.9.png controls each icon (as you may have guessed already)
i'm not sure why the power control area isnt a solid color.
when in the ninepatch editor, you are supposed to see the black extra pixel but when you load it on your phone, they should dissappear. i honestly dont see them in the ss you provided.
can you send me the framework-res.apk you are working on so i can see if everything is set up correctly?
I thought it would be fun to try to create a TWRP theme. I've never been amazingly good with GIMP/Photoshop, but I really want to make a theme or two of my own to both sharpen my skills and learn more about the process.
My first idea was, for some strange reason, a Star Trek LCARS interface theme. I mocked up some screens (see attached images) and wanted to poll the readers here to see if anyone thought this was a good idea or a horrible interpretation (or both, I guess).
I know that there likely will be several problems with what I'd like to do vs. what I will be able to do, but I am trying to figure out the base set of screens before I actually go make the individual images and start working on the XML. Maybe some of you out there who have already created themes could share some tips....?
Feedback welcome!
Resources
anorris666 said:
I thought it would be fun to try to create a TWRP theme. I've never been amazingly good with GIMP/Photoshop, but I really want to make a theme or two of my own to both sharpen my skills and learn more about the process.
My first idea was, for some strange reason, a Star Trek LCARS interface theme. I mocked up some screens (see attached images) and wanted to poll the readers here to see if anyone thought this was a good idea or a horrible interpretation (or both, I guess).
I know that there likely will be several problems with what I'd like to do vs. what I will be able to do, but I am trying to figure out the base set of screens before I actually go make the individual images and start working on the XML. Maybe some of you out there who have already created themes could share some tips....?
Feedback welcome!
Click to expand...
Click to collapse
What are you using to make your shapes/frames with? Do you have Adobe Illustrator? If so, i recommend you use the pen tool in there to make your shapes/frames. It creates vector art that you can enlarge or decrease to any size without losing resolution. Check your inbox.
Right now, I'm just using GIMP (on Win7) for everything. As I said, I'm not really that good with it, but I'm trying to learn. Could GIMP do the same with the path tool?
anorris666 said:
Right now, I'm just using GIMP (on Win7) for everything. As I said, I'm not really that good with it, but I'm trying to learn. Could GIMP do the same with the path tool?
Click to expand...
Click to collapse
Same in principle, but not going to look nearly as good as Illustrator. GIMP is good for open source, but can't compete with the quality of Adobe.
Now thats an awesome theme.
Keep on going.
Hey deadpool, where did you get your kindle fire font? (the one in your sig)
Jaa-Yoo said:
Now thats an awesome theme.
Keep on going.
Hey deadpool, where did you get your kindle fire font? (the one in your sig)
Click to expand...
Click to collapse
Check your inbox
Doooooo iiiittttt!!!!
Sent from my CM7 Kindle Fire
@OP That. Is. Awesome.
Release this already! It looks amazing, do not stop.
Thanks for the encouragement. I'm actually reworking some of the base shape primitives to ensure better quality at the resolution. Same idea as CodenameDeadpool was getting at with the vector-based shapes suggestion, but not quite the same as having Adobe Illustrator doing the heavy lifting.