[READ-ONLY] Mirror of https://github.com/excaliburjs/sample-excalibird. Getting started example clone of Flappy Bird
excaliburjs.com/sample-excalibird/
excalibur
excaliburjs
sample
tweak readme
Erik Onarheim
(Sep 15, 2024, 3:48 PM -0500)
c0aa76f4
687b6925
+32
-6
+32
-6
readme.md
+32
-6
readme.md
···
106
106
107
107
At this point the screen will just be a solid color we picked as our `backgroundColor`.
108
108
109
+
We can add some css to our game to center it on the screen
110
+
111
+
```css
112
+
html,
113
+
body {
114
+
background-color: black;
115
+
margin: 0;
116
+
padding: 0;
117
+
height: 100%;
118
+
}
119
+
120
+
body {
121
+
display: flex;
122
+
justify-content: center;
123
+
align-items: center;
124
+
}
125
+
```
126
+
127
+
Then include this in your `index.html` in the `<head>` section
128
+
129
+
```html
130
+
<link rel="stylesheet" href="./src/style.css">
131
+
```
132
+
109
133
### Step 2 - Adding a Bird Actor
110
134
111
135
Next let's making our first Actor for the Bird and `.add()` it to the default Excalibur Scene which can be accessed off the `Engine`.
···
123
147
import * as ex from "excalibur";
124
148
125
149
export class Bird extends ex.Actor {
126
-
constructor({
127
-
pos: ex.vec(200, 300),
128
-
width: 16,
129
-
height: 16
130
-
color: ex.Color.Yellow
131
-
})
150
+
constructor() {
151
+
super({
152
+
pos: ex.vec(200, 300),
153
+
width: 16,
154
+
height: 16
155
+
color: ex.Color.Yellow
156
+
})
157
+
}
132
158
}
133
159
```
134
160