Skip to content

Commit

Permalink
Merge pull request #67 from bytestring-net/dev
Browse files Browse the repository at this point in the history
Worldspace UI docs
  • Loading branch information
IDEDARY authored Aug 29, 2024
2 parents 00d7706 + 046162c commit 8ba2597
Show file tree
Hide file tree
Showing 4 changed files with 29 additions and 4 deletions.
2 changes: 1 addition & 1 deletion .vscode/tasks.json
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
{
"type": "cargo",
"command": "run",
"args": ["--bin", "mesh2d"],
"args": ["--bin", "worldspace"],
"problemMatcher": [
"$rustc"
],
Expand Down
2 changes: 1 addition & 1 deletion docs/src/SUMMARY.md
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@
- [Animation](advanced/animation.md)
- [2D & 3D](advanced/2d_and_3d.md)
- [Worldspace UI](advanced/worldspace_ui.md)
- [Custom rendering](advanced/rendering.md)
- [Custom rendering]()

-----------

Expand Down
29 changes: 27 additions & 2 deletions docs/src/advanced/worldspace_ui.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,30 @@
# Worldspace UI

For now you can look at [worldspace example](https://github.com/bytestring-net/bevy_lunex/tree/main/examples/worldspace) on GitHub.
Lunex in its entirety is built in worldspace.
This means every UI element is bound to a place in the game world.

You don't realize that, because when we are making a 2D game UI, we attach our UI to the Camera.

If we wish for our UI to be spawned at fixed place in the world, then just spawn it as normal entity.
This can be usefull for example if you want to create in-game displays, holograms and such.

![worldspace](../images/worldspace.png)

### Images

For 3D images, you can take a look at this example: [worldspace example](https://github.com/bytestring-net/bevy_lunex/tree/main/examples/worldspace). You can use the built-in abstraction which just hides the fact that all what we are really doing is creating a material with our texture and then attaching it onto a plane.

### Text

3D text is currently limited and you have to use a 3rd party crate `bevy_mod_billboard`. You can take a look at how integrate it here: [worldspace text example](https://github.com/bytestring-net/bevy_lunex/tree/main/examples/worldspace_text)

### Important

When we are spawning a 3D hologram, we don't want the size to be the size of our camera, but some custom fixed size.
You can achieve that by specifying the size in the `Dimension` component on `UiTreeBundle` when we are spawning our tree.
If you don't do that, your UI size will default to 0 and you won't see anything if you use `Rl` units.

Another fact to consider is `abs_scale`. If you use `UiTree::new2d`, then the abs_scale is 1. But if you use `UiTree::new3d` then the abs_scale becoms `0.001`. This is to create a sensible balance between sizes when going from 2d to 3d.

Reason for that is, that in 2D Bevy, `1.0` in `Transform` corresponds to 1 pixel on screen. But in 3D Bevy, `1.0` means `1 meter`. You can now see the problem. To make things easier to use, I decided that when you are working with 3D UI in Lunex, all `Ab` units are in **`centimeters`**.

*Coming soon...*
Binary file added docs/src/images/worldspace.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.

0 comments on commit 8ba2597

Please sign in to comment.