HTML5 游戏(画布)- UI 技术? [英] HTML5 Game (Canvas) - UI Techniques?

查看:21
本文介绍了HTML5 游戏(画布)- UI 技术?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用 PhoneGap 为移动设备(Android/iPhone/WebOS)构建 JavaScript/HTML5 游戏(使用 Canvas).我目前正在尝试设计 UI 和游戏板应该如何构建以及它们应该如何交互,但我不确定最好的解决方案是什么.这是我能想到的 -

I'm in the process of building a JavaScript / HTML5 game (using Canvas) for mobile (Android / iPhone/ WebOS) with PhoneGap. I'm currently trying to design out how the UI and playing board should be built and how they should interact but I'm not sure what the best solution is. Here's what I can think of -

  1. 使用诸如 drawImage 和 fillText 之类的东西将 UI 直接构建到画布中
  2. 使用常规 DOM 对象在画布之外构建部分 UI,然后在 UI 元素需要与游戏板画布重叠时在画布上浮动一个 div.

是否还有其他我没有想到的可用于构建游戏 UI 的技术?另外,哪些会被认为是标准"方式(我知道 HTML5 游戏不是很受欢迎,所以可能还没有标准"方式)?最后,您会推荐/使用哪种方式?

Are there any other possible techniques I can use for building the game UI that I haven't thought of? Also, which of these would be considered the "standard" way (I know HTML5 games are not very popular so there probably isn't a "standard" way yet)? And finally, which way would YOU recommend / use?

非常感谢!

编辑

我已将此问题移至 gamedev.stackoverflow.com.您可以在此处找到新问题:https://gamedev.stackexchange.com/questions/7090/html5-game-canvas-ui-techniques/7115#7115

I've moved this question over to gamedev.stackoverflow.com. You can find the new question here: https://gamedev.stackexchange.com/questions/7090/html5-game-canvas-ui-techniques/7115#7115

推荐答案

我不认为有一个标准".这在很大程度上取决于您的用户界面.我认为在大多数情况下使用 DOM 元素更好,因为您不需要自己构建所有 UI 组件、事件等.它们可以使用 CSS 设置样式以实现所需的外观.如果这还不够,您可能需要自己构建界面元素,但您应该确保确实需要这样做.推出自己的解决方案可能需要大量的工作.

I do not think that there is a "standard" for this. It highly depends on your UI. I think using the DOM elements is better in most cases, since you do not need to build all of the UI components, events, etc. yourself. They can be styled with CSS to achieve the desired look. If this is not enough, you'll probably need to build the interface elements yourself, but you should make sure that this is really needed. It is probably a huge amount of work to roll your own solution.

这篇关于HTML5 游戏(画布)- UI 技术?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆