Related
Hey Folks,
I'm an absolute noOb in programming but I need a Script for MortScript.
The Script should do the following:
In S2U i can only set Jpg Images for a random change.
So, i would like to use Mortscript to
-copy .gif picture X from /StorageCard/My Pictures to /ProgramFiles/S2U/gfx/wallpaper.gif
-and after time X copy the file back and take another one.
I think the problem is that the wallpaper for S2U must be named as wallpaper but i can't have a folder on storage card with 20 or more wallpaper.gif files.
Is there the possibitity to use MortScript to rename the files to wallpaper.gif and later back to the old name (or maybe another name like 1, 2, 3 and so on.)
It would be great if someone could make such a script, an i'm sure that other people would like it, too.
Randomly change S2U2 wallpaper
Hey, buddy,
I wrote this script some time ago and I've been using it for a while now. I thought I was the only one who wanted random gifs, guess not
Attached is a MortScript I wrote, it will choose a random file in a directory of your choosing and set it to the S2U2 background every 2 hours.
To change the directory: edit Line 8
To change how often you want the images changed: edit Line 33
Make sure you copy this to your My Documents folder on the device mem and run it. Then it'll change randomly for you.
Currently I have it set up to choose gifs and jpegs, but you can change that in Line 8, in theory
Enjoy and pass it on to others!
- chis
thank you amigo it s cool idée
chris.wilcox said:
Hey, buddy,
I wrote this script some time ago and I've been using it for a while now. I thought I was the only one who wanted random gifs, guess not
Attached is a MortScript I wrote, it will choose a random file in a directory of your choosing and set it to the S2U2 background every 2 hours.
To change the directory: edit Line 8
To change how often you want the images changed: edit Line 33
Make sure you copy this to your My Documents folder on the device mem and run it. Then it'll change randomly for you.
Currently I have it set up to choose gifs and jpegs, but you can change that in Line 8, in theory
Enjoy and pass it on to others!
- chis
Click to expand...
Click to collapse
This is really cool, thanks a lot
In my p3600 the gif's does't animate.. what am i doing wrong? how do i use your tool?
Hey guys,
I have the HD2, 172 WWE ROM.
I tried using HDWall app to create new slider icons. Nothing worked.
Does nayone have an app that can create slider?
If not, who wants to make one for me? I can give you all the icons, you create a cab?
I am pretty desperate as I have a couple I want to make that I love.
Thanks to any volunteers or helpers.
You can use a program called CFC_GUI to view and edit any manila graphic.
Thanks for responding.
I downloaded this but couldn't get it to work.
I selected the slider icon I wanted to change (to test) and selected replace with, the click on the icon I want. It runs through (stops sense) and just says 'fail'.
Also, I thought the slider icons were 64x64, and the larger icons 128 x 128.
This app shows them as 256 x 256.
Do you know what the correct size is for the sliders and the larger ones?
Well you will first want to make a folder some where. Connect your phone and put it into sync. From there open CFC_GUI >Device>Import from device. This will import your manila graphic files. Now you will want to go through these files and find all the files that pertain to the slider icons, quick hint there are a lot of them. Depending on the ROM there can be anything from 3 to 4 of them for each tab. Most will range in 64 while one will be 256. The 64's are for the actual tabs and also the customization setup pictures(for selecting the order of the tabs) in settings for the phone. While the 256 is for the big main graphic that is centered in the phones screen when it's slide over or selected. You will have to do more then just replace the files. When you select each file you want "save as" this while save it to the folder you open CFC_GUI for the first time. Once you have the actual images saved as a pngs you can then bring these files into a photo editing program. You will find that the size of the picture is not the actual size of the graphic.....sure it might be 64x64 but the actual graphic will be a bit smaller and is usually a bit off center and to the top left. So you take the picture you want (hint use pngs since most don't have backgrounds) to replace it with and paste it over the other picture as a layer. Adjust the picture until it's perfectly over the original layer under it. Once you get it right you can delete the original layer leaving your new graphic. Save the image ,possibly to a new folder but with the same original name. The next time you open CFC_GUI it will open the original files you don't have to plug the phone in yet, the program creates it's own folder and saves the files from when you imported them. Go through and replace the files you want , won't be hard if you keep the original file name when you saved your edited version. Once you replace them all you can close the program. Turn on the phone go to settings and turn off Sense. This option can be skipped because the program should turn off Sense when you go to export but some times it doesn't and messes up. Once synced open CFC_GUI recheck your work then go to
Device>export to device.
Unplug the phone turn Sense back on and they should be there.
Man I don't think I have ever had to write this much directions for this so be thankful I felt like being long winded tonight hope it helps.
Donation to you if you create slider icons set.
Wil,
I sincerely appreciate your reply. I have given it a go and read through your instructions many, many times.
Honestly, this is too hard for a novice like. I don't even know how to use photoshop properly.
I am willing to offer a donation to anyone who is willing to create a slider icon set for me.
I have all the icons, just need someone with the experience.
Anyone? Wil, can you?
Photoshop is not that hard. Just save the graphics like I said earlier. Bring the image into photoshop. Bring the image you want into photoshop. Go Select>all. Edit>copy. Go back to the original file. Edit>paste. It should paste it to a new layer all by itself. If the picture is a bit big or small you should be able to drag it to fit. You can also adjust the ocupancy down a bit to be able to see through it while you adjust. If your confused about the whole layer thing do a video search for Working with Photoshop Layers. There are plenty of them out there. It's a basic if you want to use photoshop the right way.
This should be in the Theme part but try to find the some threats of Dinik. He's a great designer and made even some easy walk throughs about how to make icons and how to replace them on your HD2
*edit*
Dinik Creations
When you look in the threats posted you find easy replacing tools
Stuck on final step.
Hi Wil,
Firstly, sorry for the very late reply. I have been working away collecting the icons I like, and trying to use Photoshop. I have finally figured it out.
I am stuck on the final step I think.
I have created all the icons correcty (to the top and right) based on the layering method you mentioned. Should be fine.
I have then used CFC to 'import' the png's. No problem.
I use CFC to browse the files and I can see the new icons I have imported.
What do I do now?
The files do show up in CFC, but not as slider icons in manila. Whats the final step?
Thank you in advance.
These are the manila fiels names from what I have researched. Please let me know if this is wrong.
Home
299c5eF5_manila (slide)
75499aa8_manila (big icon)
People
4f1d31ce_manila (slide)
1d7b29c4_manila (big icon)
Messages
76c3b921_manila (slide)
278db717_manila (big icon)
Mail
33afebf1_manila (slide)
2577a407_manila (big icon)
Internet
04abcd12_manila (slide)
4fca8b48_manila (big icon)
Calendar
4b721343_manila (slide)
613b21b9_manila (big icon)
Stocks
17ef70ed_manila (slide)
17ac5803_manila (big icon)
Photos
5631ec52_manila (slide)
3ca89548_manila (big icon)
Music
609e396a_manila (slide)
472f33c0_manila (big icon)
Weather
056fac59_manila (slide)
042e5baf_manila (big icon)
Twitter
2077631c_manila (slide)
7ffecf32_manila (big icon)
Footprints
28601361_manila (slide)
6f24d697_manila (big icon)
Settings
7aeB367a_manila (slide)
5389eeb0_manila (big icon)
http://forum.xda-developers.com/showthread.php?t=503511
i dont know it works for HD2 but i think it will
Thanks Veldmuus. I tried that previously, didn't work. It has completely different file names.
I tried 'export to device. Sense did stop (I saw it stop on my phone) did the export, then restarted sense.
For each fil that it was supposed to export, I just got the error 'fail'. No other info.
Any help?
An Introductory Guide To Theming Miui
Much like CM7’s theme chooser, Miui has it’s own powerful theme engine. If you’ve ever wanted to create your own theme or have a theme that you like, but want to make some personalized changes; then this guide’s for you. This guide is intended as a supplement to Team D3rp’s thread; [Guide][Reference] An Intro to Themeing. Please keep all questions, comments, and suggestions in this thread Miui related also feel free to hit us up at #miuithemes on the IRC. General theme questions, image editing questions, xml editing questions, or anything of that nature should be asked in the afore mentioned thread. Before we begin it’s necessary to thank scott951 and bigrushdog for there past, present, and future work on this rom. In addition, thanks to toastcfh & Cayniarb for they’re work on the AOSP kernel, to bliind for his ongoing IRC support, tips & tricks, and lastly thank you to Team D3rp (il Duce, ranger61878, thoughtlesskyle, vanessaem, dkdude36, jdeloach, and pstevep), all the old HeroC guys, the many talented themers, and everyone else on XDA and IRC who continue to advance my knowledge of the Android Operating System.
To begin your adventure into the world of Miui theming you will need some tools, listed below:
7zip or similar archiving program
Notepad ++ or similar text editor
gimp or another image editor of your liking
Root Explorer (or your prefered file manager with root access)
Patience, patience, patience
Time, time, time
A willingness to bork your theme over and over again until you’re satisfied with how it looks
Recommended knowledge of adb and/or Android Commander- not required but may save you the time of having to restore a nand.
Table Of Contents: for your convenience in finding specific areas of help.
Lesson 1: File Structure
Lesson 2: Beginning Your Theme
Lesson 3: Lockscreens
Lesson 4: Changing Icons
Lesson 5: SystemUI
Lesson 1-File Structure
Before you can actually theme anything, you need to learn and understand the basic file structure used by Miui. Themes are compressed into zip files with a .mtz extension and are applied by the Miui theme engine at “run time”, meaning you can change almost any aspect of your theme on the fly, without a reboot. Download my intro.mtzfor use along with this guide. This is the default Miui theme with a simple lockscreen included that you will have to edit (It works but you will have to edit it per my instructions for it to look good), and a generic android boot animation / boot audio file. If you currently have a theme that you are generally happy with and would prefer to edit that more to your liking, you may do so by opening the Miui theme engine, select customize, scroll down to the bottom of the page and select “Backup Theme” After the backup finishes running, navigate to /sdcard/Miui/theme/backup and move the “backup.mtz” to your computer. Now let’s extract our .mtz and have a look at what’s inside. Right click on the intro.mtz, select 7zip from the popup window, and then select extract. Now navigate to the extracted intro.mtz folder and have a look inside. You should see the following:
“boots” folder
“preview” folder
“ringtones” folder
“wallpaper” folder
“com.android.launcher” zip file
“description” xml file
“icons” zip file
“lockscreen” zip file
The folders can be opened as any normal non-compressed document folder, the zip files (although their extensions are nonconventional can be extracted with 7zip, and the xml file can be edited with notepad ++.
Lesson 2 – Beginning Your Theme
Decide what you want your theme to be called and create a new folder for it somewhere that’s easily accessible.
Open up the description xml with notepad ++ and edit it to reflect your theme name on this line: <title>Default</title> (Change default to the name of your theme), edit this line: <author>MIUI</author> (Change MIUI to your name), and edit this line: <version>1.0</version> (from 1.0 to whatever version # you would like to call your theme). Save your changes and move the document to your newly created theme folder.
Now, if you so desire, in your theme folder create a sub-folder entitled “boots”. Place any boot animation & boot audio files in there that you would like to use, and make sure they are named correctly (bootanimation.zip & bootaudio.mp3).
Create a “preview” sub-folder next. This is where you’ll put screenies of your theme as you continue to develop it. Make a note of the file names and sizes in our original preview folder, also if you look you’ll see that some of the photo’s are jpegs and some are pngs. I’m not sure as though it matters, but I’ve developed a habit of keeping the extensions the same.
Now you can create an optional “ringtones” subfolder and assign rintones, notifications, and alarm sounds, by default when applying your theme. Use any mp3 you like so long as the files are named alarm.mp3, notification.mp3, and ringtone.mp3.
Create a “wallpaper” sub-folder within your theme folder next. This will be the home of your theme’s default wallpapers. Again look back at the intro.mtz and notice the size of the wallpapers in that folder and the file names. When you put your jpegs in this folder make sure they are named exactly default_lock_wallpaper & default_wallpaper.
Congratulations, you’re now on your way to making your own custom theme. Now that we have the simplest things covered and out of the way, we can really start to dig in and do some theming!
Lesson 3 – Lockscreens
Skipping over icons for a moment, lets jump to the lockscreen. As you know by now our Evo 3D’s QHD displays don’t play nice with a lot of lockscreens. So lets have a look at what we can do to fix some lockscreens. Please keep in mind that depending on which lockscreen you want to use they will require varying degrees of changes to work properly. The lockscreen I included with the intro.mtz functions, but looks terrible so now we’re going to fix it.
{
"lightbox_close": "Close",
"lightbox_next": "Next",
"lightbox_previous": "Previous",
"lightbox_error": "The requested content cannot be loaded. Please try again later.",
"lightbox_start_slideshow": "Start slideshow",
"lightbox_stop_slideshow": "Stop slideshow",
"lightbox_full_screen": "Full screen",
"lightbox_thumbnails": "Thumbnails",
"lightbox_download": "Download",
"lightbox_share": "Share",
"lightbox_zoom": "Zoom",
"lightbox_new_window": "New window",
"lightbox_toggle_sidebar": "Toggle sidebar"
}
Extract the “lockscreen” file that you downloaded. Inside you’ll see an advance folder.
Open the advance folder. This is where the lockscreen magic happens. In this folder are all of the lockscreen png’s and the manifest.xml
Let’s start with the png’s.
-Resize bg to 540X854
-Resize bottom to 540X178
-Resize bottom_batterylow to 540X178
-Resize bottom_batterylow_light to 540X240
-Resize charging_bg to 540X178
-Resize charging_bg_mask to 540X178
-Resize status_bar to 540X40
-Resize time_bg to 540X107
Feel free at this time to edit and/or replace any of the png’s in here, as you see fit, but be sure to keep the icon names correct and watch out for the .9png’s (there are none in this lockscreen, but if you’re using a different one beware).
Now that the png’s have been fixed let’s have a look at the manifest.xml, shall we? Our images are all the proper size, but if we loaded the lockscreen now the icons and text would all be shifted to the left of the screen. In addition to making positional adjustments in this file we can change font sizes, font colors, time & date format, even which apps the lockscreen will launch. Go ahead and open that xml file now with notepad ++.
Find the two lines that begin with <DateTime. On these lines you can change the x & y locations to get the proper spacing from the edge of the screen. (x is the horizontal plane, y is vertical x0,y0 being the top left corner of the screen). You can change the text color (#FFFFFFFF) to whatever you like, the font size (size="22"), and the date format (format="EEEE, MMM d")
Now, work your way down through the xml file making any adjustments you want to make to text sizes, colors, and the necessary x shifts to get your lock screen lined up and centered. If by chance you get stumped, compare your manifest.xml with my manifest_edited.xml.
*hint, I usually use a pencil and paper to draw out the screen, then calculate how big of a left margin I want, add the image widths, to figure how big of a change to make. For example x20 + 480 png width=500 (leaving a margin of 40 on the right). Now if I change to x30 + 480 png width = 510 (leaving me a margin of 30 on both sides).
Once you’re done editing the .xml save it (keeping the original of course to refer back to)
Back out of the advance folder now and right click on it. Select 7zip from your popup window and “add to archive”. When prompted, save as “lockscreen.File”, set your file type as .zip and save your lockscreen to your theme folder. After it saves delete the .File from the name. Windows will prompt you that this may make the file unusable, click ok.
Navigate to your theme folder and select all of the contents inside of it (boots, preview, etc…). After selecting all of your theme components, right click again, select 7zip, and add to archive. Save your theme as “whatever_name”.mtz again choosing .zip as the file type.
Place your newly created theme on your sd card in /sdcard/MIUI/theme
Apply your theme and enjoy. If you’re happy with your lockscreen take a screenie to add to your preview folder when you make your next edits. Remember if you do something that breaks your lockscreen you can unlock by pressing back & volume up, or you can use adb to delete lockscreen from /data/system/theme and push a good lockscreen back.
Lesson 4 – Changing Icons
Changing your desktop and folder icons is a great way to enhance your theme. Miui’s theme manager makes this a relatively simple process. You can edit the default system icons with your image editor, or take your favorite icon collection and resize them to 90 X 90 pixels if you wish to keep the default Miui icon size. Lets begin!
Navigate to your intro.mtz and use 7zip again to extract the icon.File
Inside your extracted icon folder you’ll find all of the icons for the default system apps.
Changing system app icons
Find the icon that you want to replace in the folder. Let’s use the browser for example.
Find the icon you want to replace it with and rename that icon to com.android.browser
Copy your new browser icon into the icon folder, overwriting the existing one.
Adding icons for user installed apps is a little more involved but worth the extra time to make your theme complete. Here is where it’s handy to have Root Explorer.
Let’s say we want to add an icon for dropbox
To do this we need to know the process name. There’s a couple of ways we can figure this out. Since every app installed creates a data folder we can use Root Explorer to look in /data/data for the package name of dropbox.
If the package name didn’t jump out at you, don’t worry there’s another way to do this. Again using Root Explorer navigate to /data/app and find the dropbox apk, long press on in and select “extract all”, navigate to /sdcard/extracted and open up the extracted dropbox apk. Now tap the AndroidManifext.xml file, which should open up a text document and the very first line should give you the manifest package name.
By now you should know that the package name for dropbox is com.dropbox.android
Find the dropbox icon you want to use.
Rename the icon to com.dropbox.android
Drop the icon into your icon folder.
Repeat these steps for all of the icons which you want to replace.
Once you are finished replacing and / or adding icons, from within the icon folder, select all, then right click, select 7zip, and add to archive.
When the 7zip popup screen appears, save them as icons.File
Delete the .File extension
Move your zipped icons file to your theme folder.
Zip your themes folder up as a .mtz and apply it to your phone the same as you did after you finished your lockscreen.
Again, if you are happy with your icons take a couple of screenshots for your preview folder.
One last side note in regards to icons. You may notice some apps such as google + install additional icons to your homescreen (G+ Messenger). I have not figured out the image naming trick yet for these icons to display from the theme, but I’m working on it. For the time being I extracted my G+ Messenger and replaced the icon in the /res/drawable-hdpi folder, but I am searching for the correct way of doing this and will update accordingly once it’s figured out.
Lesson 5 – SystemUI
Now, we're going to add a whole new element to our theme. We're going to create a SystemUI zip in our theme mtz. Examples of some things that we can change in SystemUI are notification bar icons (signal, battery, gps etc), Statusbar back ground, and the various tabs you see in your drop down expanded notification page. Let's begin.
Create a working folder somewhere easily accessible on your computer (I like to work from my desktop)
Inside of your working folder, create a subfolder named "res"
download my theme_values_SysUI.xml, place it in your working folder (not in the "res" subfolder), and rename it to theme_values.xml.
Now you will need a SystemUI.apk from Miui. You can either unzip the rom on your computer and move the .apk to a convenient location of your choosing, or you can use adb to pull the SystemUI.apk from your phone. It's located in /system/app.
Now that you have your SystemUI.apk, using 7zip, extract it.
Open up your extracted apk and navigate to the "res" folder. Copy the "drawable-hdpi" folder and the "raw" folder and move them to the working folder on your desktop, placing inside of the "res" subfolder you created earlier.
Begining with the "drawable-hdpi" folder, use your image editor to make any .png adjustments that you want incorporated into your theme, or replace the png files as you see fit. Be sure to maintain the nomenclature of the images if you opt to replace them. Beware of editing .9.png's as they cannot be edited in a conventional fashion. If you need help editing .9.png's there are several methods and guides around xda. Or ask in [Guide][Reference] An Intro to Themeing.
When you're finished with the drawable-hdpi folder move to the raw folder. This is where your battery icons are located, contrary to Sense and CM7 roms. You'll notice that there are not 200 little battery png's but 3 large png's with all of the images put together in a sort of battery collage. To assemble a battery collage, take your individual battery pngs and resize them to 38 X 38. For graphical and charge indicators, you will now need to create a new image sized at 152 X 190, copy and paste your individual png's into the large image so that you have 5 rows each with 4 png's. Follow the same procedure for making a % png, except that you'll be using 10 rows of 10 images, so your png size should be 380 X 380.
When you're done with all of your images, open up the theme_values.xml with notepad ++ and make any color edits that you see fit. Please note, that these color changes will have minimal impact on the look of your theme. Most of the color changes of your system will not happen here. These are default values for only a handfull of apps.
When you're finished editing the xml save it and close it.
Finally select your theme_values.xml and your "res" folder and right click your mouse, select 7zip, and add to archive. In the 7zip popup window name your file com.android.systemui (no additional extension here, make sure it does not say zip at the end....just: com.android.systemui)
After the folder is compressed and zipped, move it to your theme folder and zip your theme up as a .mtz as you have been doing right along. Apply theme to your phone and enjoy.
To Be Continued…..Next update will be for Framework-res or launcher depending on my upcoming amount of free time!!!
Additional Information: Tips, Tricks, & Links
Advanced Lockscreens - Tips and Tricks
Thanks il Duce for these links:
Lockscreen 2.0 Reference
General Miui Tips & Tricks
I wasn't born rich, I'm good lookin' instead!!
Great job Hockey!! Love how everything is coming together!
Added to the OP in the one stop shop also.
Edit: This is really thorough. Very nice indeed.....
Awesome work
Sent from my PG86100 using xda premium
Place holder for me
Is that all we do to the manifest because I really want that Evoluer slider to unlock my phone.
Temari x Shikamaru
scott951 said:
Place holder for me
Click to expand...
Click to collapse
Thank you sir, for providing us with a rom worthy of the time it takes to do all of this!......No disrespect intended to any of the other developers who's roms I also use, but I've fallen head over heels for Miui
knowledge561 said:
Is that all we do to the manifest because I really want that Evoluer slider to unlock my phone.
Temari x Shikamaru
Click to expand...
Click to collapse
Well, there's a lot you can do with the manifest xml, but to make them work properly yeah....It's just resizing the png's and shifting the x & y values accordingly for our screen size. I'm downloading the lockscreen you're trying to use now.
Thanks for this.
hockeyfamily737 said:
Well, there's a lot you can do with the manifest xml, but to make them work properly yeah....It's just resizing the png's and shifting the x & y values accordingly for our screen size. I'm downloading the lockscreen you're trying to use now.
Click to expand...
Click to collapse
Thanks because im Stumped!!!! If you manage to hook it up do you think you can throw in that green charging light? And when its not charging it turns blue when you touch it? Check out "ikun" to understand the lockscreen.
Temari x Shikamaru
vanessaem said:
Thanks for this.
Click to expand...
Click to collapse
My pleasure. Hopefully everyone including myself can learn from this, because I'm certainly no expert. Just a guy who like to take stuff apart to see how it works.
knowledge561 said:
Thanks because im Stumped!!!! If you manage to hook it up do you think you can throw in that green charging light? And when its not charging it turns blue when you touch it? Check out "ikun" to understand the lockscreen.
Temari x Shikamaru
Click to expand...
Click to collapse
I'll do what I can. First let's see if I can get it to work right Working lots of O/T right now so I haven't had a heap of time.
Thanks so much for this hockeyfamily737!
Sent from my PG86100 using Tapatalk
Thanks homie.
Temari x Shikamaru
Also I will possibly be able to help out on this as well if someone doesn't get it figured out by Sunday... been working alot of double shifts..
knowledge561 said:
Thanks because im Stumped!!!! If you manage to hook it up do you think you can throw in that green charging light? And when its not charging it turns blue when you touch it? Check out "ikun" to understand the lockscreen.
Temari x Shikamaru
Click to expand...
Click to collapse
Sent from my PG86100 using Tapatalk
Hey, nice introduction =)
If anyone is inerested in speeding up the process of testing your themes, I have created a Makefile/Windows Batch file for compressing themes and pushing them to the phone auto-magically
http://forums.miui.us/showthread.ph...ild-Script-(Windows-Unix)-Now-with-a-Makefile
Let me know if you guys have any problems!
Thank you for posting this amazing tutorial!
I am slowly fixing my lock screen, I'll post some before and after screen shots.
Before:
After:
thanks for this. i rlly needed it....
now to figure out more stuff...
steam374 said:
Thank you for posting this amazing tutorial!
I am slowly fixing my lock screen, I'll post some before and after screen shots.
Before:
After:
Click to expand...
Click to collapse
Terrific and this was the one I was trying to do today. Great job with this.
Brought to you from my EVOlutionary 3-Dimensional Smartphone
Wow! Great work... looking forward to more. Thanks hockeyfamily!
Sent from 3D A.W.E.S.O.M-O
Making a Bootanimation
Introduction
Hello xda,
I’m not really into Android development at the moment as I’m just not familiar with anything coding or related, but while my knowledge of Android may need to grow some more I can share things that I already master a bit more. After all, this forum is a place to share knowledge so I hope I can help some people while I am enjoying my stay here on the forums.
Since most of the forum users are here to get the limits out of our phone and probably want to customize it too, it’s most likely that you want to change your bootanimation at some point. Most custom ROM’s already have a customized bootanimation integrated and there are also quite some bootanimations available in the theming section, but what if you want to make your own customized animation?
I wrote this tutorial on how to create a bootanimation for the people who want to experiment with the making of bootanimations, as well as the people that are good at making animations already but don’t really know what to do next. I will try to explain the making of a basic animation using the tools a regular pc user can get or already has, and also get a little more in depth at some points for people who are not satisfied with only the basics. The goal of this tutorial is to get even the less experienced users on their way, not to make the best animation ever. Also, I wrote how I did it, and how I would suggest doing it, but there might be better ways to do certain things described. If you know how to do it easier and/or better, please feel free to leave feedback.
What you can expect in this tutorial:
• What software to use
• How to make a simple animation in MS Paint
• Make an image sequence
• Make the package ready to be installed on your phone
• Porting an already existing animation
Animation: What software to use?
Before we want to make our bootanimation we first want to plan out what software we are going to use. The first thing is of course the animation. Depending on what you’re after and your level of skill these are some of my recommendations:
{
"lightbox_close": "Close",
"lightbox_next": "Next",
"lightbox_previous": "Previous",
"lightbox_error": "The requested content cannot be loaded. Please try again later.",
"lightbox_start_slideshow": "Start slideshow",
"lightbox_stop_slideshow": "Stop slideshow",
"lightbox_full_screen": "Full screen",
"lightbox_thumbnails": "Thumbnails",
"lightbox_download": "Download",
"lightbox_share": "Share",
"lightbox_zoom": "Zoom",
"lightbox_new_window": "New window",
"lightbox_toggle_sidebar": "Toggle sidebar"
}
Microsoft Paint – The Gimp – Adobe Photoshop – Adobe Flash Professional – Adobe After Effects
Microsoft Paint
Maybe it surprises you, or maybe you just didn’t think of it, but MS Paint is actually a good tool to start making your animation. Anyone with the Windows operating system has it installed by default so this is the software I’m going to use for the animation in this tutorial.
The Gimp - http://www.gimp.org/
Already a bit more advanced than MS Paint and therefore a better option if you want to make a more complicated animation and can find your way through the options the software offers. Best option if you want to go advanced but don’t want to spend any cash.
Adobe Photoshop - http://www.adobe.com/products/photoshop.html
I can barely imagine someone who has never heard of this software before. This piece of software is pretty much the standard in the image editing world, and I highly recommend using this software if you can afford to buy it.
Adobe Flash - http://www.adobe.com/products/flash.html
This software maybe is the best software to use for this matter, its interface is designed for the making of animations and if you know how to use it (which I sadly don’t) I recommend it. But again, it doesn’t come for free.
Adobe After Effects - http://www.adobe.com/products/aftereffects.html
Even though this software is mostly used for compositing effects on videos it does an awesome job on the more complicated animations and motion graphics. That’s why I’m using this software myself when making bootanimations.
This is some of the software I would recommend using. Of course there are many more alternatives as well as more advanced software out there, 3D applications for example like Blender, Maya, Cinema4D and 3Ds Max could also be useful depending on the complexity of your project. Right now I’m just going to stick with MS Paint for the sake of this tutorial.
Post 1/4
How to make a simple animation in MS Paint
Note: The following step by step tutorial is based on a Dutch Windows system; certain menu entries might not be well translated and are shown in Dutch in the screenshots.
The Base
This is the part where the animating happens. Make your animation using the software that you own and are comfortable with. The goal is to make a sequence of images in the .png format which the phone can read and display while the phone boots thus displaying the animation. If you have never changed anything to your phone before, you see a nice little Samsung logo animation after the kernel has booted. You can find this animation in /system/media and it’s called bootani.qmg (Samsung QImage file made using Samsung theme software). This package is basically the same package we’re going to make ourselves but with a different extension. Now that you know roughly what we want to create we will move on.
We will start the process by launching Paint.
Code:
• Simply type ‘paint’ in the field on the start menu when you are on Windows 7 or Vista or access it from the ‘All Programs’ tab.
• When in Paint, look for the entry ‘Properties’ under ‘File’ in paint.
[IMG]http://dl.dropbox.com/u/56762733/Bootanimations/Tutorial/Screenshots/1.jpg[/IMG] [IMG]http://dl.dropbox.com/u/56762733/Bootanimations/Tutorial/Screenshots/2.jpg[/IMG]
• Set the image properties to 240 pixels in width and 400 pixels in height, this is the resolution of our Samsung Galaxy 3.
• First pick the paint bucket tool from the tool menu and fill the background with black.
• Next search for the Android logo on Google Images, find a .png file or [URL="http://dl.dropbox.com/u/56762733/Bootanimations/Tutorial/Assets/android_logo.png"]download mine[/URL], copy it and paste it in the paint window.
The reason that I’m looking for a PNG file is that it holds an alpha channel so that the background is transparent (Paint transforms it to black when pasted directly from the clipboard).
• Without de-selecting the just pasted image right click it and choose the option called something along the lines of ‘Scale’ or ‘Transform’
• Then set the horizontal and vertical value to 75 percent.
[IMG]http://dl.dropbox.com/u/56762733/Bootanimations/Tutorial/Screenshots/3.jpg[/IMG]
• Since the pasting messed up the image properties simply repeat the first step. Set the height and width value to 240 x 400.
[IMG]http://dl.dropbox.com/u/56762733/Bootanimations/Tutorial/Screenshots/4.jpg[/IMG]
• Now make a little progress bar in the middle of our Android logo which we are then going to animate.
• First choose the rectangular shape tool with rounded corners.
• Next change the line thickness to the thickest, the contour to solid color and the fill to none.
• Draw the shape on top of the logo.
[IMG]http://dl.dropbox.com/u/56762733/Bootanimations/Tutorial/Screenshots/5.jpg[/IMG]
Now the base of our animation is ready.
• Save it as a .bmp on your computer and name it ‘bootanimation_base.bmp’
The Animating
We are now going to prepare our folders for the animation. An Android bootanimation generally consists out of two parts:
• One that could be described as the intro. (part0)
• And one that is in a loop until the system boots up. (part1)
We find this ‘intro animation’ commonly placed in the ‘part0’ folder as a set of images. In the ‘part1’ folder we put the animation that we want to loop for the rest of the time.
You can hold on to this standard, but you can also make your own architecture. For the sake of this tutorial I will drop the ‘intro’ part and go straight to the looping animation. In this case we only need the part1 folder.
Code:
• Make a folder called ‘bootanimation’ like I did in the above screenshot.
• Inside the bootanimation folder create the ‘part1’ folder which will hold our animation. We don’t need the ‘part0’ folder in this tutorial as I mentioned above.
We are now ready to make our first frame.
• Select the brush tool, set the line to the thickest again and leave the color black.
• Then with the brush carefully draw a little on the right of the progress bar and with a little space in between the rest of the bar. This way you're making a little green bit in a black bar.
[IMG]http://dl.dropbox.com/u/56762733/Bootanimations/Tutorial/Screenshots/7.jpg[/IMG]
This is our first frame! We are going to repeat the next step a couple of times down the road so pay attention:
• Now choose ‘Save as’ from the file menu.
• Save you’re frame as a .png file in the ‘part1’ folder and name it ‘01.png’ Caution: Do not overwrite the bmp file by choosing ‘save’, choose ‘save as’ only!
You can probably see where this is going.
• Once you’ve saved your file open your ‘bootanimation_base.bmp’
• Draw a little more on the left and a little less on the right side shifting the green bit in comparison to 01.png.
[IMG]http://dl.dropbox.com/u/56762733/Bootanimations/Tutorial/Screenshots/8.jpg[/IMG]
• Now choose ‘Save as’ again from the file menu.
• Save you’re frame as a .png file in the ‘part1’ folder and name it ‘02.png’
• Repeat this process of editing the bmp and saving it as a PNG until the green bit is shifted all the way to the right, and you have a couple of frames in your ‘part1’ folder. [I]Caution: Do not overwrite the bmp file![/I]
• Once your frame looks like the following picture open the bmp one more time;
• Fill up the entire bar with black and save it as a png changing the number so it follows up the last png you saved.
[IMG]http://dl.dropbox.com/u/56762733/Bootanimations/Tutorial/Screenshots/09.png[/IMG] [IMG]http://dl.dropbox.com/u/56762733/Bootanimations/Tutorial/Screenshots/10.png[/IMG]
Your folder should look something like this:
[IMG]http://dl.dropbox.com/u/56762733/Bootanimations/Tutorial/Screenshots/11.jpg[/IMG]
And that’s going to be your animation!
Making a PNG Sequence in After Effects
Note: If you followed the MS Paint tutorial and if you don’t own After Effects in general you can skip this part.
While Adobe After Effects is mainly seen as a video effects and motion graphics compositor, it is not only capable of exporting video, but also image sequences! Say you have made your animation in After Effects, you can simply let After Effects export each frame as a .png file to your desired location.
If you’re making a typical bootanimation with intro:
• Set the workspace to the intro of the animation, in the screenshot the intro takes 3 seconds.
• Choose ‘Composition’, ‘Add to Render Queue’.
• Switch to the Render Queue
• Change the ‘Lossless’ settings to PNG Sequence and ‘Output to’ your ‘part0’ folder.
• Click ‘Render’
• For the ‘part1’, change your work area to the second part of the animation.
• Add it to the Render Queue and change the settings like you did for the first part.
• Output to the ‘part1’ folder and click ‘Render’
You now have the animation rendered out in a two part PNG sequence!
Post 2/4
Making the Bootanimation.zip
You’ve now probably made your animation, either in Paint following the tutorial, or in your own way.
Samsung stores their bootanimation as bootani.qmg as mentioned above. The file is actually an archive like a .zip, and that’s exactly what we are going to make. In order for our phone to display the animation we need to make a bootanimation.zip with inside it our ‘part1’ folder we just made. A desc.txt file on the same level as the ‘part’ folders tells the phone how to play the animation:
• It tells the phone in what resolution to play the animation, which in our case is 240 400
• The following number is the frame rate in which the .png sequence has to be displayed, in this example it’s 25 frames per second. The human eye experiences everything above 25 frames per second as a fluid movement, so this is your minimum frame rate if this is the effect you’re after. Anything below 25 frames per second appears choppy to the eye (which could also be an effect you purposely want to achieve). I recommend 25 frames per second for fluid animations as more frames per second could cause our phone to display the animation incorrect, because it gets too much images to process at once.
• The next two lines are the folders that are used in the animation with the number of loops and the delay between the animations in front of it. The first folder loops 1 time and doesn’t delay, the second loops 0 (=infinite) times and doesn’t have a delay either.
We have to transform all the above pieces into a bootanimation.zip. While we could do that manually I recommend using the Boot Animation Creator made by despotovski01. Download the software from the thread and install it on your computer.
• Open the program and follow the wizard.
• Select the ‘bootanimation’ folder with your ‘part1’ folder inside and proceed to step 2 of the wizard.
• Now in this window, choose ‘edit’ while holding the first line selected and make it 240 in width and 400 in height.
• Since our ‘tutorial animation’ is only 8 frames long I don’t want to go for the fluid animation, but rather the choppier one. In this case I’m making the animation go 10 FPS (Frames Per Second).
• When you’re ready, click ‘set’
• To actually assign the folder with images to the animation choose ‘Add a loop’
• Choose the folder from the dropdown menu (which shouldn’t be hard, because there’s only one option)
• Set the number of loops to 0, which makes it loop infinite, and leave the delay on 0. Press ‘Add’
• Click next, on the next screen press ‘Save’ and save the bootanimation as ‘bootanimation.zip’ somewhere to your computer.
• Now the bootanimation.zip is ready to be installed on your phone!
Make the package ready to be installed on your phone
If you’re going to use the bootanimation (or any future bootanimations you’ll make) for your personal use only, you can use an application like Root explorer to simply paste the bootanimation.zip in your /system/media folder. If you’re going to share the bootanimations like on the forums for example it could also be convenient to make an update.zip. An update.zip is a package with a couple of scripts and some files inside which can be flashed through Clock Work Mod Recovery and is used to get files in the internal memory of the phone, like in /system/media. CWM Recovery is integrated in most custom kernels and can be accessed by pressing both of the volume buttons and the menu button while turning on the phone.
To make an update.zip you can simply download this .zip archive open it with a decent archiver, preferably WinRAR or 7Zip and navigate to /system/media. You’ll see a bootanimation.zip placeholder inside, which you can then (without extracting the archive) replace with your own bootanimation.zip! The archive you now have is ready to be placed on your SD-card and flashed through CMW Recovery. You can rename the update.zip to whatever you want.
Making a simple GIF Animation preview
Now that you’ve made your bootanimation, you’ll probably want to present it to the forums. While posting a couple frames of the animation will give an idea to users what animation they’re going to get, it is also very useful to make an animated preview of said thing. A quick google on ‘GIF maker’ will give you several options of online GIF makers that just let you select the PNG’s you just made and make them into a neat little GIF animation. While this is a fine method I would recommend everyone who owns Adobe Photoshop to do it this way:
• Open Photoshop
• Double click the workspace to ‘open’, or select ‘File’ and click ‘open’
• Navigate to the folder you stored your PNG’s in and select the first frame of your animation.
• Now check the box with ‘Sequence’ behind it and click ‘open’
• Select the frames per second you want the animation to play in. Generally you want to go with 25, but I’m going with 10 as I explained above.
• Now click ‘File’, ‘Save for Web & Devices’ or press ‘Alt+Ctrl+Shift+S’
• In the window that popped up, select GIF from the dropdown menu, change the ‘Looping options’ to ‘Forever’ and hit save.
• Upload your GIF to the public section of Dropbox, to Photobucket or any other online storage service to insert the image in a post!
Post 3/4
How to port an existing bootanimation
There’s a large amount of bootanimations available on the web, but you’ll soon discover that unless their specifically made for our phones the resolution will be to big almost all the time. That means that if you want to use or share the animation you have to port it first in order to make it work on phones with a smaller resolution. Since full fluid animations of 25 FPS are over 100 frames long most of the time it would be a real pain in the neck to scale them all down one by one. I will talk about two ways to port an animation to a smaller resolution.
The easy way
The simplest way of porting an animation would be to just adjust the resolution values in the desc.txt provided in the bootanimation.zip. While this will probably work, it’s not the most accurate way of porting an animation. Since our phone is not the fastest one it is not only the resolution which might make a bootanimation unplayable, but it could also be a pretty hard task for our lower-end device to load such big images in an animation while booting.
The advanced and more accurate way
Editing every image individually would be a really hard task, but would result in a much more accurate and potentially better port. That’s why it is my recommendation to do it anyway, but that’s where Adobe Photoshop comes in! Adobe has made wonderful batch system that lets you process huge amounts of images with a click of the mouse. This is how that works:
• Download the ‘to be ported’ bootanimation.zip and extract it.
• Open Photoshop
• Click ‘Window’ and check ‘Actions’ if it isn’t checked already
• Click the ‘New’ icon at the bottom of the Actions panel and call the action ‘Scale down bootanimation’ in the window that pops up.
• Click record.
• Open a random frame from the animation.
• Now select ‘Image’, ‘Image Size’ or press ‘Alt+Ctrl+I’
• In the window that comes up change the width and height values to 240 x 400 pixels and click ‘OK’
• Next click ‘File’, ‘Save as’ or press ‘Ctrl+Shift+S’
• Save the image as a .png and be sure not to overwrite something as this is just the preparing of the actual resizing of hundreds of images. (It doesn’t matter where you save it, to Photoshop it only matters if you save it. The ‘save as’ settings are going to be overridden as you’ll see later)
• Once you’ve saved the file, close the image.
• Now click the rectangular ‘stop’ button at the bottom of the Actions panel and you’ve recorded the action!
• Delete the just saved image from your computer as we don’t need it anymore and it could mess up the batch process.
Your action should now look something like this:
In the next part we’re going to do the actual resizing:
• Click ‘File’, ‘Automate, ‘Batch’
• The ‘Batch’ window should pop up.
• Select ‘Scale down bootanimation’ as action from the dropdown menu.
• Choose the source to be a folder and then choose the folder with images to be resized.
• Be sure to check ‘Override Action “Open” Commands.
• Choose the destination to be a folder as well and choose a new folder to store the resized images.
• Be sure to check ‘Overide Action “Save As” Commands’ as well
• For the File Naming select the ‘4 Digit Serial Number’ + ‘Extension’ as shown in the screenshot below.
• When everything is set up like in the screenshot, hit ‘OK’ and watch the magic happen!
• Once the operation is completed your downscaled PNG’s will be waiting for you in the folder you selected.
• You can use this ‘action’ now every time you need to resize an animation to this resolution.
While some of you may want to use this method but don’t have Photoshop, I’ve found out about a simple plugin for The Gimp to do pre-scripted batch operations on lots of images just like Photoshop. It’s called David’s Batch Processor and you can install it from here: http://members.ozemail.com.au/~hodsond/dbp.html
Requesting a bootanimation
We are approaching the end of the tutorial; I hope you found it useful. There’s one thing I want to mention though. Even though I’ve tried to explain the most things about bootanimations it’s most likely that you didn’t become the best artist of all time because of this. If you want to have your own custom bootanimation, or want to port an existing one and don’t feel like you can do it yourself, feel free to PM me or leave a reply here, because I’m having fun making/tweaking/porting bootanimations and that way I’m also contributing a little to this forum.
The End
Thanks for taking the time to read this (or a part of this) tutorial and I really hope it helped some people. This is my first tutorial, so don’t hold back to tell me how to improve it (or change any grammatical issues). If you still have questions you can leave a reply or PM me.
Credits go to:
This great community and its developers
Nishant_713 who helped me out the first time I made a bootanimation.
Ava.tar for feedback and his bootanimation work
Despotovski01 for his cool little bootanimation.zip maker
Samsung for the Galaxy 3
Adobe for their Creative Suite and 80% discount on CS4 for students.
Useful links:
http://forum.xda-developers.com/showthread.php?t=1234611 Bootanimation maker by despotovski01
http://forum.xda-developers.com/showthread.php?t=1602879 Bootanimations for Galaxy 3 Index by Ava.tar
Let me know if any more links should come in this list.
Post 4/4
Copyright april 2012 © All right reserved Wiggierip
Good Work!
BTW You should have posted this in the "Android Themes Section" so that everyone else can see it and there were some questions about bootanimation posted there.
Good Luck!
Thank you for this comprehensive guide. Its awesome!
Cheers
Sent from my GT-i9003 powered by Stable and Smooth CleanKpu rom
ak700 said:
Good Work!
BTW You should have posted this in the "Android Themes Section" so that everyone else can see it and there were some questions about bootanimation posted there.
Good Luck!
Click to expand...
Click to collapse
Thanks , yeah I didn't really know where to start it... Most of it is specifically written for our phone. Like the way the bootanimation is stored and the resolution for example.
Brilliant work! I'll post a link to your thread in the bootanimation index. You deserve many thanks!
wow! finally a tutorial that I can understand
Awesome tutorial! Thank you!
Good research and great work
Oh finall an in-depth tutorial.......i had already made my bootanimation and dint have any idea what to do next....lol....
Thanks for the tut!!
This is really one of the most detailed but still very comprehensive Tutorial about bootanimations I've seen yet! Big probs for that!
There is an aspect in editing bootanimations and I've been thinking about it for months, but still don't have a solution:
What I want to do is editing a bios-bootanimation to fit perfectly to my device and ROM.
This is an example how a bios animation looks like (not the one I would use as base):
Android Bios Bootanimation[/CENTER]
Preview
I only have to change a few parts within the parts to make it fit to my configuration.
Is that possible in a relative fast way? Something like appending changes to several pictures in a batch operation or anything like that? That would be enough for me. But I didn't find any tool I could use that way.
Hope you can help me out!
t-rip said:
This is really one of the most detailed but still very comprehensive Tutorial about bootanimations I've seen yet! Big probs for that!
There is an aspect in editing bootanimations and I've been thinking about it for months, but still don't have a solution:
What I want to do is editing a bios-bootanimation to fit perfectly to my device and ROM.
This is an example how a bios animation looks like (not the one I would use as base)
I only have to change a few parts within the parts to make it fit to my configuration.
Is that possible in a relative fast way? Something like appending changes to several pictures in a batch operation or anything like that? That would be enough for me. But I didn't find any tool I could use that way.
Hope you can help me out!
Click to expand...
Click to collapse
Well, batch operations can be recorded in Photoshop and then applied pretty easiy like I wrote in the tutorial, the Gimp has this plugin called "David's Batch Processor" that I found after some research:
http://members.ozemail.com.au/~hodsond/dbp.html
It does some basic batch operations as well. If this will help you out is highly depending on what effect you want to achieve. If you actually want to change the animation it's going to be A LOT harder... Let me know if you found this useful
Any requests for a bootanimation to be ported or to be made?
Please let me know, I have fun porting/making them
as the adobe after effects require a 64 bit windows os., am having 32 bit os...can i able to use it for creating my own boot animation
austin266 said:
as the adobe after effects require a 64 bit windows os., am having 32 bit os...can i able to use it for creating my own boot animation
Click to expand...
Click to collapse
Well.. I used and still use After Effects CS4, both on a 32bit and now on a 64bit system. Unfortunately After Effect stopped supporting 32bit systems since CS5 came out, so unless you can get your hands on After Effects CS4 you're not going to be able to run it on a 32bit system . If you're really planning on getting AE I would recommend getting a 64bit Winodws copy. What are your system specifications?
@wiggerip if you are bored, maybe port the cm9 official boot animation to g3. It looks really great
Cheers
Sent from my GT-i9003 powered by Stable and Smooth CyanogenMod 9!
bscraze said:
@wiggerip if you are bored, maybe port the cm9 official boot animation to g3. It looks really great
Cheers
Sent from my GT-i9003 powered by Stable and Smooth CyanogenMod 9!
Click to expand...
Click to collapse
I believe thats already done by SerkSerk: http://forum.xda-developers.com/showthread.php?t=1513419&highlight=bootanimation
Anything else ?
@wiggerip
hi mate
thanks for the reply
my system requrements
2gb ram
ububtu 11.10 32 bit 0s
2.00 ghz dual core processor
5yrs old laptop
270 rom
Coming from a Samsung S7 edge to a V30 the biggest (and probably only) down fall is the severe lack of themes for the LG UI. Most themes on LG theme store seem to mostly just be wallpaper and icon changes. A lot of them do not actually change the colors of the Settings, quick toggles, and other LG apps.
The themes that are available it seems like half the time I am looking for a specific type of theme it does not exist anywhere. So it has gotten me interested in creating themes to help expand the available themes for this amazing phone.
However I can not seem to find how to create themes. I didn't see it on the LG world app, and I didn't see it on the LG website developers area, and I didn't see it with a Google search. Can someone point me in the right direction? I am not sure if it requires any Java coding or any other type of coding langauge. However I am.willing to learn whats needed to get some themes created. I just need to know the place and processor to create them.
Anyway to change the Emojis?
AndroidPurity said:
However I can not seem to find how to create themes. I didn't see it on the LG world app, and I didn't see it on the LG website developers area, and I didn't see it with a Google search. Can someone point me in the right direction? I am not sure if it requires any Java coding or any other type of coding langauge. However I am.willing to learn whats needed to get some themes created. I just need to know the place and processor to create them.
Click to expand...
Click to collapse
I havent tried it myself, but maybe LG ThemePark is the program to make them?
Oreo on v30 will allow substratum. We can only hope
epoch555 said:
I havent tried it myself, but maybe LG ThemePark is the program to make them?
Click to expand...
Click to collapse
iv tried using it but it hasn't been updated in some time plus you have to download an English translation patch as it in Korean.
I think it's pretty ridiculous no one who actually knows the answer to this has posted an answer to this after several weeks. It leads me to believe some people who know the answer have seen this thread and just don't want others to know? Prove me wrong and some one who knows please provide what is being used to create these themes for LG.
AndroidPurity said:
I think it's pretty ridiculous no one who actually knows the answer to this has posted an answer to this after several weeks. It leads me to believe some people who know the answer have seen this thread and just don't want others to know? Prove me wrong and some one who knows please provide what is being used to create these themes for LG.
Click to expand...
Click to collapse
Reminds me of the old them creator for BlackBerry. Plazmic. A few knew kinda how to use it and wouldn't tell anybody. Little to say, a team of 2 figured it out and started releasing tons of high quality free themes. ?
You may have already seen this, but here is a little bit of info
https://forum.xda-developers.com/showpost.php?p=74597574&postcount=45
Try this.
https://forum.xda-developers.com/showthread.php?t=2425402
I know this question was asked awhile ago, but I faced a similar issue with my LG Stylo 3 and want to report my findings. First off, Theme Park is available as a web application on LG's SmartWorld developer page http://us.lgworld.com/web.main.dev. However, I think you'll find its customizability to be severely disappointing. In fact, themes created using this are not even compatible with newer LG phones. The schema used for newer models is Home Theme+ (this is what my Stylo uses, and I assume it is what the V30 uses as well). I have scoured LG's dev site and could not find a straightforward way to develop Home Theme+, but it is possible and not super hard, albeit it can be time consuming. It will definitely help if you have some experience with Android app development (my personal experience is limited), however, no programming is necessary. You really only need to know how to edit XML/JSON files, and how to compile/decompile an Android app (there is a fantastic tool for this called apktool, created by Ryszard Wiśniewski and Connor Tumbleson which I will link to).
Tools Needed:
Apktool https://ibotpeaches.github.io/Apktool/
Apksigner (part of the Android SDK build tools) https://developer.android.com/studio/command-line/apksigner.html
Efficient way to create/edit XML and PNG files
Alternatively you could use Android Studio, which honestly might simplify the process.
I have provided a template for creating Home Theme+ themes here. This is just the preinstalled LG High Constrast theme which provides a great outline of what a theme should consist of. Use apktool to easily decompile it.
After spending hours of tweaking I was able to retheme the High Contrast app and brand it as my own. It honestly isn't too complicated, however, there is a LOT of settings, so it'll be up to you to figure out the specifics of what you need to edit in order to create your theme. Here is the general layout of what a Home Theme+ theme must consist of:
Inside the root directory there are 4 items:
assets (This is where the meat of your theme will go)
lib (Contains a dummy file. You can safely exclude this from your application.)
res (Contains basic drawables, preview images, and your application's title.)
AndroidManifest.xml (Important information about your application)
AndroidManifest
I'll start from the bottom up. If you're following a template, there are only a few things you'll need to change in the AndroidManifest. Find the <manifest> tag and edit the "package" attribute to your desired package name. It should be something like "com.your_company.theme.name_of_theme", where "your_company" and "name_of_theme" can be whatever you like. You'll also want to edit the <meta-data> "android:value" and <activity> "android:name" attributes to reflect this (Optionally, you can just set the <activity> "android:name" attribute to ".MainActivity"). Save and close this file, but be sure to remember the package name because you'll need to use it later.
res
Inside this folder are three others:
drawable-xhdpi-v4 - Contains PNG images of the Theme's preview (you can add additional preview images if you want) and the home and lockscreen wallpapers you would like to set. Follow the same naming conventions as listed in the template.
values - Two files: public.xml Lists everything in the res folder that the compiler should expect. If you add/remove preview images or wallpapers, you'll want to account for them in here. The "id" attribute for each tag can be an arbitrary value as long as it is unique. Go ahead an open this up and delete the tags named "app_info" and "app_tag". You won't need them. strings.xml contains your theme's name (this is how it will be displayed in the theme picker).
xml - Contains additional meta-data. Delete it. You won't need it.
assets
Here's where the fun begins. There are a few things in here, however, I will only go over what's in the overlays. Custom fonts and sound effects are completely optional, but feel free to mess around with those if you desire. The theme_info.json file is essentially a list of which applications you want to apply the theme to. Go ahead and open it and delete the "id" key/value pair. Now open the overlays folder. Inside here are a bunch of APK files. This modular setup makes it easy to pick and choose where you want to apply the theme. I'm not going to go over all of them, as their names are pretty self explanatory, but go ahead and decompile the one ending with ".common.apk". This package contains the theming for much of your general UI (such as status bar, navigation bar, text color, etc). Inside, you'll see a similar file structure as before, including an AndroidManifest and a res folder. Note: the smali folder is completely optional, and if you don't know what smali is you can safely ignore/delete this folder. First item of business is editing the AndroidManifest so that it matches your previously defined package name. You'll also want to add this tag somewhere inside it: "<uses-permission android:name="com.lge.permission.LGE_OVERLAY_THEME_APK"/>". This grants proper permission to modify system app themes. Now pop a look into the res folder. Its contents should look familiar. The multiple "xhdpi" folders all contain the same stuff, but target different resolutions. You can read more about them here. Basically the drawable-xxhdpi folders contain PNGs of various system wide UI elements (or app specific in the case of any of the other overlays). The values folder without an appended "hdpi" contains a public.xml, which functions exactly the same as previously mentioned. And the values-xxhdpi folders contain various settings for a specific resolution. I'll leave it up to you to play with them.
That's the basics of it! After recompiling an overlay APK, be sure to sign it or your theme will crash upon applying it (also be sure to sign your actual theme app with the same key). Read about the apksigner I linked to above for more info (I think Android Studio has an automatic way to sign apps with a key for debugging). Also be sure to update the theme_info.json file to list the package names of all the overlays you wish to apply.
Hopefully this helps someone. Let me know if you run into any trouble building or installing your APKs. As for what various settings do, you'll have to figure that part out on your own.
Happy theming!
AndroidPurity said:
Coming from a Samsung S7 edge to a V30 the biggest (and probably only) down fall is the severe lack of themes for the LG UI. Most themes on LG theme store seem to mostly just be wallpaper and icon changes. A lot of them do not actually change the colors of the Settings, quick toggles, and other LG apps.
The themes that are available it seems like half the time I am looking for a specific type of theme it does not exist anywhere. So it has gotten me interested in creating themes to help expand the available themes for this amazing phone.
However I can not seem to find how to create themes. I didn't see it on the LG world app, and I didn't see it on the LG website developers area, and I didn't see it with a Google search. Can someone point me in the right direction? I am not sure if it requires any Java coding or any other type of coding langauge. However I am.willing to learn whats needed to get some themes created. I just need to know the place and processor to create them.
Click to expand...
Click to collapse
hi, I'm also willing to go from s7 to v30. and also I am worried about the absence of really beautiful themes.
have you solved it in any way? thank you
axorazor said:
hi, I'm also willing to go from s7 to v30. and also I am worried about the absence of really beautiful themes.
have you solved it in any way? thank you
Click to expand...
Click to collapse
When I wrote that post multiple months ago it was more of an issue than it is now. Back then a lot of themes on the LG theme store only changed the home screen wall paper and the pre-installed app icons.
However now most of their themes also changed the accent colors of the the pull down shade of toggles and notifications, and also redesigned the settings page, and the LG app accent colors. So they are full theme over hauls in most of them. However there seems to probably only be about 40-80 of them on the LG theme store. So a good bit but really still not many.
Although some developers have created themes for the LG V30 and G6 and uploaded them to the play store to download for around $0.99 to $1.49 per theme. Most of those themes a re really nice and a lot more different types of themes. However there is probably only about 100 to 150 themes on the play store.
So over all between play store and LG store, there probably over 200 different themes now. So there's a decent selection. Still no where near Samsung and HTC theme stores, but decent enough where you can change it up once a week. Now that LG made a really good phone for first time in years that a lot of people like once they see or hear about it (the V30), the themes are slowly growing. I imagine in 1-2 years they will have several hundred themes or maybe even over a thousand once more and more people adopt the V30 and the new upcoming LG flagship phone.
If you really like every thing else about the phone, don't let the themes hold you back because it's now finally got enough themes to be decent thanks to a few developers on the play store making a lot of LG themes.
AndroidPurity said:
When I wrote that post multiple months ago it was more of an issue than it is now. Back then a lot of themes on the LG theme store only changed the home screen wall paper and the pre-installed app icons.
However now most of their themes also changed the accent colors of the the pull down shade of toggles and notifications, and also redesigned the settings page, and the LG app accent colors. So they are full theme over hauls in most of them. However there seems to probably only be about 40-80 of them on the LG theme store. So a good bit but really still not many.
Although some developers have created themes for the LG V30 and G6 and uploaded them to the play store to download for around $0.99 to $1.49 per theme. Most of those themes a re really nice and a lot more different types of themes. However there is probably only about 100 to 150 themes on the play store.
So over all between play store and LG store, there probably over 200 different themes now. So there's a decent selection. Still no where near Samsung and HTC theme stores, but decent enough where you can change it up once a week. Now that LG made a really good phone for first time in years that a lot of people like once they see or hear about it (the V30), the themes are slowly growing. I imagine in 1-2 years they will have several hundred themes or maybe even over a thousand once more and more people adopt the V30 and the new upcoming LG flagship phone.
If you really like every thing else about the phone, don't let the themes hold you back because it's now finally got enough themes to be decent thanks to a few developers on the play store making a lot of LG themes.
Click to expand...
Click to collapse
Good comments.
I only wish there was a theme to let me change the status bar icons. I'm doing it in Gravity Box on my rooted V30, but that's overkill. And I can't do it on my non-rooted LG V30+.
The two things -- OK, three -- that annoy me the most are the:
1) Really stupid 4G/miniscule LTE icon -- where you can't even see the LTE part.
View attachment 4366626
{
"lightbox_close": "Close",
"lightbox_next": "Next",
"lightbox_previous": "Previous",
"lightbox_error": "The requested content cannot be loaded. Please try again later.",
"lightbox_start_slideshow": "Start slideshow",
"lightbox_stop_slideshow": "Stop slideshow",
"lightbox_full_screen": "Full screen",
"lightbox_thumbnails": "Thumbnails",
"lightbox_download": "Download",
"lightbox_share": "Share",
"lightbox_zoom": "Zoom",
"lightbox_new_window": "New window",
"lightbox_toggle_sidebar": "Toggle sidebar"
}
On LTE it has that 4G symbol above, with a LTE hanging off the side in miniscule lettering. On HSPA, is the exact same symbol without the LTE.
To me it both says "4G" unless I look VERY carefully.
This is much better:
2) the battery icon.
I prefer the circle with percentage inside when not charging, and circle with percentage outside when charging.
3) I also would like the both the Wi-Fi and carrier signal to have clearly differentiated bars.
Like this, on my Moto XT1225:
That looks better than this (LG stock), where yes the carrier signal has clearly delineated bars, but the Wi-Fi signal is just a lumped mass. That's not design consistency.
____________
I mentioned the status bar icons issue to @markbencze -- who has thread for theme support in this forum -- and he said LG won't let themers touch the status bar icons, at least with Nougat. Perhaps Oreo will bring changes?
markbencze said:
No need to be sorry my man. So lg doesn't allow us to touch the statusbar icons at all. Now Nick, syko and I were discussing that when Oreo drops that unless LG specifically and intentionally breaks things that in theory substratum should work for us like how it does for Samsung. So if and when that happens we might be able to address those things. I hope it works for us. But yeah sadly I can't help with what you asked.
Click to expand...
Click to collapse
ChazzMatt said:
Good comments.
I only wish there was a theme to let me change the status bar icons. I'm doing it in Gravity Box on my rooted V30, but that's overkill. And I can't do it on my non-rooted LG V30+.
The two things that annoy me the most are the:
* Really stupid 4G/miniscule LTE icon -- where you can't even see the LTE part.
On LTE it has that 4G symbol above, with a LTE hanging off the side in miniscule lettering. On HSPA, is the exact same symbol without the LTE.
To me it both says "4G" unless I look VERY carefully.
* and the battery icon.
I prefer the circle with percentage inside when not charging, and circle with percentage outside when charging.
I mentioned the issue to @markbencze -- who has thread for theme support in this forum -- and he said LG won't let themers touch the status bar icons, at least for now. Perhaps Oreo will bring changes?
Click to expand...
Click to collapse
Thanks!
I agree with a couple points you made. The customization I would like added by LG is the following...
1.) Yeah I agree with you about the battery icon thing definitely. Having both battery icon and battery percent is just over kill. Wish we could modify that in settings or theme. Circle with percentage would be very nice.
2.) It would be cool if nav button design could be changes too like I believe HTC themes can. (I am hoping the new U12 is like a bit smaller version of U11 Plus, if so... then it's probably the only Q1-Q2 2018 phone that may make me consider switching from this phone. Otherwise probably wait for V40. But I am really pulling for HTC I don't want them to die, they're too good to die.)
3.) I asked also asked @markbenzce something before, but about being able to have the icons in the settings beside each option to be unique design with different colors and designs. Just like app icons are basically. He said LG themes don't have that functionality yet either. I would like that. Can't remember if Samsung or HTC themes have that ability or not.
4.) Then of course much more theme options. If we can get into the thousands like Samsung and HTC it will make LH phones even better.
The growth in LG themes over the past 5 months has been encouraging though! I think it will only accelerate.
Hello,?
One question, with theme is it possible to change a nav bar icons?
Hi,
I modified the LG High Contrast template by following Nihilian's instructions and successfully installed the apk on my device but I got this message upon applying the theme: "This theme no longer works on this device".
I attached the AndroidManifest file of the theme app and of one of the packages. Could someone please take a look and tell me if I did something wrong? (Edit: file removed, see UPDATE)
Many thanks and regards.
P.S.
I signed all apk's with this tool but that shouldn't be the culprit because I verified with the jarsigner tool afterwards. Also, I checked and the signer uses the same key for all apk's.
UPDATE
I tried again by modifying another LG theme and it somehow worked, even though I followed the same steps...
Maybe I made a typo in the other one or maybe it was something else but who cares, the issue is SOLVED!
English patch
cryhavok13 said:
iv tried using it but it hasn't been updated in some time plus you have to download an English translation patch as it in Korean.
Click to expand...
Click to collapse
The English patch is easy to install just copy and paste to directory. My problem is where does the export apk file go when your finished with the theme if you don't want to install using USB say I'm making the theme for a friend with LG after I compile the apk with LG themepark its no where to be found ;(
---------- Post added at 12:28 AM ---------- Previous post was at 12:24 AM ----------
cryhavok13 said:
iv tried using it but it hasn't been updated in some time plus you have to download an English translation patch as it in Korean.
Click to expand...
Click to collapse
AndroidPurity said:
I think it's pretty ridiculous no one who actually knows the answer to this has posted an answer to this after several weeks. It leads me to believe some people who know the answer have seen this thread and just don't want others to know? Prove me wrong and some one who knows please provide what is being used to create these themes for LG.
Click to expand...
Click to collapse
I been looking and trying to find same answer since the LG v20 came out. I know there is a way to create themes I even tried apk tool to decompile LG v20 themes and I get an error. But when I decompile other themes that are apk not for LG it works no error. I think the people who know don't want to share because they are making money selling the themes. Hey I don't want to sell themes I just want to make my own for my lgv20 wish someone could point us in rite direction I don't think theme park will work for newer LG phones ;(
---------- Post added at 12:37 AM ---------- Previous post was at 12:28 AM ----------
Nihilian said:
I know this question was asked awhile ago, but I faced a similar issue with my LG Stylo 3 and want to report my findings. First off, Theme Park is available as a web application on LG's SmartWorld developer page http://us.lgworld.com/web.main.dev. However, I think you'll find its customizability to be severely disappointing. In fact, themes created using this are not even compatible with newer LG phones. The schema used for newer models is Home Theme+ (this is what my Stylo uses, and I assume it is what the V30 uses as well). I have scoured LG's dev site and could not find a straightforward way to develop Home Theme+, but it is possible and not super hard, albeit it can be time consuming. It will definitely help if you have some experience with Android app development (my personal experience is limited), however, no programming is necessary. You really only need to know how to edit XML/JSON files, and how to compile/decompile an Android app (there is a fantastic tool for this called apktool, created by Ryszard Wiśniewski and Connor Tumbleson which I will link to).
Tools Needed:
Apktool https://ibotpeaches.github.io/Apktool/
Apksigner (part of the Android SDK build tools) https://developer.android.com/studio/command-line/apksigner.html
Efficient way to create/edit XML and PNG files
Alternatively you could use Android Studio, which honestly might simplify the process.
I have provided a template for creating Home Theme+ themes here. This is just the preinstalled LG High Constrast theme which provides a great outline of what a theme should consist of. Use apktool to easily decompile it.
After spending hours of tweaking I was able to retheme the High Contrast app and brand it as my own. It honestly isn't too complicated, however, there is a LOT of settings, so it'll be up to you to figure out the specifics of what you need to edit in order to create your theme. Here is the general layout of what a Home Theme+ theme must consist of:
Inside the root directory there are 4 items:
assets (This is where the meat of your theme will go)
lib (Contains a dummy file. You can safely exclude this from your application.)
res (Contains basic drawables, preview images, and your application's title.)
AndroidManifest.xml (Important information about your application)
AndroidManifest
I'll start from the bottom up. If you're following a template, there are only a few things you'll need to change in the AndroidManifest. Find the <manifest> tag and edit the "package" attribute to your desired package name. It should be something like "com.your_company.theme.name_of_theme", where "your_company" and "name_of_theme" can be whatever you like. You'll also want to edit the <meta-data> "android:value" and <activity> "android:name" attributes to reflect this (Optionally, you can just set the <activity> "android:name" attribute to ".MainActivity"). Save and close this file, but be sure to remember the package name because you'll need to use it later.
res
Inside this folder are three others:
drawable-xhdpi-v4 - Contains PNG images of the Theme's preview (you can add additional preview images if you want) and the home and lockscreen wallpapers you would like to set. Follow the same naming conventions as listed in the template.
values - Two files: public.xml Lists everything in the res folder that the compiler should expect. If you add/remove preview images or wallpapers, you'll want to account for them in here. The "id" attribute for each tag can be an arbitrary value as long as it is unique. Go ahead an open this up and delete the tags named "app_info" and "app_tag". You won't need them. strings.xml contains your theme's name (this is how it will be displayed in the theme picker).
xml - Contains additional meta-data. Delete it. You won't need it.
assets
Here's where the fun begins. There are a few things in here, however, I will only go over what's in the overlays. Custom fonts and sound effects are completely optional, but feel free to mess around with those if you desire. The theme_info.json file is essentially a list of which applications you want to apply the theme to. Go ahead and open it and delete the "id" key/value pair. Now open the overlays folder. Inside here are a bunch of APK files. This modular setup makes it easy to pick and choose where you want to apply the theme. I'm not going to go over all of them, as their names are pretty self explanatory, but go ahead and decompile the one ending with ".common.apk". This package contains the theming for much of your general UI (such as status bar, navigation bar, text color, etc). Inside, you'll see a similar file structure as before, including an AndroidManifest and a res folder. Note: the smali folder is completely optional, and if you don't know what smali is you can safely ignore/delete this folder. First item of business is editing the AndroidManifest so that it matches your previously defined package name. You'll also want to add this tag somewhere inside it: "<uses-permission android:name="com.lge.permission.LGE_OVERLAY_THEME_APK"/>". This grants proper permission to modify system app themes. Now pop a look into the res folder. Its contents should look familiar. The multiple "xhdpi" folders all contain the same stuff, but target different resolutions. You can read more about them here. Basically the drawable-xxhdpi folders contain PNGs of various system wide UI elements (or app specific in the case of any of the other overlays). The values folder without an appended "hdpi" contains a public.xml, which functions exactly the same as previously mentioned. And the values-xxhdpi folders contain various settings for a specific resolution. I'll leave it up to you to play with them.
That's the basics of it! After recompiling an overlay APK, be sure to sign it or your theme will crash upon applying it (also be sure to sign your actual theme app with the same key). Read about the apksigner I linked to above for more info (I think Android Studio has an automatic way to sign apps with a key for debugging). Also be sure to update the theme_info.json file to list the package names of all the overlays you wish to apply.
Hopefully this helps someone. Let me know if you run into any trouble building or installing your APKs. As for what various settings do, you'll have to figure that part out on your own.
Happy theming!
Click to expand...
Click to collapse
Thanks so much I been trying to figure this out for year already!
Resell
Nihilian said:
I know this question was asked awhile ago, but I faced a similar issue with my LG Stylo 3 and want to report my findings. First off, Theme Park is available as a web application on LG's SmartWorld developer page http://us.lgworld.com/web.main.dev. However, I think you'll find its customizability to be severely disappointing. In fact, themes created using this are not even compatible with newer LG phones. The schema used for newer models is Home Theme+ (this is what my Stylo uses, and I assume it is what the V30 uses as well). I have scoured LG's dev site and could not find a straightforward way to develop Home Theme+, but it is possible and not super hard, albeit it can be time consuming. It will definitely help if you have some experience with Android app development (my personal experience is limited), however, no programming is necessary. You really only need to know how to edit XML/JSON files, and how to compile/decompile an Android app (there is a fantastic tool for this called apktool, created by Ryszard Wiśniewski and Connor Tumbleson which I will link to).
Tools Needed:
Apktool https://ibotpeaches.github.io/Apktool/
Apksigner (part of the Android SDK build tools) https://developer.android.com/studio/command-line/apksigner.html
Efficient way to create/edit XML and PNG files
Alternatively you could use Android Studio, which honestly might simplify the process.
I have provided a template for creating Home Theme+ themes here. This is just the preinstalled LG High Constrast theme which provides a great outline of what a theme should consist of. Use apktool to easily decompile it.
After spending hours of tweaking I was able to retheme the High Contrast app and brand it as my own. It honestly isn't too complicated, however, there is a LOT of settings, so it'll be up to you to figure out the specifics of what you need to edit in order to create your theme. Here is the general layout of what a Home Theme+ theme must consist of:
Inside the root directory there are 4 items:
assets (This is where the meat of your theme will go)
lib (Contains a dummy file. You can safely exclude this from your application.)
res (Contains basic drawables, preview images, and your application's title.)
AndroidManifest.xml (Important information about your application)
AndroidManifest
I'll start from the bottom up. If you're following a template, there are only a few things you'll need to change in the AndroidManifest. Find the <manifest> tag and edit the "package" attribute to your desired package name. It should be something like "com.your_company.theme.name_of_theme", where "your_company" and "name_of_theme" can be whatever you like. You'll also want to edit the <meta-data> "android:value" and <activity> "android:name" attributes to reflect this (Optionally, you can just set the <activity> "android:name" attribute to ".MainActivity"). Save and close this file, but be sure to remember the package name because you'll need to use it later.
res
Inside this folder are three others:
drawable-xhdpi-v4 - Contains PNG images of the Theme's preview (you can add additional preview images if you want) and the home and lockscreen wallpapers you would like to set. Follow the same naming conventions as listed in the template.
values - Two files: public.xml Lists everything in the res folder that the compiler should expect. If you add/remove preview images or wallpapers, you'll want to account for them in here. The "id" attribute for each tag can be an arbitrary value as long as it is unique. Go ahead an open this up and delete the tags named "app_info" and "app_tag". You won't need them. strings.xml contains your theme's name (this is how it will be displayed in the theme picker).
xml - Contains additional meta-data. Delete it. You won't need it.
assets
Here's where the fun begins. There are a few things in here, however, I will only go over what's in the overlays. Custom fonts and sound effects are completely optional, but feel free to mess around with those if you desire. The theme_info.json file is essentially a list of which applications you want to apply the theme to. Go ahead and open it and delete the "id" key/value pair. Now open the overlays folder. Inside here are a bunch of APK files. This modular setup makes it easy to pick and choose where you want to apply the theme. I'm not going to go over all of them, as their names are pretty self explanatory, but go ahead and decompile the one ending with ".common.apk". This package contains the theming for much of your general UI (such as status bar, navigation bar, text color, etc). Inside, you'll see a similar file structure as before, including an AndroidManifest and a res folder. Note: the smali folder is completely optional, and if you don't know what smali is you can safely ignore/delete this folder. First item of business is editing the AndroidManifest so that it matches your previously defined package name. You'll also want to add this tag somewhere inside it: "<uses-permission android:name="com.lge.permission.LGE_OVERLAY_THEME_APK"/>". This grants proper permission to modify system app themes. Now pop a look into the res folder. Its contents should look familiar. The multiple "xhdpi" folders all contain the same stuff, but target different resolutions. You can read more about them here. Basically the drawable-xxhdpi folders contain PNGs of various system wide UI elements (or app specific in the case of any of the other overlays). The values folder without an appended "hdpi" contains a public.xml, which functions exactly the same as previously mentioned. And the values-xxhdpi folders contain various settings for a specific resolution. I'll leave it up to you to play with them.
That's the basics of it! After recompiling an overlay APK, be sure to sign it or your theme will crash upon applying it (also be sure to sign your actual theme app with the same key). Read about the apksigner I linked to above for more info (I think Android Studio has an automatic way to sign apps with a key for debugging). Also be sure to update the theme_info.json file to list the package names of all the overlays you wish to apply.
Hopefully this helps someone. Let me know if you run into any trouble building or installing your APKs. As for what various settings do, you'll have to figure that part out on your own.
Happy theming!
Click to expand...
Click to collapse
Can I resell theme created with this method?
Nihilian said:
I know this question was asked awhile ago, but I faced a similar issue with my LG Stylo 3 and want to report my findings. First off, Theme Park is available as a web application on LG's SmartWorld developer page http://us.lgworld.com/web.main.dev. However, I think you'll find its customizability to be severely disappointing. In fact, themes created using this are not even compatible with newer LG phones. The schema used for newer models is Home Theme+ (this is what my Stylo uses, and I assume it is what the V30 uses as well). I have scoured LG's dev site and could not find a straightforward way to develop Home Theme+, but it is possible and not super hard, albeit it can be time consuming. It will definitely help if you have some experience with Android app development (my personal experience is limited), however, no programming is necessary. You really only need to know how to edit XML/JSON files, and how to compile/decompile an Android app (there is a fantastic tool for this called apktool, created by Ryszard Wiśniewski and Connor Tumbleson which I will link to).
Tools Needed:
Apktool https://ibotpeaches.github.io/Apktool/
Apksigner (part of the Android SDK build tools) https://developer.android.com/studio/command-line/apksigner.html
Efficient way to create/edit XML and PNG files
Alternatively you could use Android Studio, which honestly might simplify the process.
I have provided a template for creating Home Theme+ themes here. This is just the preinstalled LG High Constrast theme which provides a great outline of what a theme should consist of. Use apktool to easily decompile it.
After spending hours of tweaking I was able to retheme the High Contrast app and brand it as my own. It honestly isn't too complicated, however, there is a LOT of settings, so it'll be up to you to figure out the specifics of what you need to edit in order to create your theme. Here is the general layout of what a Home Theme+ theme must consist of:
Inside the root directory there are 4 items:
assets (This is where the meat of your theme will go)
lib (Contains a dummy file. You can safely exclude this from your application.)
res (Contains basic drawables, preview images, and your application's title.)
AndroidManifest.xml (Important information about your application)
AndroidManifest
I'll start from the bottom up. If you're following a template, there are only a few things you'll need to change in the AndroidManifest. Find the <manifest> tag and edit the "package" attribute to your desired package name. It should be something like "com.your_company.theme.name_of_theme", where "your_company" and "name_of_theme" can be whatever you like. You'll also want to edit the <meta-data> "android:value" and <activity> "android:name" attributes to reflect this (Optionally, you can just set the <activity> "android:name" attribute to ".MainActivity"). Save and close this file, but be sure to remember the package name because you'll need to use it later.
res
Inside this folder are three others:
drawable-xhdpi-v4 - Contains PNG images of the Theme's preview (you can add additional preview images if you want) and the home and lockscreen wallpapers you would like to set. Follow the same naming conventions as listed in the template.
values - Two files: public.xml Lists everything in the res folder that the compiler should expect. If you add/remove preview images or wallpapers, you'll want to account for them in here. The "id" attribute for each tag can be an arbitrary value as long as it is unique. Go ahead an open this up and delete the tags named "app_info" and "app_tag". You won't need them. strings.xml contains your theme's name (this is how it will be displayed in the theme picker).
xml - Contains additional meta-data. Delete it. You won't need it.
assets
Here's where the fun begins. There are a few things in here, however, I will only go over what's in the overlays. Custom fonts and sound effects are completely optional, but feel free to mess around with those if you desire. The theme_info.json file is essentially a list of which applications you want to apply the theme to. Go ahead and open it and delete the "id" key/value pair. Now open the overlays folder. Inside here are a bunch of APK files. This modular setup makes it easy to pick and choose where you want to apply the theme. I'm not going to go over all of them, as their names are pretty self explanatory, but go ahead and decompile the one ending with ".common.apk". This package contains the theming for much of your general UI (such as status bar, navigation bar, text color, etc). Inside, you'll see a similar file structure as before, including an AndroidManifest and a res folder. Note: the smali folder is completely optional, and if you don't know what smali is you can safely ignore/delete this folder. First item of business is editing the AndroidManifest so that it matches your previously defined package name. You'll also want to add this tag somewhere inside it: "<uses-permission android:name="com.lge.permission.LGE_OVERLAY_THEME_APK"/>". This grants proper permission to modify system app themes. Now pop a look into the res folder. Its contents should look familiar. The multiple "xhdpi" folders all contain the same stuff, but target different resolutions. You can read more about them here. Basically the drawable-xxhdpi folders contain PNGs of various system wide UI elements (or app specific in the case of any of the other overlays). The values folder without an appended "hdpi" contains a public.xml, which functions exactly the same as previously mentioned. And the values-xxhdpi folders contain various settings for a specific resolution. I'll leave it up to you to play with them.
That's the basics of it! After recompiling an overlay APK, be sure to sign it or your theme will crash upon applying it (also be sure to sign your actual theme app with the same key). Read about the apksigner I linked to above for more info (I think Android Studio has an automatic way to sign apps with a key for debugging). Also be sure to update the theme_info.json file to list the package names of all the overlays you wish to apply.
Hopefully this helps someone. Let me know if you run into any trouble building or installing your APKs. As for what various settings do, you'll have to figure that part out on your own.
Happy theming!
Click to expand...
Click to collapse
I did this and was able to change colours. Then i pushed a step forward and changed .json file (changed package name and apk names in it) and added new icons in all assets. Thing is, its failing on apply. Can you check it? As i don't have coding knowledge.
Nihilian said:
I know this question was asked awhile ago, but I faced a similar issue with my LG Stylo 3 and want to report my findings. First off, Theme Park is available as a web application on LG's SmartWorld developer page http://us.lgworld.com/web.main.dev. However, I think you'll find its customizability to be severely disappointing. In fact, themes created using this are not even compatible with newer LG phones. The schema used for newer models is Home Theme+ (this is what my Stylo uses, and I assume it is what the V30 uses as well). I have scoured LG's dev site and could not find a straightforward way to develop Home Theme+, but it is possible and not super hard, albeit it can be time consuming. It will definitely help if you have some experience with Android app development (my personal experience is limited), however, no programming is necessary. You really only need to know how to edit XML/JSON files, and how to compile/decompile an Android app (there is a fantastic tool for this called apktool, created by Ryszard Wiśniewski and Connor Tumbleson which I will link to).
Tools Needed:
Apktool https://ibotpeaches.github.io/Apktool/
Apksigner (part of the Android SDK build tools) https://developer.android.com/studio/command-line/apksigner.html
Efficient way to create/edit XML and PNG files
Alternatively you could use Android Studio, which honestly might simplify the process.
I have provided a template for creating Home Theme+ themes here. This is just the preinstalled LG High Constrast theme which provides a great outline of what a theme should consist of. Use apktool to easily decompile it.
After spending hours of tweaking I was able to retheme the High Contrast app and brand it as my own. It honestly isn't too complicated, however, there is a LOT of settings, so it'll be up to you to figure out the specifics of what you need to edit in order to create your theme. Here is the general layout of what a Home Theme+ theme must consist of:
Inside the root directory there are 4 items:
assets (This is where the meat of your theme will go)
lib (Contains a dummy file. You can safely exclude this from your application.)
res (Contains basic drawables, preview images, and your application's title.)
AndroidManifest.xml (Important information about your application)
AndroidManifest
I'll start from the bottom up. If you're following a template, there are only a few things you'll need to change in the AndroidManifest. Find the tag and edit the "package" attribute to your desired package name. It should be something like "com.your_company.theme.name_of_theme", where "your_company" and "name_of_theme" can be whatever you like. You'll also want to edit the "android:value" and "android:name" attributes to reflect this (Optionally, you can just set the "android:name" attribute to ".MainActivity"). Save and close this file, but be sure to remember the package name because you'll need to use it later.
res
Inside this folder are three others:
drawable-xhdpi-v4 - Contains PNG images of the Theme's preview (you can add additional preview images if you want) and the home and lockscreen wallpapers you would like to set. Follow the same naming conventions as listed in the template.
values - Two files: public.xml Lists everything in the res folder that the compiler should expect. If you add/remove preview images or wallpapers, you'll want to account for them in here. The "id" attribute for each tag can be an arbitrary value as long as it is unique. Go ahead an open this up and delete the tags named "app_info" and "app_tag". You won't need them. strings.xml contains your theme's name (this is how it will be displayed in the theme picker).
xml - Contains additional meta-data. Delete it. You won't need it.
assets
Here's where the fun begins. There are a few things in here, however, I will only go over what's in the overlays. Custom fonts and sound effects are completely optional, but feel free to mess around with those if you desire. The theme_info.json file is essentially a list of which applications you want to apply the theme to. Go ahead and open it and delete the "id" key/value pair. Now open the overlays folder. Inside here are a bunch of APK files. This modular setup makes it easy to pick and choose where you want to apply the theme. I'm not going to go over all of them, as their names are pretty self explanatory, but go ahead and decompile the one ending with ".common.apk". This package contains the theming for much of your general UI (such as status bar, navigation bar, text color, etc). Inside, you'll see a similar file structure as before, including an AndroidManifest and a res folder. Note: the smali folder is completely optional, and if you don't know what smali is you can safely ignore/delete this folder. First item of business is editing the AndroidManifest so that it matches your previously defined package name. You'll also want to add this tag somewhere inside it: "". This grants proper permission to modify system app themes. Now pop a look into the res folder. Its contents should look familiar. The multiple "xhdpi" folders all contain the same stuff, but target different resolutions. You can read more about them here. Basically the drawable-xxhdpi folders contain PNGs of various system wide UI elements (or app specific in the case of any of the other overlays). The values folder without an appended "hdpi" contains a public.xml, which functions exactly the same as previously mentioned. And the values-xxhdpi folders contain various settings for a specific resolution. I'll leave it up to you to play with them.
That's the basics of it! After recompiling an overlay APK, be sure to sign it or your theme will crash upon applying it (also be sure to sign your actual theme app with the same key). Read about the apksigner I linked to above for more info (I think Android Studio has an automatic way to sign apps with a key for debugging). Also be sure to update the theme_info.json file to list the package names of all the overlays you wish to apply.
Hopefully this helps someone. Let me know if you run into any trouble building or installing your APKs. As for what various settings do, you'll have to figure that part out on your own.
Happy theming!
Click to expand...
Click to collapse
Been trying this with my Stylo 4, was able to get it to install and apply the theme once, but now it tells me theme cannot be applied. Any thoughts?
Basically, If I modify any of the apks in assets it will not apply the theme anymore. It doesn't matter If I resign them all or if I copy the originals.
Hopefully with a little help I can get past this hurdle and be able to create my own themes for the Stylo 4.
Edit: Got it working, the problem was not changing all of the package names. Thanks.