微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

我如何使画布完全适合 p5 中的窗口大小

如何解决我如何使画布完全适合 p5 中的窗口大小

我想让 p5 画布完全适合窗口大小,但是每当我使用 windowWidth 和 windowHeight 时,画布似乎更大:

The canvas stretches outside

有什么办法可以解决这个问题吗?

解决方法

您需要使用 CSS 关闭 <html><body> 标记的边距和内边距(这将移除画布周围的白色边框),并关闭垂直滚动条。

此外,如果有人更改了窗口的大小,您会想要处理它,这可以通过 windowResized event 轻松完成。

function setup() {
  createCanvas(windowWidth,windowHeight);
}

function draw() {
  background(200);
}

function windowResized() {
  resizeCanvas(windowWidth,windowHeight);
}
html,body {
  margin: 0;
  padding: 0;
  overflow: hidden;
}
<script src="https://cdn.jsdelivr.net/npm/p5@1.3.1/lib/p5.min.js"></script>

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


Selenium Web驱动程序和Java。元素在(x,y)点处不可单击。其他元素将获得点击?
Python-如何使用点“。” 访问字典成员?
Java 字符串是不可变的。到底是什么意思?
Java中的“ final”关键字如何工作?(我仍然可以修改对象。)
“loop:”在Java代码中。这是什么,为什么要编译?
java.lang.ClassNotFoundException:sun.jdbc.odbc.JdbcOdbcDriver发生异常。为什么?
这是用Java进行XML解析的最佳库。
Java的PriorityQueue的内置迭代器不会以任何特定顺序遍历数据结构。为什么?
如何在Java中聆听按键时移动图像。
Java“Program to an interface”。这是什么意思?