User Tag List

Page 4 of 4 FirstFirst ... 2 3 4
Results 31 to 37 of 37

Thread: Fit inside and adjust window

  1. #31
    Clicker Fusion 2.5

    Join Date
    Dec 2018
    Posts
    8
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Ninjadoodle View Post
    Hi Guys

    I was just pointed to this thread and it looks like its been years, since this feature was requested. Any hopes this will be done in the near future - any workaround to achieve the same result if it is gonna be a while?
    So, I am simply the latest to ask the question.
    Is there a workaround or should I simple avoid the html export module. The mysterious thing about it, is that when I simply run the application (without building it), the window size is perfect; it is "only" the html build that fails to get the right size.

  2. #32
    Clicker Fusion 2.5 DeveloperAndroid Export ModuleHTML5 Export ModuleSWF Export Module
    DavidT's Avatar
    Join Date
    Sep 2011
    Posts
    158
    Mentioned
    4 Post(s)
    Tagged
    0 Thread(s)
    Any chance for this feature to be in a next update?

  3. #33
    Clicker Fusion 2.5 DeveloperFusion 2.5+ DLCAndroid Export ModuleHTML5 Export ModuleiOS Export Module
    CruddyBuddy's Avatar
    Join Date
    May 2010
    Posts
    85
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I would like to add my voice to this request. This works great in the Android exporter and is really needed in HTML5. Is there any workaround for this at the moment?

  4. #34
    Clicker Fusion 2.5 DeveloperFusion 2.5+ DLCAndroid Export ModuleHTML5 Export ModuleiOS Export Module
    CruddyBuddy's Avatar
    Join Date
    May 2010
    Posts
    85
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I've got some great news for everyone. I THINK what I was trying to achieve is the same thing being requested here. We all know the game windows will fit within the horizontal and vertical boundaries of the browser windows if you tick "Resize display" and "Fit inside (black bars)". But what if you want the game or app to fill the browser and cut off either the extra width or height so there are no black bars (or whitespace) and also maintain the aspect ratio so the game is not distorted? Well, after a few hours of experimentation I've got a workaround which allows your app to fill the entire browser window without blank space on the edges and without stretching out the app.

    Here are some quick steps:
    1 - Tick "Generate HTML File" along with "Resize Display" and "Fit inside".
    2 - Build application
    3 - Untick "Generate HTML file" so any future builds won't erase your work
    4 - Rename index.html to app.html
    5 - Download the index.html file attached here index.zip and put it in your project path folder (where the app.html file is)
    6 - Edit the new index.html file and change "height: 1920px;" to whatever height your app size is.
    6 - Upload the project directory and access the index.html file like normally (or you can build and run locally as long as you've already renamed the original index.html file and added the new index file. Just make sure you don't tick the Generate HTML box again.

    This index.html makes a few assumptions about your app, but it can be changed easily. For example, you'll notice there are no scroll bars. You can add them back by removing the line "overflow: hidden;" from the html file. The app will still fit to the browser width without distorting the aspect ratio, but will permit a user to scroll the full height of the app. This could be useful if you wanted your app to basically run like a webpage.

    This index.html also assumes you want the width of the browser window to dictate the size of the app within the frame, but if you want the "cut-off" area to be within the width and have the height dictate the size, you can change three lines:
    width: 100vw;
    height: 1920px;
    max-width: 100%;

    change to:

    width: 1920px; (or whatever size
    height: 100vh;
    max-height: 100%;

    And that's it! As far as I can tell, there is no way for the app to detect what the browser size is, so I don't think you can do anything about re-positioning UI elements in your app, but at least you can fill the browser without distorting the app. Let me know if any of you have problems and I'd be happy to take a look. I hope this helps.

    DEMO: I've put together a little test demo to try it out. This is 1920x5760. If you click the link, you will see that the target is a perfect circle and doesn't distort, no matter how you resize the browser window. You can also see that if you make the browser tall and skinny (or open the link on a phone), you will be able to see the area below the target that gets cut off. This can be more of the background or information you can scroll to if you decide to enable scrolling"
    Non-scrolling version: https://thesinistrals.com/programs/screensizetest
    Scrolling version: https://thesinistrals.com/programs/s...scrolling.html

    index.zip

  5. #35
    Clicker Fusion 2.5 DeveloperFusion 2.5+ DLCAndroid Export ModuleHTML5 Export ModuleiOS Export Module
    CruddyBuddy's Avatar
    Join Date
    May 2010
    Posts
    85
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Okay, so a quick follow-up to this. There seems to be a problem with the scroll bars on mobile browsers. If scrolling is not disabled it the scroll bar appears just fine on Windows, but trying it on mobile Chrome or Firefox the scroll bar doesn't appear and it won't scroll. If I add some padding on the side and I touch in that area, I can touch scroll, but if the app fills the entire browser window, which is what we want, it won't permit scrolling. I am working on a solution.

  6. #36
    Clicker Fusion 2.5 DeveloperFusion 2.5+ DLCAndroid Export ModuleHTML5 Export ModuleiOS Export Module
    CruddyBuddy's Avatar
    Join Date
    May 2010
    Posts
    85
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    New Version of Index

    Here is a new version of the index file. It is customized for 3840x5760 screen size but can be edited for other app sizes. This index shows most of the width of the app on a desktop browser in full screen, but will cut off 25% on the left and right as you shrink the browser width. Then, it will start downscaling the app. This makes it responsive for mobile browsers. If you don't want it to crop the edges as the window shrinks, you can change max-width: 150%; to max-width: 100%; or increase the percentage to crop even more of the apps edges before it starts to downscale.

    Again, I hope this help! For a sample of my own website using this for the splash screen, visit: https://thesinistrals.com

    Oh, and I'm using the Multiple Touch object to do scrolling in app, so I have the browser scroll bars permanently turned off. Desktop users can still scroll with the mouse wheel, or can click and drag just like a mobile user. Right now the only problem I'm having is limiting the scroll length for mobile users, as the window width is narrower and is allowing scrolling farther down than a desktop user.

    NEW INDEX
    index-new.zip

  7. #37
    Clicker Fusion 2.5 DeveloperAndroid Export ModuleHTML5 Export ModuleSWF Export Module
    DavidT's Avatar
    Join Date
    Sep 2011
    Posts
    158
    Mentioned
    4 Post(s)
    Tagged
    0 Thread(s)
    CrudduBuddy, your demo links don't work, can you fix it ?

    To Clickteam : will "Fit inside and adjust window" be available with Fusion 3 ?

Page 4 of 4 FirstFirst ... 2 3 4

Similar Threads

  1. Fit inside & Adjust Window Size
    By ProdigyX in forum Android Export Module Version 2.0
    Replies: 2
    Last Post: 9th October 2014, 08:28 AM
  2. I need to scale down my window size but I must adjust my art manually!?
    By ZAMtendo in forum Multimedia Fusion 2 - Technical Support
    Replies: 4
    Last Post: 18th August 2014, 08:53 PM
  3. [RC3] fit inside and adjust window size issues
    By SoftWarewolf in forum Android Export Module Version 2.0
    Replies: 4
    Last Post: 11th February 2013, 07:08 PM
  4. Is it possible to adjust the size of the hot spot?
    By fwtep in forum iOS Export Module Version 2.0
    Replies: 12
    Last Post: 13th August 2012, 01:41 AM
  5. Can you adjust mouse click speed?
    By MikeB in forum Multimedia Fusion 2 - Technical Support
    Replies: 7
    Last Post: 15th June 2009, 09:14 PM

Posting Permissions

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