dcsimg
A Flash Developer Resource Site

Results 1 to 9 of 9

Thread: High quality full browser background

  1. #1
    Junior Member
    Join Date
    Dec 2006
    Posts
    21

    High quality full browser background

    Hi

    Could you help me with the following question:
    How do you make a flash full browser background with high quality like here:

    http://www.golla.fi/
    (Please, choose your language at first. After that opens up a screen with a full browser bitmap man on the left size.)

    I have been trying to make such scalable high quality background image but the results have been poor. So, what is the trick? High resolution or what?

    I am using Photoshop and Flex.

  2. #2
    Member
    Join Date
    Jul 2000
    Location
    Atlanta
    Posts
    93
    make a huge image and make sure the flash publish settings are highest quality is a dirty way of doing it.... It will look aliased if it is scaled down too much.

    a better method would have different resolutions of the same image and do a browser resolution check and load the closest corresponding image as a movieclip in. or use an antialiasing function.
    Last edited by rrutter81; 05-20-2009 at 12:37 PM.

  3. #3
    Moderator whispers's Avatar
    Join Date
    Mar 2001
    Location
    CFA2h (respect the HEX)
    Posts
    12,755
    the image scales with the browser.. so using alternate images woudnt really matter IMHO..

    anyways..

    as stated using a LARGE resolution image to begin with.. (the largest size you think anyone would need)..

    and scale it using the Stage.onResize() event..

    I would also suggest you attach as a bitmap to smooth it out when scaling.

  4. #4
    Junior Member
    Join Date
    Dec 2006
    Posts
    21
    Thanks for the tips. My Flex test project's size is 1000x600 and I made 2000x1200 size image. It looked nice when it was resized to 1000x600 in the beginning when I ran the project. Right after I resized the swf player either to smaller or to larger from 1000x600 the image looked bad. On the other hand when resized to 500x300 the image looked good.

    I am doing the full screen resizing like this:

    stage.addEventListener(Event.RESIZE, scaleAgain);

    Is this the same as Stage.onResize() event?

    Does the description above tell you that the smoothing would do the thing?
    How can I use bitmap smoothing in Flex? With the bitmap filters perhaps?

  5. #5

  6. #6
    Member
    Join Date
    Jul 2000
    Location
    Atlanta
    Posts
    93
    the resolution formats is the key....

    it does make a difference.

  7. #7
    Moderator whispers's Avatar
    Join Date
    Mar 2001
    Location
    CFA2h (respect the HEX)
    Posts
    12,755
    I dont why you are saying that?

    You can take one large image, and scale down and back up no problem..

    using attaching as a bitmap, you can even scale things UP (a little) more than the original size and it will still look 'ok'

    I dont know if the original link uses attach bitmap...but it helps when scaling images to not make them so jerky.


    here is a quick example.. using THEIR image...

    this also, loads the BG image dynamically so its easier to change out.. where as theirs was embedded I believe:

    http://www.dmstudios.net/demos/fullScreen/

  8. #8
    Member
    Join Date
    Jul 2000
    Location
    Atlanta
    Posts
    93
    while that image is a bit more forgiving.... i have some aurora style backgrounds ive made that make the auroras aliased even at 2500+ res rendered.

    It does look much better attaching the bitmap, well done.

  9. #9
    Moderator whispers's Avatar
    Join Date
    Mar 2001
    Location
    CFA2h (respect the HEX)
    Posts
    12,755
    post one of you images... Id like to check it out.. to see if I 'see' a difference..

    I dont see any difference.. and I guess I dont understand what you mean by 'more forgiving' ..

    thanks

Posting Permissions

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




Click Here to Expand Forum to Full Width

HTML5 Development Center