Игра с Blend4web
19 мая 2017 15:49
Здравствуйте, посмотрев Ваш урок по созданию простой игры с Blend4web в ютубе, сделал все тоже самое, и браузер настроен на загрузку локальных ресурсов. Все файлы есть в рабочей папке: движок b4w.min.js; app.js; uranium.js; .json и .bin файлы. Но сцены не видно в браузере. А вот код html и js файла:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<script type="text/javascript" src="b4w.min.js"></script>
<script type="text/javascript" src="app.js"></script>
<script type="text/javascript" src="game_example.js"></script>
<style>
body {
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<div id="canvas3d"></div>
</body>
</html>
"use strict"
if (b4w.module_check("game_example_main"))
throw "Failed to register module: game_example_main";
b4w.register("game_example_main", function(exports, require) {
var m_anim = require("animation");
var m_app = require("app");
var m_main = require("main");
var m_data = require("data");
var m_ctl = require("controls");
var m_phy = require("physics");
var m_cons = require("constraints");
var m_scs = require("scenes");
var m_trans = require("transform");
var m_cfg = require("config");
var _character = null;
var _character_rig = null;
var ROT_SPEED = 1.5;
var CAMERA_OFFSET = new Float32Array([0, 1.5, -4]);
exports.init = function() {
m_app.init({
canvas_container_id: "canvas3d",
callback: init_cb,
physics_enabled: true,
show_fps: true,
alpha: false,
physics_uranium_path: "uranium.js"
});
}
function init_cb(canvas_elem, success) {
if (!success) {
console.log("b4w init failure");
return;
}
m_app.enable_controls(canvas_elem);
window.onresize = on_resize;
on_resize();
load();
}
function on_resize() {
var w = window.innerWidth;
var h = window.innerHeight;
m_main.resize(w, h);
};
function load() {
m_data.load("game_example.json", load_cb);
}
function load_cb(data_id) {
}
function setup_movement() {
}
function setup_rotation() {
}
function setup_jumping() {
}
function setup_camera() {
}
});
b4w.require("game_example_main").init();
Все никак не могу догнать что не так. Нужен локальный сервер для этого или нужно файлы сохранять в определенной директории? Уже ни один день мучаюсь. Был бы очень признателен, если бы подсказали, что не так. Заранее Спасибо!
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<script type="text/javascript" src="b4w.min.js"></script>
<script type="text/javascript" src="app.js"></script>
<script type="text/javascript" src="game_example.js"></script>
<style>
body {
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<div id="canvas3d"></div>
</body>
</html>
"use strict"
if (b4w.module_check("game_example_main"))
throw "Failed to register module: game_example_main";
b4w.register("game_example_main", function(exports, require) {
var m_anim = require("animation");
var m_app = require("app");
var m_main = require("main");
var m_data = require("data");
var m_ctl = require("controls");
var m_phy = require("physics");
var m_cons = require("constraints");
var m_scs = require("scenes");
var m_trans = require("transform");
var m_cfg = require("config");
var _character = null;
var _character_rig = null;
var ROT_SPEED = 1.5;
var CAMERA_OFFSET = new Float32Array([0, 1.5, -4]);
exports.init = function() {
m_app.init({
canvas_container_id: "canvas3d",
callback: init_cb,
physics_enabled: true,
show_fps: true,
alpha: false,
physics_uranium_path: "uranium.js"
});
}
function init_cb(canvas_elem, success) {
if (!success) {
console.log("b4w init failure");
return;
}
m_app.enable_controls(canvas_elem);
window.onresize = on_resize;
on_resize();
load();
}
function on_resize() {
var w = window.innerWidth;
var h = window.innerHeight;
m_main.resize(w, h);
};
function load() {
m_data.load("game_example.json", load_cb);
}
function load_cb(data_id) {
}
function setup_movement() {
}
function setup_rotation() {
}
function setup_jumping() {
}
function setup_camera() {
}
});
b4w.require("game_example_main").init();
Все никак не могу догнать что не так. Нужен локальный сервер для этого или нужно файлы сохранять в определенной директории? Уже ни один день мучаюсь. Был бы очень признателен, если бы подсказали, что не так. Заранее Спасибо!
19 мая 2017 19:05
А в консоле браузера что пишется? (открывается по f12)
Инди-разработчик игр, фанат Blender
http://prandgames.com
http://prandgames.com
19 мая 2017 19:12
Здравствуйте, видео старое, поэтому на текущей версии движка будут ошибки - ряд вещей делается уже совсем не так, как раньше. Вообще для создания приложений лучше пользоваться менеджером проектов. Вот здесь есть пример: Создание интерактивного веб-приложения.
Как создадите проект, там уже будет шаблонный код в главном js-модуле. Надо будет только настроить сцену и персонажа на ней, настройка описана здесь: Персонажи.
В коде достаточно будет в функции load_cb() поменять строчку m_app.enable_camera_controls(); на m_fps.enable_fps_controls(); предварительно подключив модуль fps в начале:
Подробнее про API персонажа: Управление персонажем с помощью API.
Ещё в составе SDK есть пример приложения с локацией, персонажем и базовой физикой. Скрипты находятся внутри SDK по пути ./apps_dev/tutorials/firstperson/, а blend-файлы - ./blender/tutorials/firstperson/ - можете глянуть как пример.
Как создадите проект, там уже будет шаблонный код в главном js-модуле. Надо будет только настроить сцену и персонажа на ней, настройка описана здесь: Персонажи.
В коде достаточно будет в функции load_cb() поменять строчку m_app.enable_camera_controls(); на m_fps.enable_fps_controls(); предварительно подключив модуль fps в начале:
var m_fps = require("fps");
Подробнее про API персонажа: Управление персонажем с помощью API.
Ещё в составе SDK есть пример приложения с локацией, персонажем и базовой физикой. Скрипты находятся внутри SDK по пути ./apps_dev/tutorials/firstperson/, а blend-файлы - ./blender/tutorials/firstperson/ - можете глянуть как пример.
31 мая 2017 00:06
Большое Спасибо еще раз! Не подскажете, как сделать в игре от первого лица такие функции, к примеру: чтобы дверь открывалась при нажатии определенной клавиши или чтобы персонаж при нажатии клавиши мог взять определенный предмет и бросить его?
01 июня 2017 18:43
Здравствуйте.
Могу предложить несколько решений (если вы программист):
1) Использовать ray сенсор, который будет "выстреливать" луч из камеры.
2) Создать в Blender'e физический параллелепипед перед камерой, сделать камеру родителем параллелепипеда. Использовать collision сенсор для того, чтобы определять столкновение параллелепипеда с дверью.
Могу предложить несколько решений (если вы программист):
1) Использовать ray сенсор, который будет "выстреливать" луч из камеры.
2) Создать в Blender'e физический параллелепипед перед камерой, сделать камеру родителем параллелепипеда. Использовать collision сенсор для того, чтобы определять столкновение параллелепипеда с дверью.
Команда Blend4Web
kirill@blend4web.com
kirill@blend4web.com
19 июня 2017 04:45
Здравствуйте еще раз.
Как вы мне и посоветовали использовал ray сенсор. Сперва сделал анимацию на дверь, чтобы она воспроизводилась и в свою очередь открывалась при нажатии кнопки мыши. Все вроде не плохо, но хотелось бы чуть улучшить, а именно чтоб он при наведение курсора на дверь и при нажатии на кнопку анимация возвращалась к первоначальному положению, а не просто при нажатии, как у меня. И не подскажете, как воспроизводились две анимации при нажатии на объект, к примеру нажимаю на дверь, начиналась анимация двери, и дверной ручки. В Блендере я уже сделал дверь родителем дверной ручки.
Вот код:
…
function load_cb(data_id, success) {
if (!success) {
console.log("b4w load failure");
return;
}
//m_app.enable_camera_controls();
m_fps.enable_fps_controls();
// place your code here
var canvas_elem = m_cont.get_canvas();
canvas_elem.addEventListener("mousedown", main_canvas_click, false);
}
function click(e) {
if (e.preventDefault)
e.preventDefault();
var x = m_mouse.get_coords_x(e);
var y = m_mouse.get_coords_y(e);
var obj = m_scenes.pick_object(x, y);
if (obj) {
m_anim.apply_def(obj);
m_anim.play(obj);
}
else {
m_anim.set_frame(_previous_selected_obj, 0);
}
_previous_selected_obj = obj;
}
exports.create_ray_sensor = function(obj_src, from, to, collision_id,
is_binary_value, calc_pos_norm, ign_src_rot) {
if (obj_src && !m_phy.obj_has_physics(obj_src)) {
m_print.error_once("No physics for object " + obj_src.name);
return;
}
collision_id = collision_id || "ANY";
is_binary_value = is_binary_value || false;
calc_pos_norm = calc_pos_norm || false;
ign_src_rot = ign_src_rot || false;
return m_ctl.create_ray_sensor(obj_src, from, to, collision_id, is_binary_value,
calc_pos_norm, ign_src_rot);
}
});
// import the app module and start the app by calling the init method
b4w.require("mein_spiel_main").init();
И еще последний вопрос. Если я хочу, чтоб мой персонаж, когда он подходит к определенному предмету, мог поднимать при нажатии на кнопку "K", к примеру, и при повторном нажатии он мог этот предмет бросить на определенное расстояние, нужно на все эти объекты делать анимацию? Или как? Подскажите пожалуйста. Если можно еще код этой функции.
Спасибо за Вашу помошь!
Как вы мне и посоветовали использовал ray сенсор. Сперва сделал анимацию на дверь, чтобы она воспроизводилась и в свою очередь открывалась при нажатии кнопки мыши. Все вроде не плохо, но хотелось бы чуть улучшить, а именно чтоб он при наведение курсора на дверь и при нажатии на кнопку анимация возвращалась к первоначальному положению, а не просто при нажатии, как у меня. И не подскажете, как воспроизводились две анимации при нажатии на объект, к примеру нажимаю на дверь, начиналась анимация двери, и дверной ручки. В Блендере я уже сделал дверь родителем дверной ручки.
Вот код:
…
function load_cb(data_id, success) {
if (!success) {
console.log("b4w load failure");
return;
}
//m_app.enable_camera_controls();
m_fps.enable_fps_controls();
// place your code here
var canvas_elem = m_cont.get_canvas();
canvas_elem.addEventListener("mousedown", main_canvas_click, false);
}
function click(e) {
if (e.preventDefault)
e.preventDefault();
var x = m_mouse.get_coords_x(e);
var y = m_mouse.get_coords_y(e);
var obj = m_scenes.pick_object(x, y);
if (obj) {
m_anim.apply_def(obj);
m_anim.play(obj);
}
else {
m_anim.set_frame(_previous_selected_obj, 0);
}
_previous_selected_obj = obj;
}
exports.create_ray_sensor = function(obj_src, from, to, collision_id,
is_binary_value, calc_pos_norm, ign_src_rot) {
if (obj_src && !m_phy.obj_has_physics(obj_src)) {
m_print.error_once("No physics for object " + obj_src.name);
return;
}
collision_id = collision_id || "ANY";
is_binary_value = is_binary_value || false;
calc_pos_norm = calc_pos_norm || false;
ign_src_rot = ign_src_rot || false;
return m_ctl.create_ray_sensor(obj_src, from, to, collision_id, is_binary_value,
calc_pos_norm, ign_src_rot);
}
});
// import the app module and start the app by calling the init method
b4w.require("mein_spiel_main").init();
И еще последний вопрос. Если я хочу, чтоб мой персонаж, когда он подходит к определенному предмету, мог поднимать при нажатии на кнопку "K", к примеру, и при повторном нажатии он мог этот предмет бросить на определенное расстояние, нужно на все эти объекты делать анимацию? Или как? Подскажите пожалуйста. Если можно еще код этой функции.
Спасибо за Вашу помошь!
