Attend XDA's Second Annual Developer Conference, XDA:DevCon 2014!
5,740,667 Members 49,634 Now Online
XDA Developers Android and Mobile Development Forum

[THEMING] Do-it-yourself theme with Xposed module XBlast Tools

Tip us?
 
dannejanne
Old
(Last edited by dannejanne; 22nd April 2014 at 05:42 PM.) Reason: Minor fixes + correction
#1  
Senior Member - OP
Thanks Meter 344
Posts: 1,319
Join Date: Mar 2011
Location: Írebro, Sweden
Default [THEMING] Do-it-yourself theme with Xposed module XBlast Tools

If you are on stock ROM like me, we have no theming engine that makes life sweet for us. Instead we are stuck with Googles vision for the most part. Except if you are willing to root your phone and install some modifications.

I have found that the XBlast module for Xposed framework is pretty powerful on its own and I have created myself a little theme with it and thought I could share my findings if anyone else wants to do it. The things you need I will list below but I won't write how to install it. And I'm just going to write down how I did to make it look like in my screenshots. You are of course free to experiment with your own look.

What you need:

-Xposed Installer
-XBlast Tools
-Unicon (optional)

OK so let's start by opening the XBlast Tools app. Let's start with setting the background for the system. Download the attached file from the bottom of this thread.

-In XBlast Tools, go to "visual tweaks -> Holo Theme ->Dark Theme". Enable it and chose the background you downloaded from here.
-Do the same for "Light Theme" too. Some apps will use it.

Now back out of "Light Theme" and stay on the "Holo Theme" page. Now we will set some text and other colors to match the light background you've just chosen.

-Set Primary Text Color to #ff797979
-Set Secondary Text Color to #ff545454
-Set Divider Line Color to #1d000000
-Set Pop-up & Dialog Color to #ffe8e8e8

It's important to not set the primary text color too dark, because it won't be visible on the Settings app header next to the icon where the background will remain dark. So we have to keep certain balance so its visible on both darker and lighter backgrounds. This also changes the text on the dialogs & popups so we had to also brighten those backgrounds otherwise the text is hard to see as both text and background will be dark. Also some menu text in the Gallery app for instance is affected by this also.

The secondary text color is used in the titles for the different settings categories. But also removes some of the Holo Blue texts seen in titles in dialogs for example. It also affects the frontpage of Tapatalk I've noticed. So you'll notice if you set this color way off.

Now in the XBlast Tools app again:

-In Visual Tweaks, go and change the Settings Icon Color, which naturally affects the icons on the settings page. I made them white myself. They could be black also but I wanted them white so they match the white icons that are still in the dialog windows that I can not change. So for the sake of consistency I wanted it this way. This is also why the dialog background color isn't set to all white. The icons would not be visible.

Now for the notification panel. I've tried to make it somewhat original. I have not really seen this look anywhere else before and it feels a tad bit different from the standard. There is no clear "edge" when pulling it down since we are dealing with gradients and it gives a nice little touch. Go to Notification Panel in XBlast Tools.

-Put the master switch ON.
-Set Notification Title Text Color to #ffffffff
-Set Notification Content Text Color to #ffffffff
-Set Notification Background Color to #00000000 (fully transparent)
-Set Notification Pressed Color to #10ffffff

-Now go into the Notification Header menu. Enable it and set the color fully transparent here too (#00000000).

-Back out and go into Notification Panel Bg. Enable "Notification Background Color" and set it to fully transparent (#00000000).

-Back out again and check the Hide Handle Divider Line.


Now it's time to back out to the frontpage of the XBlast Tools app. Scroll almost to the very bottom and you will see a "Gradient Settings" menu. Dive into that one. Enable it on the main switch at the top and check the "Notification Bg Gradient Color".

-Set it to #f10080ae
-Make sure "Bottom to Top" is set in the "Gradient Orientation" menu at the bottom of that page.

Reboot your phone and enjoy the changes.

Optional: install the Unicon module and apply an icon pack with it. It does not only change it for the launcher but also systemwide. The icons will be affected in dialogs and other places too. Much more powerful.


Screenshots:

Attached Thumbnails
Click image for larger version

Name:	IMG_20140421_191133.jpg
Views:	311
Size:	197.8 KB
ID:	2700403  
The Following 6 Users Say Thank You to dannejanne For This Useful Post: [ Click to Expand ]
 
LGmarly
Old
#2  
LGmarly's Avatar
Member
Thanks Meter 29
Posts: 51
Join Date: Jan 2014
Location: Venus
Wow, just wow. Thanks for sharing!
 
jmo742
Old
#3  
Member
Thanks Meter 5
Posts: 39
Join Date: Sep 2013
Location: Mobile
Thanks for sharing this However, I hate to be that guy, but I followed the instructions to the T and mine didn't come out exactly like the screenshots; my system UI is still dark and the pull down drawer is clear. I changed the gradient color to the light blue, but it didn't stick as seen in one of my screenshots. Can anyone please help me out?
Attached Thumbnails
Click image for larger version

Name:	Screenshot_2014-04-22-01-13-03.jpg
Views:	196
Size:	67.8 KB
ID:	2701178   Click image for larger version

Name:	Screenshot_2014-04-22-01-13-15.png
Views:	191
Size:	137.6 KB
ID:	2701179  
 
dannejanne
Old
#4  
Senior Member - OP
Thanks Meter 344
Posts: 1,319
Join Date: Mar 2011
Location: Írebro, Sweden
Quote:
Originally Posted by jmo742 View Post
Thanks for sharing this However, I hate to be that guy, but I followed the instructions to the T and mine didn't come out exactly like the screenshots; my system UI is still dark and the pull down drawer is clear. I changed the gradient color to the light blue, but it didn't stick as seen in one of my screenshots. Can anyone please help me out?
Seems a bit odd. Have you tried applying both the Holo Dark & Holo Light background again? And also the gradient color? Otherwise it seems you have some other issue making them not stick for some reason. Their pages should look like this in XBlast.







Sent from my Nexus 5 with a little bit of help from Fleksy
 
jmo742
Old
#5  
Member
Thanks Meter 5
Posts: 39
Join Date: Sep 2013
Location: Mobile
Quote:
Originally Posted by dannejanne View Post
Seems a bit odd. Have you tried applying both the Holo Dark & Holo Light background again? And also the gradient color? Otherwise it seems you have some other issue making them not stick for some reason. Their pages should look like this in XBlast.







Sent from my Nexus 5 with a little bit of help from Fleksy
OK. I have the system background now. I made the mistake of choosing the image with a file explorer app and instead used Gallery to do so. As for the gradient color, I haven't the slightest clue as to what I've done wrong. I repeated the steps but with no success. I provided screenshots in hopes of you possibly seeing what I did wrong.
Attached Thumbnails
Click image for larger version

Name:	Screenshot_2014-04-22-10-28-26.jpg
Views:	112
Size:	116.6 KB
ID:	2701914   Click image for larger version

Name:	Screenshot_2014-04-22-10-28-51.jpg
Views:	108
Size:	105.4 KB
ID:	2701915   Click image for larger version

Name:	Screenshot_2014-04-22-10-28-59.jpg
Views:	105
Size:	104.7 KB
ID:	2701919   Click image for larger version

Name:	Screenshot_2014-04-22-10-29-12.jpg
Views:	106
Size:	115.0 KB
ID:	2701920   Click image for larger version

Name:	Screenshot_2014-04-22-10-29-31.jpg
Views:	101
Size:	152.1 KB
ID:	2701921  

Click image for larger version

Name:	Screenshot_2014-04-22-10-29-54.jpg
Views:	101
Size:	128.3 KB
ID:	2701922   Click image for larger version

Name:	Screenshot_2014-04-22-10-30-08.jpg
Views:	102
Size:	158.4 KB
ID:	2701924  
The Following User Says Thank You to jmo742 For This Useful Post: [ Click to Expand ]
 
dannejanne
Old
#6  
Senior Member - OP
Thanks Meter 344
Posts: 1,319
Join Date: Mar 2011
Location: Írebro, Sweden
Quote:
Originally Posted by jmo742 View Post
OK. I have the system background now. I made the mistake of choosing the image with a file explorer app and instead used Gallery to do so. As for the gradient color, I haven't the slightest clue as to what I've done wrong. I repeated the steps but with no success. I provided screenshots in hopes of you possibly seeing what I did wrong.
Ah. I think I made a mistake in the guide! On the "notification panel bg" page.

It's no image as I said. Check the color selector instead and set it to fully transparent. That should do it.

Will change the guide. Thanks.

Sent from my Nexus 5 with a little bit of help from Fleksy
The Following User Says Thank You to dannejanne For This Useful Post: [ Click to Expand ]
 
jason.T
Old
#7  
Member
Thanks Meter 6
Posts: 48
Join Date: Jan 2013
Location: Minneapolis
It all works for me, except the pull down notification is clear instead of the blue that you show.
 
jmo742
Old
#8  
Member
Thanks Meter 5
Posts: 39
Join Date: Sep 2013
Location: Mobile
Quote:
Originally Posted by dannejanne View Post
Ah. I think I made a mistake in the guide! On the "notification panel bg" page.

It's no image as I said. Check the color selector instead and set it to fully transparent. That should do it.

Will change the guide. Thanks.

Sent from my Nexus 5 with a little bit of help from Fleksy
Thanks! That did the trick
 
dannejanne
Old
#9  
Senior Member - OP
Thanks Meter 344
Posts: 1,319
Join Date: Mar 2011
Location: Írebro, Sweden
Quote:
Originally Posted by jason.T View Post
It all works for me, except the pull down notification is clear instead of the blue that you show.
I made a mistake in the guide. The solution is in the post above yours. Also I have changed the guide to the correct method. Sorry for the trouble!

Sent from my Nexus 5 with a little bit of help from Fleksy
 
dannejanne
Old
#10  
Senior Member - OP
Thanks Meter 344
Posts: 1,319
Join Date: Mar 2011
Location: Írebro, Sweden
Quote:
Originally Posted by jmo742 View Post
Thanks! That did the trick
Excellent!

Sent from my Nexus 5 with a little bit of help from Fleksy

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


XDA PORTAL POSTS

Play Your Hits and Learn the Lyrics with NextGen Music Player

There are plenty of music players for Android available in Play Store. They … more

Control Your Toast Notifications with SlicedToasts

Toasts are delicious, even in their Android flavor. In Android, toast doesn’t lead … more

Rotation Lets You Take Full Control of Your Device’s Orientation Settings

To be brutally honest, the native options for screen … more

Change the Alarm Icon in the Status Bar with Xposed

It’s hard to find a more hated object than your alarm clock. They wake us up nearly … more