Welcome to XDA

Search to go directly to your device's forum

Register an account

Unlock full posting privileges

Ask a question

No registration required
Post Reply

[ICONS][GUIDE] Creating Mask Based Icon Themes (with Example)

OP bdjnk

19th June 2014, 03:50 PM   |  #1  
bdjnk's Avatar
OP Member
Thanks Meter: 11
 
33 posts
Join Date:Joined: Jul 2010
More
I've only created two icon packs, but they seem to work, so I'll take you through my process.

The first thing to research is how mask based icons work in general. There's a dearth of good information, but I did find the Icons Special Features section of the ADW Theming Guide to be useful. Alternatively, you can follow along and examine my images to gain an understanding of what I've done.

Let's proceed.

I began with mathur's Icon-Pack Template, but I've modified it to fit my needs by removing unnecessary bits and the parts relating to non-mask based icon packs. See the attached example, Crinkle.zip

Once you've downloaded Crinkle.zip and imported the code into eclipse, there are several things you'll need to alter:

First, you must rename the package. This can be done by doing one (or both) these actions:
[project (context menu)] > Android Tools > Rename Application Package
[package (context menu)] > Refactor > Rename

Second, ensure the correct scale factor. This can be found in two places:
assets / appfilter.xml
res / xml / appfilter.xml

Third, make sure your informational strings are correct. There are two locations:
res / values / strings.xml
res / values / theme_config.xml

Fourth, and most important, add your own icons. These can be found in res / drawable-xhdpi, and they are:
icon.png - the application icon
iconback.png - the background image
iconmask.png - the transparency / opacity mask
iconupon.png - the overlay image

Now test it out.

My finished icon pack is live on Google Play under the title Crinkle Icon Theme.

Enjoy!
Attached Thumbnails
Click image for larger version

Name:	Crinkle.png
Views:	116
Size:	62.3 KB
ID:	2806818   Click image for larger version

Name:	crinkle-desktop.jpg
Views:	197
Size:	151.4 KB
ID:	2806819   Click image for larger version

Name:	crinkle-drawer.jpg
Views:	146
Size:	133.8 KB
ID:	2806820  
Attached Files
File Type: zip Crinkle.zip - [Click for QR Code] (326.5 KB, 32 views)
The Following 3 Users Say Thank You to bdjnk For This Useful Post: [ View ]
16th July 2014, 12:53 PM   |  #2  
Junior Member
Thanks Meter: 1
 
10 posts
Join Date:Joined: May 2014
This looks great, but how would you create a mask for making all the icons black and white? Something like this:

com.seangrondin.icons.filmstripdesaturate (sorry i can't post links yet :P)

I want to make a sepia themed icon mask.

Thanks
Last edited by 1rdc; 16th July 2014 at 12:59 PM. Reason: EDIT: spelling
16th July 2014, 03:57 PM   |  #3  
Junior Member
Thanks Meter: 1
 
10 posts
Join Date:Joined: May 2014
error
Also, I'm getting an error as soon as I import.
Is there a way to make this target api 10 instead of api 19?
Attached Thumbnails
Click image for larger version

Name:	Capture.PNG
Views:	50
Size:	11.1 KB
ID:	2854737  
16th July 2014, 06:04 PM   |  #4  
bdjnk's Avatar
OP Member
Thanks Meter: 11
 
33 posts
Join Date:Joined: Jul 2010
More
Quote:
Originally Posted by 1rdc

This looks great, but how would you create a mask for making all the icons black and white? Something like this:

com.seangrondin.icons.filmstripdesaturate (sorry i can't post links yet :P)

I want to make a sepia themed icon mask.

Thanks

I looked into it a bit, and here's what I've discovered. If you include a res/xml/shader.xml file, you will be able to affect the color in at least Apex and Nova. I found a fairly detailed explanation that should help you get started.

I will soon update the original post to include more details about this, as well as a cleaner icon pack framework.
17th July 2014, 07:01 AM   |  #5  
Junior Member
Thanks Meter: 1
 
10 posts
Join Date:Joined: May 2014
How do I make it compatible with Smart Launcher? The icon pack applies but the shader doesn't work and the theme doesn't show up under "Themes"
Last edited by 1rdc; 22nd July 2014 at 01:25 PM.
Post Reply Subscribe to Thread
Previous Thread Next Thread
Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes