[Guide] Creating Custom Lockscreens


  1. ccapasso

    ccapasso Well-Known Member

    Several people asked how to make a clear custom lockscreen, so here is my guide on how to do it.

    ***ATTENTION***
    This is only for 1.5 ROM customization. It will NOT work on 2.0, or 2.1. Haven't tested it on 1.6 so I can't say for sure. For now, we will state that this is only for 1.5 ROM's.
    ***ATTENTION***


    Tools/Files needed:

    1. Photoshop or similar photo editing program. The files we edit/create will be in png format and if you want them to be clear or semi clear, you need to be able to change the opacity of them.

    2. 7zip which can be obtained here

    3. Pre-Kitchen which can be obtained here

    4. HtcLockScreen.apk. Instead of having you pull your file, I have supplied one for you to download here. Make sure when you save this file, it saves as an .apk, do not let your system rename it to something else.

    (Here is another link for those having problems downloading [thanks brian m for uploading elsewhere]) HtcLockScreen.apk

    5. lockscreen_topedge.png. I have this hosted here for you. It is in a zip file, just extract it to your desktop.

    (Here is another link for those having problems downloading [thanks brian m for uploading elsewhere]) lockscreen_topedge.zip

    6. You will also need JDK installed on your computer. You can download it here.


    Now for the good stuff, how to actually do this.

    Step 1:
    Open lockscreen_topedge.png (which is inside the zip filed) in Photoshop or whatever program you are using. The gray square box that you see is where the clock is placed on the screen. I haven’t figured out how to edit and/or remove the clock yet, so consider this a placeholder if you will. Kind of like a guide for how your image will line up. Create your LockScreen however you want. DO NOT RESIZE THIS IMAGE, DO NOT CREATE OUTSIDE OF IT, STAY WITHIN THE BOUNDARIES OF THE TEMPLATE :). I am not going to go into details of how to use Photoshop, that is on you. However, if you want your LockScreen to be semi-transparent at all, make sure you change the opacity of the image in Photoshop. When finished, be sure to save your image as the name of the template, which is lockscreen_topedge.png. Do NOT change it for any reason.


    Step 2:
    Once you have your image, create a folder on your desktop called system. Inside that folder create another folder call app. Inside the app folder please place the HtcLockScreen.apk file.

    [​IMG]


    Step 3:
    Right click on HtcLockScreen.apk and choose 7zip>Open Archive.

    [​IMG]


    Step 4: Once that opens, please navigate to res>drawable-480x320.

    [​IMG]


    Step 5:
    If you look at the files in there, you will see one called lockscreen_topedge.png. Simply click and drag your new image (which you saved and named lockscreen_topedge.png) into that window. You will get a prompt asking you to Confirm the File Copy. Click yes. This will overwrite the current file with yours. After you click yes, you may close the 7zip window.

    [​IMG]


    Step 6:
    Now that we have our new image into the apk, it is time to wrap this all up. Right click on your system folder that you put on your desktop in step 2, and choose 7zip>Add to Archive

    [​IMG]


    Step 7:
    You will now get a prompt asking you to name your Archive. Name it something that is relevant to your lockscreen. For example, when I made my Cavs logo, I called it something like Cavs_Lockscreen.zip. Make sure file type says Zip, not 7z. When finished typing the name, click OK.

    [​IMG]


    Step 8: You will now have a new zip file on your Desktop, and now it is time to sign this file. Go to wherever you extracted your pre-kitchen and run it. Click on tools and tweaks (orange wrench)
    [​IMG]


    Then click on sign a zip. You will get a prompt box telling you about the signing tool, just click ok.
    [​IMG]



    Step 9:
    After clicking sign a zip you should now have a window asking you to Open a file. Browse to your Desktop, select your new lockscreen zip file you created in step 7 (In my case Cavs_Lockscreen.zip) and click open.

    [​IMG]


    Step 10:
    You will now get a prompt asking you to save your file. Name it the same as your zip, except add _signed to the end of it. So in my case my file name becomes Cavs_Lockscreen_signed.zip. Click save.

    [​IMG]

    At this point pre-kitchen will do its thing and sign your file and tell you the Zip signed Successfully. Click ok.



    Step 11:
    You now have another file on your desktop, in my case called Cavs_Lockscreen_signed.zip. This is your signed lockscreen. You may now put this file on your SD card and flash it through Recovery. If you did everything right, after you flash the signed zip and reboot your phone all through recovery, you phone should reboot (let it do its thing, it might seem like it takes a second) and you should have your new lockscreen.


    This concludes the end of the tutorial. I hope you enjoyed it and learned from it.

    *Edit* If we can get a mod to sticky this, I would appreciate it. Thanks :)

    Advertisement
    :
    tazdvl54, pwabbit, thatjerk and 6 others like this.
  2. John_Droid

    John_Droid Well-Known Member

    Rather than flashing through recovery, you can also just drop the .zip file into the 'themes' folder, when using the pre-kitchen, and just flash the lockscreen via the 'install theme' button.

    You can even grab a screen capture using 'picme' and by naming the screen the EXACT same name as the zip file, with a .png extension, you will get a nice preview of the lockscreen in the pre-kitchen during install.
  3. ccapasso

    ccapasso Well-Known Member


    Yes you can do it this way. I didn't cover that, as I'm sure someone will try that and mess up somehow :). Anyways, thanks for posting it, I might add it to the tutorial if there is enough interest in doing it that way.
  4. Very nice! Thanks ccapasso. Will have to give this one a try over the weekend.
  5. Konikub

    Konikub Well-Known Member

    YOU ROCK!!!!! Thank you so much for the help and detailed instructions! I have been trying to figure out how to do this for quite some time....and it's hard to find a "how to" on anything that has to do with creating ROM/Lockscreens/Icons/anything to do with android.

    I would love to get into learning how to write and create. Thank you very much!! :):D:D:)
  6. Konikub

    Konikub Well-Known Member

    okay I unzipped the files and placed the png image in the system/apps folder and when I go to right click on the image and use 7 zip it only has the options add to archive and down....nothing like open with archive.

    Is there a step I missed..?

    LOL...don't kill me....I just realized it's the apk file and not the png file.

    oooooooooppss :p
  7. ccapasso

    ccapasso Well-Known Member

    Lol...no worries. Good luck with the learning ;)
  8. Konikub

    Konikub Well-Known Member

    Hmmmm....when I went to sign it, it says that it appears to have fail....

    with about 8 lines of what it could not do/read or whatnot.....

    Any ideas...?
  9. Biggest Fro

    Biggest Fro Well-Known Member

    Does this change the notification icons? like NOJ's lockscreens change you back to the original Fresh 1.1 icons
  10. ccapasso

    ccapasso Well-Known Member

    This is strictly the lockscreen. Nothing is mentioned of the notification bar and/or icons.
  11. Biggest Fro

    Biggest Fro Well-Known Member

    Sweet, thanks for the guide, will be using this tomorrow!
  12. ccapasso

    ccapasso Well-Known Member

    Yeah, I have an idea, not 100% sure on it though. I'm getting ready to head to sleep now, but try this.

    For the pre-kitchen, run the diagnostics and tell me if you Java fails. If it does, that is the problem.

    I should put, and will put it in there, but you need JDK to do this. I don't have the link handy now but I will be sure to get it up ASAP.
  13. ccapasso

    ccapasso Well-Known Member

  14. ccapasso

    ccapasso Well-Known Member

    Yes, it is JDK 6 that you need.

    Gotta sleep now, sorry. Will check on ya in the morning. If it works, I'll be sure to note this and link it in part of tutorial. My mistake.
  15. tatonka_Hero

    tatonka_Hero Well-Known Member

    Sweet! I'll have to mess with this next week when I've got some time.

    You should make a "theme" guide too! Something with Metamorph, or any other way to make themes, that'd be freakin sweet :D

    Edit: Ooo, fancy shmancy user titles now huh?
  16. Konikub

    Konikub Well-Known Member

    WORKED FLAWLESSLY! Thank you soo much.....the only thing that wasn't working for me wasn't that I needed a new flash....

    I saw that our "add to archives" were different in some manners, so I checked into why. When you first pull it up from downloading it...it will first start out as "archive format" as a z7, we need to switch that to "Zip" then all else will fall into place. You might need to change wordsize from what ever it self populates to 128 and Number of CPU threads from 2 to 4....then all will be as you have it and it works AWESOME!

    I love my new lockscreen of The United Kingdom!!!! lol.

    Thanks again and hope everyone else appreciates it as much as I do! :D:):D
  17. djkleric

    djkleric Well-Known Member

    thanks! easy as pie!
  18. ccapasso

    ccapasso Well-Known Member


    Glad to hear it worked for you :). I've edited the Tutorial to include a notation about changing the archive format. The other fields you mentioned will likely very by user, mine just happened to be that way by default.

    Also, it wasn't flash, it was Java. But did you not need to install that or did you already have it installed? I've had it installed form other stuff I've done, so it just worked for me, but I want to be sure that those that need it install it if it is necessary, which I believe it is.

    *Edit* I added JDK to the list of tools needed.
  19. Taterus Maximus

    Taterus Maximus Well-Known Member

    I'm thinking that this thread should probably be sticky-fied
  20. ccapasso

    ccapasso Well-Known Member


    Here's hoping it does :)
  21. showbo

    showbo Well-Known Member


    Yeah, that never worked for me. Each and every time I loaded up a theme from the zip file, yeah the task bar would change to the theme, but the lockscreen would stay the same, and never change. Fresh 1.1 was awesome, but I really dislike the clear lock screen, and up until now, I thought I couldn't change it, no matter what I did.

    MoDaCo put it back to stock style, but that is fine with me, would rather have that, than a clear lock screen. And I just don't know why I don't like the clear lock screen bar...Just bothers me for some reason.


    Oscar
  22. ccapasso

    ccapasso Well-Known Member

    Those of you that have tried this and been successful, how about posting some screen shots and links to your signed zip file? I would like to make this not only a tutorial, but a place where people can share their custom lockscreens :).
  23. djkleric

    djkleric Well-Known Member

    Good Idea.
  24. brian m

    brian m Active Member

  25. ccapasso

    ccapasso Well-Known Member

    Glad to see you got it working brian m.

    I've posted mine elsewhere already, but for the sake of keeping everything in one place for people to find, here are all of my current custom lockscreens (links to download the signed zip above each picture):


    Download here:
    [​IMG]

    Download here:
    [​IMG]

    Download here:
    [​IMG]

    Download here:
    [​IMG]

    Download here:
    [​IMG]

    Download here:
    [​IMG]

    Download here:
    [​IMG]

    Download here:
    [​IMG]
Loading...

Share This Page