質問編集履歴

4

map0.tmxを公開しました

2018/01/27 16:46

投稿

l_h_l_h
l_h_l_h

スコア22

test CHANGED
File without changes
test CHANGED
@@ -60,7 +60,7 @@
60
60
 
61
61
  //読み込むファイルを指定する
62
62
 
63
- //tiled.files = ['map0.tmx'];
63
+ tiled.files = ['map0.tmx'];
64
64
 
65
65
  //複数のファイルの時は
66
66
 
@@ -280,6 +280,14 @@
280
280
 
281
281
 
282
282
 
283
+ map0.tmx
284
+
285
+ サイズ的に文字数制限に引っかかるためこちらの[アップローダ](https://ux.getuploader.com/code_tera/)に公開しました
286
+
287
+
288
+
289
+
290
+
283
291
  tiledMapLoaderも記載しようと思いましたが文字数制限に引っかかってしまうため、記載できませんでした
284
292
 
285
293
  参考としては、一番上で紹介した記事または[こちら](https://sites.google.com/site/tiledmaploader/)に個別でファイルが上がっています

3

ソースコードについての説明を加えました

2018/01/27 16:46

投稿

l_h_l_h
l_h_l_h

スコア22

test CHANGED
File without changes
test CHANGED
@@ -26,6 +26,10 @@
26
26
 
27
27
 
28
28
 
29
+ <index.html>
30
+
31
+ ブラウザ上にゲームを表示するファイルです
32
+
29
33
  ```
30
34
 
31
35
  <!DOCTYPE html>
@@ -90,6 +94,10 @@
90
94
 
91
95
 
92
96
 
97
+ <game.js>
98
+
99
+ ゲームを動かすメインのファイルです
100
+
93
101
  ```
94
102
 
95
103
  enchant();
@@ -266,6 +274,16 @@
266
274
 
267
275
 
268
276
 
269
- コード
277
+
270
-
278
+
271
- ```
279
+ ```
280
+
281
+
282
+
283
+ tiledMapLoaderも記載しようと思いましたが文字数制限に引っかかってしまうため、記載できませんでした
284
+
285
+ 参考としては、一番上で紹介した記事または[こちら](https://sites.google.com/site/tiledmaploader/)に個別でファイルが上がっています
286
+
287
+ 何かありましたらご要望お願いします
288
+
289
+ お手数ですがよろしくお願いいたします

2

ソースコードを掲載いたしました(一度に大量に掲載すると中々更新できなかったので複数回に分けております)

2018/01/26 15:13

投稿

l_h_l_h
l_h_l_h

スコア22

test CHANGED
File without changes
test CHANGED
@@ -87,3 +87,185 @@
87
87
  コード
88
88
 
89
89
  ```
90
+
91
+
92
+
93
+ ```
94
+
95
+ enchant();
96
+
97
+
98
+
99
+ window.onload = function() {
100
+
101
+ var game = new Game(320, 320);
102
+
103
+ game.fps = 15;
104
+
105
+ game.preload(tiled[0].image, 'chara0.gif');
106
+
107
+ game.onload = function() {
108
+
109
+ var map = new Map(tiled[0].map.tileheight, tiled[0].map.tilewidth);
110
+
111
+ map.image = game.assets[tiled[0].image];
112
+
113
+ map.loadData.apply(map, tiled[0].background);
114
+
115
+ map.collisionData = tiled[0].collision;
116
+
117
+
118
+
119
+ var foregroundMap = new Map(tiled[0].map.tileheight, tiled[0].map.tilewidth);
120
+
121
+ foregroundMap.image = game.assets[tiled[0].image];
122
+
123
+ foregroundMap.loadData.apply(foregroundMap, tiled[0].foreground);
124
+
125
+ var player = new Sprite(32, 32);
126
+
127
+ player.x = 6 * 16 - 8;
128
+
129
+ player.y = 10 * 16;
130
+
131
+ var image = new Surface(96, 128);
132
+
133
+ image.draw(game.assets['chara0.gif'], 0, 0, 96, 128, 0, 0, 96, 128);
134
+
135
+ player.image = image;
136
+
137
+
138
+
139
+ player.isMoving = false;
140
+
141
+ player.direction = 0;
142
+
143
+ player.walk = 1;
144
+
145
+ player.addEventListener('enterframe', function() {
146
+
147
+ this.frame = this.direction * 3 + this.walk;
148
+
149
+ if (this.isMoving) {
150
+
151
+ this.moveBy(this.vx, this.vy);
152
+
153
+
154
+
155
+ if (!(game.frame % 3)) {
156
+
157
+ this.walk++;
158
+
159
+ this.walk %= 3;
160
+
161
+ }
162
+
163
+ if ((this.vx && (this.x-8) % 16 == 0) || (this.vy && this.y % 16 == 0)) {
164
+
165
+ this.isMoving = false;
166
+
167
+ this.walk = 1;
168
+
169
+ }
170
+
171
+ } else {
172
+
173
+ this.vx = this.vy = 0;
174
+
175
+ if (game.input.left) {
176
+
177
+ this.direction = 1;
178
+
179
+ this.vx = -4;
180
+
181
+ } else if (game.input.right) {
182
+
183
+ this.direction = 2;
184
+
185
+ this.vx = 4;
186
+
187
+ } else if (game.input.up) {
188
+
189
+ this.direction = 3;
190
+
191
+ this.vy = -4;
192
+
193
+ } else if (game.input.down) {
194
+
195
+ this.direction = 0;
196
+
197
+ this.vy = 4;
198
+
199
+ }
200
+
201
+ if (this.vx || this.vy) {
202
+
203
+ var x = this.x + (this.vx ? this.vx / Math.abs(this.vx) * 16 : 0) + 16;
204
+
205
+ var y = this.y + (this.vy ? this.vy / Math.abs(this.vy) * 16 : 0) + 16;
206
+
207
+ if (0 <= x && x < map.width && 0 <= y && y < map.height && !map.hitTest(x, y)) {
208
+
209
+ this.isMoving = true;
210
+
211
+ arguments.callee.call(this);
212
+
213
+ }
214
+
215
+ }
216
+
217
+ }
218
+
219
+ });
220
+
221
+
222
+
223
+ var stage = new Group();
224
+
225
+ stage.addChild(map);
226
+
227
+ stage.addChild(player);
228
+
229
+ stage.addChild(foregroundMap);
230
+
231
+ game.rootScene.addChild(stage);
232
+
233
+
234
+
235
+ var pad = new Pad();
236
+
237
+ pad.x = 0;
238
+
239
+ pad.y = 220;
240
+
241
+ game.rootScene.addChild(pad);
242
+
243
+
244
+
245
+ game.rootScene.addEventListener('enterframe', function(e) {
246
+
247
+ var x = Math.min((game.width - 16) / 2 - player.x, 0);
248
+
249
+ var y = Math.min((game.height - 16) / 2 - player.y, 0);
250
+
251
+ x = Math.max(game.width, x + map.width) - map.width;
252
+
253
+ y = Math.max(game.height, y + map.height) - map.height;
254
+
255
+ stage.x = x;
256
+
257
+ stage.y = y;
258
+
259
+ });
260
+
261
+ };
262
+
263
+ game.start();
264
+
265
+ };
266
+
267
+
268
+
269
+ コード
270
+
271
+ ```

1

ソースコードを掲載いたしました(複数回に分けて行います)

2018/01/26 15:06

投稿

l_h_l_h
l_h_l_h

スコア22

test CHANGED
File without changes
test CHANGED
@@ -23,3 +23,67 @@
23
23
  tilelMapLoader.jsというファイルがどのように動いているのか、全く読み解けないので、どなたかご助力いただけないでしょうか
24
24
 
25
25
  よろしくお願いいたします
26
+
27
+
28
+
29
+ ```
30
+
31
+ <!DOCTYPE html>
32
+
33
+ <html>
34
+
35
+ <head>
36
+
37
+ <meta charset="utf-8">
38
+
39
+ <meta name="viewport" content="width=device-width, user-scalable=no">
40
+
41
+ <meta name="apple-mobile-web-app-capable" content="yes">
42
+
43
+ <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
44
+
45
+ <title>enchant</title>
46
+
47
+ <script type="text/javascript" src="enchant.js"></script>
48
+
49
+ <script type="text/javascript" src="ui.enchant.js"></script>
50
+
51
+ <script type="text/javascript" src="game.js"></script>
52
+
53
+ <script type="text/javascript" src="tiledMapLoader.js"></script>
54
+
55
+ <script type="text/javascript">
56
+
57
+ //読み込むファイルを指定する
58
+
59
+ //tiled.files = ['map0.tmx'];
60
+
61
+ //複数のファイルの時は
62
+
63
+ //tiled.files = ['map0.tmx','map1.tmx','map2.tmx'];
64
+
65
+ </script>
66
+
67
+ <style type="text/css">
68
+
69
+ body {
70
+
71
+ margin: 0;
72
+
73
+ }
74
+
75
+ </style>
76
+
77
+ </head>
78
+
79
+ <body>
80
+
81
+ </body>
82
+
83
+ </html>
84
+
85
+
86
+
87
+ コード
88
+
89
+ ```