Results 1 to 16 of 16

Your favorite Apple, iPhone, iPad, iOS, Jailbreak, and Cydia site.


Thread: Winterboard - Dimming Wallpaper

  1. #1
    Default Winterboard - Dimming Wallpaper
    Hi all,

    My first post...and probably a basic question for anyone with html skills.

    Is it possible to dim the wallpaper that shows through on the springboard - similar to the option that Summerboard provided?

    Any help is appreciated. Thanks.

  2. #2
    Hey Solarus, I didn't use Summerboard so I'm not familiar with what you mean by dimming. What exactly are you wanting the wallpaper to do?

  3. #3
    Hi Talynrider, Summerboard had a switch that made the wallpaper on the springboard darker. Thee one on the lock screen remained the same - brightness-wise. Basically It made icons (clear ones especially) easier to see.

  4. #4
    Well you could alter the wallpaper in photoshop using either brightness/contrast or by coating the image with an opaque black layer to darken it. Would be much easier than trying to write html to do it for you. It is possible though I'm not knowledgeable enough to tell you how.

  5. #5
    Quote Originally Posted by louns View Post
    Well you could alter the wallpaper in photoshop using either brightness/contrast or by coating the image with an opaque black layer to darken it. Would be much easier than trying to write html to do it for you. It is possible though I'm not knowledgeable enough to tell you how.
    That would be an easy way to do it. I really only have one theme (icon-wise) I use but I like to change my wallpaper every few days. What I'd really like to do is to have whatever wallpaper I have on the lockscreen also be dimmed on the springboard regardless of what wallpaper I am using - basically I want my cake and to eat it too

  6. #6
    I registered just to reply to this post (whee)

    Basing this off of the idea of Saurik's to use a Wallpaper.html file

    1. Create a Wallpaper.html file in a subfolder of /Library/Themes (ex: /Library/Themes/Doswizard.theme) then activate it in Winterboard.
    2. By default this will use the LockBackground.jpg file which is much the same behavior that Summerboard had.
    3. You can choose how much to darken the wallpaper by changing the opacity settings in the code below.


    Please note; you will have to respring after changing your wallpaper in "Settings" before it will be reflected in Winterboard.

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
      <!--meta name="viewport" content="width=320, minimum-scale=1.0, maximum-scale=1.0"/-->
      <meta http-equiv="Content-Type"
     content="text/html; charset=UTF-8">
      <style>
            body {
                background-image: url('/var/mobile/Library/LockBackground.jpg');
                margin: 0;
                padding: 20px 0 0 0;
                height: 442px;
                width: 320px;
            }
    div.transbox
    {
      width: 320px;
      height: 442px;
      margin: 0;
      background-color: #000000;
      border: 0px solid black;
      filter:alpha(opacity=30);
      opacity:0.3;
    }
        </style>
    </head>
    <body style="color: black;">
    <div class="transbox"></div>
    
    </body>
    </html>

  7. The Following User Says Thank You to doswizard For This Useful Post:

    solarus (08-12-2008)

  8. #7
    Quote Originally Posted by doswizard View Post
    I registered just to reply to this post (whee)

    Basing this off of the idea of Saurik's to use a Wallpaper.html file

    1. Create a Wallpaper.html file in a subfolder of /Library/Themes (ex: /Library/Themes/Doswizard.theme) then activate it in Winterboard.
    2. By default this will use the LockBackground.jpg file which is much the same behavior that Summerboard had.
    3. You can choose how much to darken the wallpaper by changing the opacity settings in the code below.


    Please note; you will have to respring after changing your wallpaper in "Settings" before it will be reflected in Winterboard.

    doswizard, Thanks a bunch. Just what I needed. I did have to tweak the dimensions in the code a little - hey I learned something . I'm not good at code so this is mucho appreciated. Thanks again for the help.

  9. #8
    there is a way to dim the wallpaper without the need of HTML or Coding.
    Install the new Kate via Installer 4 and in the Rip Xev section in Settings go to Face Lift and you can ajust a ton of things like dimming, 5 icon dock, reflection and much more!!!!!!
    Check it out

  10. #9
    Quote Originally Posted by solarus View Post
    doswizard, Thanks a bunch. Just what I needed. I did have to tweak the dimensions in the code a little - hey I learned something . I'm not good at code so this is mucho appreciated. Thanks again for the help.
    Solarus; what did you have to change?

    I'm thinking about submitting it as a package to Cydia (but not sure how since I've never done so before)

    Glad it helped!

  11. #10
    Quote Originally Posted by doswizard View Post
    Solarus; what did you have to change?

    I'm thinking about submitting it as a package to Cydia (but not sure how since I've never done so before)

    Glad it helped!
    My wallpaper covers the entire screen so I had to change the following:
    a) "Padding" references to 0px instead of 20px
    b) "Height" references to 480px instead of 442px.

    I would submit it if I were you. Its a key feature not included in Winterboard at this time. Even so-so bright wallpapers don't work well with clear themes unless you have the ability to dim the wallpaper
    Last edited by solarus; 08-13-2008 at 08:42 AM.

  12. #11
    Made the changes you suggested and submitted using the "Host your app/skin" button on the side of the screen; hope it gets in there

    Got confirmation that it should be available from the MMi repository tonight for easy downloading
    Last edited by doswizard; 08-13-2008 at 05:06 PM. Reason: Automerged Doublepost

  13. #12
    hi all !

    i have an question about html to ...

    can someone make me a html file so that it's make 4 wallpapers changing all at the same time please ?

    i know were to find an html file for 2 wallapers but never found one for 4 wallpapers or 5 wallpaper

    but now i really want a html file for 4 wallpapers ...

    thanks in advance !

  14. #13
    Quote Originally Posted by tntxx9 View Post
    hi all !

    i have an question about html to ...

    can someone make me a html file so that it's make 4 wallpapers changing all at the same time please ?

    i know were to find an html file for 2 wallapers but never found one for 4 wallpapers or 5 wallpaper

    but now i really want a html file for 4 wallpapers ...

    thanks in advance !
    Take your 4 wallpapers and name them Wallpaper1.png - Wallpaper4.png.
    Create a subdirectory in your theme folder and call it 'Private' and toss the pngs in it.
    Put the html code below into Wallpaper.html and place that in your theme folder.

    The time between each image is 5secs (in the code this is the SetTimeout 5000 in each function), and the duration of the actual 'fade-in' is 2secs (this is the webkit-transition-duration: 2s part).

    Code:
    <?xml version="1.0" encoding="UTF-8"?>
    <html>
      <head>
        <base href="Private/"/>
        <!--meta name="viewport" content="width=320, minimum-scale=1.0, maximum-scale=1.0"/-->
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
        <style>
          body 
          {
            background-color: black;
            margin: 0;
            padding: 20px 0 0 0;
            height: 480px;
            width: 320px;
          }
          img 
          {
            -webkit-transition-property: opacity;
            -webkit-transition-duration: 2s;
            position: absolute;
            width: 320px;
            height: auto;
          }
          img.fade-out 
          {
            opacity: 0;
          }
          img.fade-in 
          {
            opacity: 1;
          }
        </style>
      </head>
      <body style="color: black">
        <img src="Wallpaper1.png" id="Wallpaper1" className="fade-in"/>
        <img src="Wallpaper2.png" id="Wallpaper2" className="fade-out"/>
        <img src="Wallpaper3.png" id="Wallpaper3" className="fade-out"/>
        <img src="Wallpaper4.png" id="Wallpaper4" className="fade-out"/>
    
        <script>
          var fade_1 = Wallpaper1;
          var fade_2 = Wallpaper2;
          var fade_3 = Wallpaper3;
          var fade_4 = Wallpaper4;
    
          var fade1 = function () 
          {
              fade_2.className = 'fade-in';
              fade_1.className = 'fade-out';
              setTimeout(fade2, 5000);
          }
          var fade2 = function () 
          {
              fade_3.className = 'fade-in';
              fade_2.className = 'fade-out';
              setTimeout(fade3, 5000);
          }
          var fade3 = function ()   
          {
              fade_4.className = 'fade-in';
              fade_3.className = 'fade-out';
              setTimeout(fade4, 5000);
          }
          var fade4 = function () 
          {
              fade_1.className = 'fade-in';
              fade_4.className = 'fade-out';
              setTimeout(fade1, 5000);
          }
          fade1();
        </script>
      </body>
    </html>
    Last edited by mudlark; 09-01-2008 at 06:00 PM.

  15. The Following User Says Thank You to mudlark For This Useful Post:

    tntxx9 (09-01-2008)

  16. #14
    Thanks ! Just made every thing now and will upload to my ipoT

    Thanks

  17. #15
    What's Jailbreak?
    Join Date
    Aug 2008
    Posts
    14
    Thanks
    0
    Thanked 2 Times in 1 Post
    well,hi,first post here :P
    secondly..mudlark..why not just create an array with the images and loop through them,saves you coding practically 4 diff. functions that do the same thing.. code reuse=better and easier to expand

  18. #16
    Quote Originally Posted by DJElo View Post
    well,hi,first post here :P
    secondly..mudlark..why not just create an array with the images and loop through them,saves you coding practically 4 diff. functions that do the same thing.. code reuse=better and easier to expand
    You're certainly right, there's no question that my implementation is primitive design-wise, its just that html scripts are an unfamiliar syntax for me.

    I also happened to have that html lying around from when I was first playing with winterboard and attempting to make a simple animation. I moved on to using a single transformation instead so I didn't really go back to this code until I saw this thread.
    Last edited by mudlark; 09-02-2008 at 10:01 AM.

Posting Permissions
  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •