Your favorite Apple, iPhone, iPad, iOS, Jailbreak, and Cydia site.
Thread: Theme Help For everyone!!
08-08-2012, 11:11 PM #1
Theme Help For everyone!!
Hello all Thought I would post My very Bright and colorful theme You may ask why Are you posting this pile of colorful sh*% well the answer is very simple "all to help" I decided to do this theme up because I have trouble remembering what images are what so this was simple way for me to find them now atm is is separated in two themes to make it easier to find the image you are looking for "Yay" anyways its' mainly UI atm and is not finished but I figured why not post what I got to get ppl started anyways check out screens ta can see how simple it will be to find what ya looking for, And yes I will be updating this more and get all UI finished then I will start working on other parts and I encourage everyone to help cause then maybe we can get a simple theme Guide theme for ppl to follow.
Big thanks to FlybriTn for the use of his theme to destroy and make all colorful
UPDATED: Almost all UI has been done! please inform me if any was hard to find by color.
The UI itself is 3 themes to make it easy as possible to find each image.
Last edited by jima6636; 08-27-2012 at 10:44 PM.
The Following 18 Users Say Thank You to jima6636 For This Useful Post:
BadJ3d1 (12-21-2012), BOGMAT (08-21-2012), Coop2009 (09-01-2012), Costaxp (08-27-2012), ecksel02 (08-21-2012), holdemdogg (08-30-2012), It's Mi (09-01-2012), jayjOka (08-10-2012), kuanyu (08-12-2012), Laxu (08-22-2012), metaserph (08-08-2012), mmaboi21 (08-23-2012), Runt (08-31-2012), SkyGuy5 (08-20-2012), ulysseleviet (01-02-2013), vporter (08-30-2012), ZFrost (08-20-2012), Z_rock (09-02-2012)
08-08-2012, 11:25 PM #2
Its a good thing u were born with a shovel.
The Following User Says Thank You to Anonymous For This Useful Post:
08-08-2012, 11:30 PM #3
08-08-2012, 11:31 PM #4
Looks good can't wait for it to come out! Would love to do some learning!
The Following User Says Thank You to brokedrifter For This Useful Post:
08-08-2012, 11:32 PM #5
the devil that is. cause he has got a lot of digging to do . but on a much more colorful note. I am interested to see the response you get. I can think of a few people that need to beading this. interesting work Jim
08-08-2012, 11:35 PM #6
08-08-2012, 11:51 PM #7
This is what acid must feel like.., all the colors!!!
Is that a double rainbow in that theme? =P hehe#eli7e revived me
The Following User Says Thank You to k.nitsua For This Useful Post:
08-09-2012, 02:54 AM #8
Very good idea. Thanks for this.
The Following User Says Thank You to KraXik For This Useful Post:
08-09-2012, 04:55 AM #9
I'm glad I can't see colors
The Following User Says Thank You to 2k1 For This Useful Post:
08-09-2012, 11:20 AM #10
hopefully will post update tonight with more of the UI.
08-10-2012, 09:31 PM #11
i'll bump cause this is helpful.
08-12-2012, 02:48 PM #12
almost all UI is completed should be posting it today.
updated on first post.
Last edited by jima6636; 08-12-2012 at 03:28 PM.
08-12-2012, 06:52 PM #13
Great job Jim. Always looking out for the community.
The Following User Says Thank You to Z_rock For This Useful Post:
08-13-2012, 01:23 PM #14
should of put Big Boobs in the title
The Following User Says Thank You to jima6636 For This Useful Post:
08-15-2012, 04:09 PM #15
08-20-2012, 02:45 PM #16
08-20-2012, 03:51 PM #17
There was another post about this sort of thing in the themes discussion page, I wrote a fairly long kind of tutorial for the basics of theming, thought this would be a good place to re-post it for anybody interested Sorry if some of it doesnt make complete sense, it was written in cintext to a few previous posts!
[email protected] (640x960), Info.plist, Wallpaper.html, LockBackground.html, Widget.html [email protected] (960 X 960) all go in the theme folder
For the plist, use this link:*Complete List of Info.plist keys for Winterboard
Not many people have a plist editor so I'll explain how to do it using more commo programmes*
Start a new document with notepad/notepad++/whatever you want to use and paste this text in:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
Then look through the list in the above link and decide what you want to do, the format is as follows (using badge style as an example):
This website is really useful for anything that uses CSS as the string:*CSS Tutorial
The file must end with
The .html files are a lot harder to explain, there are a lot of different things that they can do, weather/time/date/RSS widgets are pretty common, but they can also be used to put a 'collage' together using picture frames, overlays etc.
If you want a widget, I'd suggest downloading a theme with a lockscreen that contains the info you want, and then just re-styling it, which is pretty simple to do. At the top of any html file is a <style> section, which as you can imagine, sorts out how a it will appear. This is all coded for using CSS, meaning the above things can be used. Changing font sizes to 0 and removing the code that searches for particular images are probably the best way to remove unwanted information.*If you want to include html designed by someone else in a theme you plan to release, make sure you get the creator's permission first.
Creating images is much easier. Here's an example of what I mean incase I'm being unclear:
Here, the greyish part is one image, with a transparent centre, and the picture in the middle is a seperate file.
To do this, use the following code:
<img src="Wallpaper.png" style="position:absolute; z-index:0; border-radius: 0; top:70; left: 51px;" height="286" width="215";>
<img src="Overlay.png" style="position: absolute; z-index:1; top:0px; left: 0px;" height="480" width="320";>
the <img src="XXXXXX.xxx" part of the code searches the folder that the .html document is in for the file described, it can also search other folders, for example <img src="Wallpaper/Images/Wallpaper.png" would search THEMEFOLDER/Wallpaper/Images for the file Wallpaper.png. The latter part of the code is more CSS stuff to sort position size, etc.
LockBackground.html will appear on the LS, Wallpaper.html will be on the homescreen, and Widget.html will be on the homescreen 'above' Wallpaper.html. You can use the same html for any of them and the outcome would be the same, the only thing to bear in mind is that only LockBackground.html is interactive. This probably won't matter for most people, all it means that, for example the touchSpin lockbackground in Boss.ios wouldn't be able to spin if it were a Wallpaper.html or Widget.html
Also, these same htmls can easily be transferred into PerPageHTML+.
My take on Winterboard is that it works as new route for the iOS to search through files for. You're device knows the name and location of each image it want to find, but once winterboard is installed, it will search through active theme folders before it searches the default system files. Once an image is found, the device will stop looking for it. Therefore the images from the theme at the top of the list will be used, and any images for the same file in themes lower down, will be ignored. This is why it is so important that the names of the files are copied exactly.*
The size of the file is less important to copy. More often than not, you can completely resize and image, and the system will adjust to your change, sometimes with less than desirable results, sometimes with awesome results! (Not all images will accept resizing however, I find icons are less likely to be 'found' if the size is wrong). The thing that cannot be changed (as far as I know) is the 'start point' of an image. For example, if an image's start point is the top left, then adding blank space below and image and extending its size will make no difference, however, if the start point is the bottom left, adding the same blank space below an image will force the image upwards.
I know you didn't ask for this, but it's pretty useful and since this is already a bit of an essay, I though it wouldn't do any harm to include it!
com.apple.mobileicons will contain the images you need to create auto-theming icons. I have struggled when reading the most recommended guide (How to Create AUTO-SKINNING App-Store Icons for Your Theme....) so I thought I'd write my own little description of how it works.
Firstly, auto-theming only applies to app-store apps. Cydia and default apps must be themed manually. Secondly, I may get the names slightly wrong here, but once you look in the folder, it will become clear which images I mean!
AppIconOverlay is the image which overlays your apps. However, this only works for some apps (decided by the app dev & cannot be changed) so it is recommended that you delete the image's contents and leave it as a blank image.
AppIconShadow and AppIconMask are the two you really need to use. AppIconShadow is the shadow which will appear behind every auto-theming app (This is different to WallpaperIconShadow in com.apple.springboard which WILL be applied to ALL app icons).
AppIconMask is the most important as it modifies the shape of your icons. This only uses black and white, and gradients of the two. Black areas of your image create fully transparent areas of your apps, whereas white areas create fully opaque areas. Therefore, a white circle inside a black background will give you a round icon, and a black circle inside a white image will give you an icon with a hole in it. White to black gradients can be used to make semi-transparent sections of the icon, this can then be used in combination with the appiconShadow to give shadow or shine effects.*
Most importantly, AppIconMask MUST be saved as a 24-bit png file (or save for web) in photoshop, there is an option for this (I think!) If you use GIMP, I'd recommend downloading irfanview as it's very lightweight and can utilise a plug-in for the save for web option.
If you play around with this, then I'm sure you'll quickly discover the flaw with this; that icons with irregular shapes which contain transparent areas themselves (see my icons above) will get a black 'shadow' in the shape of you AppIconMask. To fix this, you must enable summerboard mode in winterboard. Then, create a file called 'Icons' inside your theme folder. Save your irregular shaped icons here, under two different names; XXXX.png and*[email protected], where XXXX is the app name exactly how it appears on the springboard for example Facebook.png and*[email protected] Icons placed in this folder will ignore anything inside the com.apple.mobileicons folder, therefore they won't have to suffer the effects of AppIconShadows,Masks, or even Overlays.
For everyone who needs it, here's also how to theme images (including the icons) all you apps, cydia or app store.*
Firstly, download app info from cydia, it will tell you all you need to know most of the time.
For an appstore app, open app info, click on the app and find where it says*Id :*this is what you must name the folder inside your Bundles folder (e.g. com.google.chrome.ios) below this you will see what the icon image must be named.
For Cydia apps, the above method sometimes does, and sometimes doesn't work. If it doesn't, do the following instead:
-Browse to var/stash/Applications/APPNAME and open the info.plist
-the CFBundleIdentifier is what you must name the folder inside you Bundles folder
-the CFBundleIconFiles is what the icon must be namedHit 'thanks' if I helped, email [email protected] with questions, requests, and compliments
08-20-2012, 06:55 PM #18
08-20-2012, 09:49 PM #19
-the CFBundleIconFiles is what the icon must be named[/QUOTE]
thank you sooooo much ! Although it is all greek to me,, I know it will all make sense practicing. I especially thank you for providing your email address. xoxo
The Following User Says Thank You to lizzy954 For This Useful Post:
08-24-2012, 10:34 AM #20
well since they stuck this I will continue to update it
The Following User Says Thank You to jima6636 For This Useful Post:
It's Mi (09-05-2012)