4

好的,所以我有这个网格,我想要全屏并在分辨率的完整空间内绘制。

但我不能让它注册超过屏幕的 2/3 三分之二。

CanvasElement里面有一个自制的Grid班。当您按下按钮时,网格应通过以下方法全屏显示:

void fullScreenRequest(){      
  document.onFullscreenChange.listen(grid.handleFullScreen());
  grid.requestFullscreen();      
}

这会在内部触发这些方法Grid

void requestFullscreen(){       
   canvas.requestFullscreen();       
}

void handleFullScreen(){              
   window.setImmediate(() {         
       canvas.width = (canvas.parent as Element).client.width;
       canvas.height = (canvas.parent as Element).client.height;         

       canvasWidth = canvas.width;
       canvasHeight = canvas.height;        
   });       
 }

在绘制网格的内容时,我使用canvasWidthcanvasHeight作为基础。如何让这些值成为屏幕的全分辨率?

4

3 回答 3

2

只需在回调中获取窗口大小:

canvas.width = window.innerWidth; // Or window.screen.available.width
canvas.height = window.innerHeight;
canvas.style.position = 'absolute'; // If you need
于 2013-06-29T10:51:29.467 回答
0

你可以试试这个

:-webkit-full-screen #CanvasElement {
  width: 100%;
  height: 100%;
}

按照这里的建议

于 2013-06-28T00:43:37.050 回答
0

我用这个:

original_width = canvas.width;
original_height = canvas.height;
canvas.onFullscreenChange.listen( (t){
  if( canvas == document.fullscreenElement ){
    canvas.width = window.screen.width;
    canvas.height = window.screen.height;
  }
  else{
    canvas.width = original_width;
    canvas.height = original_height;
  }
} );

document.fullscreenElement返回当前全屏的元素,用于在再次退出全屏时恢复大小。

window.screen.height返回全屏高度,而window.screen.available.height返回屏幕高度,不包括桌面环境中为任务栏和类似空间保留的空间。不要使用后者,也不要使用您在网络上找到的许多解决方案,如document.body.clientHeightcanvas.offsetHeight等,它们不会提供您想要的大小。

于 2014-03-16T13:40:43.777 回答