Mobile issues: Scaling and sound

Discussion and feedback on Construct 2

Post » Fri Mar 16, 2012 8:05 pm

.Thunder2012-03-21 05:36:13
B
5
S
2
G
5
Posts: 26
Reputation: 2,987

Post » Fri Mar 16, 2012 9:56 pm

Excuse my stupidity, coding isn't my strong point, even when editing html files lol.

Could you dumb this down for me and tell me where I've gone wrong here?


[CODE]
<!DOCTYPE html>
<html manifest="offline.appcache">
<head>
    <meta charset="UTF-8" />
     <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
     <title>Ball Boy</title>
     <!-- Note: running this exported project from disk may not work exactly like preview, since browsers block some features on the file:// protocol. Once you've uploaded it to a server, it should work OK. -->
     
     <!-- Allow fullscreen mode on iOS devices. (These are Apple specific meta tags.) -->
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, target-densitydpi=device-dpi" />
     <meta name="apple-mobile-web-app-capable" content="yes" />
     <meta name="apple-mobile-web-app-status-bar-style" content="black" />
     <meta name="HandheldFriendly" content="true" />

    <!-- All margins and padding must be zero for the canvas to fill the screen. -->
     <style type="text/css">#c2canvas{width:100%;height:100%}*{margin:0;}</style>
     <div style><canvas id="c2canvas" width="800" height="480"></div>
</head>

<body>
     <div id="fb-root"></div>
     
     <!-- The canvas the project will render to. If you change its ID, don't forget to change the
     ID the runtime looks for in the jQuery events above (ready() and cr_sizeCanvas()). -->
     <canvas id="c2canvas" width="800" height="480" oncontextmenu="return false;" onselectstart="return false;">
          <!-- This text is displayed if the visitor's browser does not support HTML5.
          You can change it, but it is a good idea to link to a description of a browser
          and provide some links to download some popular HTML5-compatible browsers. -->
          <h1>Your browser does not appear to support HTML5. Try upgrading your browser to the latest version. <a href="http://www.whatbrowser.org">What is a browser?</a>
          <br/><br/><a href="http://www.microsoft.com/windows/internet-explorer/default.aspx">Microsoft Internet Explorer</a><br/>
          <a href="http://www.mozilla.com/firefox/">Mozilla Firefox</a><br/>
          <a href="http://www.google.com/chrome/">Google Chrome</a><br/>
          <a href="http://www.apple.com/safari/download/">Apple Safari</a><br/>
          <a href="http://www.google.com/chromeframe">Google Chrome Frame for Internet Explorer</a><br/></h1>
     </canvas>
     
     <!-- Pages load faster with scripts at the bottom -->

     <script src="jquery-1.7.1.min.js"></script>



     <script src="phonegap.js"></script>
     
    <!-- The runtime script. You can rename it, but don't forget to rename the reference here as well.
    This file will have been minified and obfuscated if you enabled "Minify script" during export. -->
     <script src="c2runtime.js"></script>

    <script>
          // Size the canvas to fill the browser viewport.
          function cr_sizeCanvas()
          {
               var w = jQuery(window).width();
               var h = jQuery(window).height();
               
               if (w === 0 || h === 0)
                    return;
               
               var canvas = document.getElementById("c2canvas");
               
               if (canvas)
               {
                    canvas.width = w;
                    canvas.height = h;
               
                    if (canvas.c2runtime)
                         canvas.c2runtime.setSize(w, h);
               }
               else if (window.c2runtime)
                    window.c2runtime.setSize(w, h);
          }
          
          jQuery(window).resize(function() {
               cr_sizeCanvas();
          });
          
          document.addEventListener("deviceready", function ()
          {
               cr_sizeCanvas();
               
               // Create new runtime using the c2canvas
               cr.createRuntime("c2canvas");
          }, false);
     
    </script>
</body>
</html>
[/CODE]
ImageImage
Mr. Green - Platform/puzzle game out now!
B
24
S
7
G
1
Posts: 222
Reputation: 3,325

Post » Wed Apr 11, 2012 2:12 pm

Ok Guys my phonegap app size :

Android No problem without top bar.
Window Size : 2610,1736
Game Layout size 2610,1736

It s looking good no gap nothing.
B
8
S
2
G
3
Posts: 3
Reputation: 2,475

Post » Mon Nov 26, 2012 3:13 pm

Hello, I readed the http://www.scirra.com/tutorials/73/supporting-multiple-screen-sizes post, and C2 axample (fullscreen - sacling to windows size.capx) , but It's not working for me.. Please, Can you provide an example (with hub, background and some objects) to test on all mobile device screen size?
B
14
S
2
G
1
Posts: 10
Reputation: 1,750

Post » Sat Jun 29, 2013 4:49 pm

Thunder, you could teach to do this with the resolutions? To work on all of them? how to layolt and project exports by cocoonjs?
B
11
Posts: 16
Reputation: 449

Previous

Return to Construct 2 General

Who is online

Users browsing this forum: No registered users and 8 guests