Facebook SDK Canvas Size

Unity Engine
1

Hello,

I am trying to set the canvas size to a particular resolution because the canvas set width is very limiting and the fluid resolution breaks the game for some reason. Does anyone have the same results for using fluid and if not any suggestions on how to fix it? I did use FBScreen.SetResolution( 960, 640, false ); and some js injections from another post but none worked :frowning:

2

any ideas?

3

Hi Nihil, I don’t know if you still are needing this, but I’ve used the solution present in this project:
https://github.com/fbsamples/friendsmash-unity/blob/master/friendsmash_start/Assets/Scripts/MainMenu.cs

        #if UNITY_WEBPLAYER
        
        public Vector2 CanvasSize;                  // size of window on canvas
        
        // Execute javascript in iframe to keep the player centred
        string javaScript = @"
            window.onresize = function() {
              var unity = UnityObject2.instances[0].getUnity();
              var unityDiv = document.getElementById(""unityPlayerEmbed"");

              var width =  window.innerWidth;
              var height = window.innerHeight;

              var appWidth = " + CanvasSize.x + @";
              var appHeight = " + CanvasSize.y + @";

              unity.style.width = appWidth + ""px"";
              unity.style.height = appHeight + ""px"";

              unityDiv.style.marginLeft = (width - appWidth)/2 + ""px"";
              unityDiv.style.marginTop = (height - appHeight)/2 + ""px"";
              unityDiv.style.marginRight = (width - appWidth)/2 + ""px"";
              unityDiv.style.marginBottom = (height - appHeight)/2 + ""px"";
            }

            window.onresize(); // force it to resize now";
        Application.ExternalCall(javaScript);
        #endif
4

I’m working with the same issues. The code posted does work, but I’m wondering why doing something like this doesn’t work:

string javaScript = @"
window.onresize = function() {

var unity = UnityObject2.instances[0].getUnity();

var unityDiv = document.getElementById(""unityPlayerEmbed"");

var width =  window.innerWidth;
var height = window.innerHeight;

var appWidth = width;
var appHeight = Math.floor(width / 1.77);

unity.style.width = appWidth + ""px"";
unity.style.height = appHeight + ""px"";

unityDiv.style.marginLeft = (width - appWidth)/2 + ""px"";
unityDiv.style.marginTop = (height - appHeight)/2 + ""px"";
unityDiv.style.marginRight = (width - appWidth)/2 + ""px"";
unityDiv.style.marginBottom = (height - appHeight)/2 + ""px"";
}

I was looking for a way to maximize usable space while maintaining the aspect ratio. I’m not a JS coder normally so perhaps I’m just doing something simple wrong?