Add Quickstart
42
Quickstart.md
Normal file
42
Quickstart.md
Normal file
@@ -0,0 +1,42 @@
|
|||||||
|
To add PyCanvas into your application with skulpt, just add the following to the top of your builtInRead() function:
|
||||||
|
```javascript
|
||||||
|
if (x === 'screen' || x === './screen.js') {
|
||||||
|
const url = new URL('screen.js', window.location.href).href;
|
||||||
|
const xhr = new XMLHttpRequest();
|
||||||
|
xhr.open("GET", url, false);
|
||||||
|
xhr.send();
|
||||||
|
if (xhr.status === 200) return xhr.responseText;
|
||||||
|
else throw "Could not load screen.js";
|
||||||
|
}
|
||||||
|
```
|
||||||
|
Now set these variables when you run your code:
|
||||||
|
```javascript
|
||||||
|
const canvas = document.getElementById('canvas');
|
||||||
|
const container = document.getElementById('preview-container');
|
||||||
|
if (canvas && container) {
|
||||||
|
const w = Math.floor(container.clientWidth);
|
||||||
|
const h = Math.floor(container.clientHeight);
|
||||||
|
canvas.width = w;
|
||||||
|
canvas.height = h;
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
And create a canvas with the id `canvas` inside a div with the id `preview-container`.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
To create a basic application, define your functions and pass them to s.start() in a dictionary:
|
||||||
|
|
||||||
|
```python
|
||||||
|
import screen as s
|
||||||
|
|
||||||
|
def draw():
|
||||||
|
s.cls(0)
|
||||||
|
s.text(s.CENTERX, s.CENTERY, "Hello World", 7)
|
||||||
|
|
||||||
|
s.start({
|
||||||
|
"loop": {
|
||||||
|
"draw": draw
|
||||||
|
}
|
||||||
|
})
|
||||||
|
```
|
||||||
Reference in New Issue
Block a user