UI Basics (Elements, Namespaces, Controls, Types, and More!) - Resource Pack Tutorial

Today, I introduce you to the wild world of Minecraft: Bedrock Edition's JSON UI. Enjoy!

Timestamps:
0:00 - Intro
1:10 - UI Files
1:32 - Namespace
1:52 - Elements
2:32 - The Element Hierarchy
3:36 - Phrases
4:25 - "Controls" Property
5:12 - @ Copying
5:54 - Example File
7:24 - "Type" Property
9:08 - Outro

Xbox Club: AgentMindStorm Club

[highoncatnip_]

FINALLY! I want to make an addon that lets horses go faster when you put a food item it likes in a NEW slot!

[LukasPAH]

I am now a pro at JSON UI, thanks AgentMindStorm!

In all seriousness this is a great place for beginners to start. Looking forward to the future tutorials and where you decide to take this series. Nice job!

[multimc]

Bro, are you an angel? I was searching for a tutorial for weeks!!

[highoncatnip_]

honestly, this feels like it deserves that gravity falls reference
"Whatever it is I'll understand"
"There is _NOTHING_ about this i understand!"

[MariusLoYT]

OMG I WAITED FOR SO LONG FINALLY I CAN FINISH MY PROJET

[highoncatnip_]

Hi, AgentMindStorm! So apparently (according to bedrock wiki) theyre depreciating JSON ui in favor of Ore UI. theres no vids out on it at all! Can you make a tutorial, or am i gonna have to learn this myself?

[kimandmarydavis]

Here's how to make animated ui textures:

Add these properties to the element that controls the texture that you want to animate:
"uv": This property refers to another element that contains the properties required for the animation. To set this property, refer to "The format used to set a property that refers to another element".
"uv_size": Imagine there's an invisible box in the image, and only the parts of the image inside the box are displayed in the game. This property tells the game how big the box should be. This property uses x and y. To set this property, refer to "The format used to set a property that uses x and y".
"disable_anim_fast_forward": When this property is set to true, the game cannot speed up the animation. When this property is set to false, the game can speed up the animation.

Make another element and add these properties to it:
"type": set this to "animation"
"anim_type": "set this to "flipbook"
"initial_uv": Imagine there's an invisible box in the image, and only the parts of the image inside the box are displayed in the game. This property tells the game where the top-left corner of the box is. This property uses x and y. To set this property, refer to "The format used to set a property that uses x and y".
"frame_count": This tells the game how many frames are in the animation.
"frame_step": Imagine there's an invisible box in the image, and only the parts of the image inside the box are displayed in the game. This property tells the game how many pixels to move the box to the right after the previous frame is finished.
"fps": This tells the game how many frames it should display in one second.
"reversible": This tells the game if it should play the animation in reverse after the animation finishes.
"easing": set this to "linear"

Example:
"animation_control": {
"anim_type": "flip_book",
"initial_uv": [ 0, 0 ],
"frame_count": 10,
"frame_step": 8,
"fps": 10,
"easing": "linear"
},

"animated_texture": {
"type": "image",
"texture": "textures/ui/animated_texture",
"uv_size": [ 8, 8 ],
}

When creating the texture:
-The frames of the animation should be arranged horizontally.
-Measure the size of each frame of the animation, because you will need this information to set "uv_size" and "frame_step".
-Find out how many frames are in the animation, because you will need this information to set "frame_count".

The format used to set a property that uses x and y: [ x, y ]
The format used to set a property that refers to another element: Add the "@" symbol, then put the file's namespace, then add a dot, and then put the name of the element you want to use.

[dodatkidominecrafta]

This intro is beautiful. I know that feeling perfectly well, when I do something in bedrock editon and all of a sudden it doesn't work and then looking for why it doesn't work...

[dylanupton]

Thanks for getting this info out there in such a digestible way! Can't wait for the next part :)

[risen]

topic is so easy to understand, great work :)

[Luciano.badilla]

Hello, I have created a custom interface for a block with buttons, and I would like to know if it is possible to run game commands with those buttons, the only thing that I have achieved is to put images, labels, and sounds, I am desperate I can not move forward.

[punctdan]

I do everything in this video, yet nothing at all changes in the game UI... Is there something I need to add to the pack that activates modification of UI?

[Light]

Thank You!!! This Is Exactly What I Needed To Make My Pack Work!!!

[asher_]

How do I move the buttons on the main screen? Plss tell me

[justinrespeto]

Um can you make buttons on the staritng menu if you do can you teach me how to do

[CrxzyYT]

how would i create a button that opens a popup dialogue that will show information like credits, and bugs. I want to add a button to my start screen that opens a scrolling panel that contains the text. JSON UI has like no information about it when it comes to MCBE.

[UserSOF]

sorry my English is not that good
i would like to know can you change the places of the buttons you use in MCPE to move ... by editing resorse pack files

[unknown-]

Just need a little help, how do i have a hover text on buttons ?

[yeasinanzamrifat]

I was searching for a tutorial like this and I got this. Can't wait for the next part.

BTW subs for you.👍🏻

[joaololpvp]

Is there any way I can create the same button with different textures, for example I added a button in the furnace, so in the blast furnace it has the same button with another texture, is there a way to do this?