This tutorial is set by the author's setting without permission.

This mod has a more detailed tutorial on GitHub, but most people may not understand it, so I will explain it.

The MOD has a lot of functions. I only introduce custom background, progress bar, and read numbers.

It is recommended to use Resource Loader. Similarly, this tutorial is also based on the MOD.

The final effect is shown in the figure:

Step 1: Modify the original plan

Find the CUSTMLOADINGSCREEN.CFG file under the config file, change the S: Screen_config value to the type available for RL.

Step 2: Define the production material

Find the ResourceS folder in the .minecraft folder. If there is no folder, please build one.

The new folder is named CustomLoadingscreen.

Then create three new folders, which are config, image, and word.

Since then, a folder has been built in Config and Image, which is called BX (according to previous example formats).

Create a new Custom.json in the Config/BX folder and place the following code.

 {{

"Renders": [
"Bx/bg",
"BX/BAR_DOWN",
"BX/BAR_UP",
"BX/JDT"
],,,
"Variables": {
},
"Functions": [],,,
"Factories": [[
],,,
"Actions": []
} 

Among them, the values ​​in renders are all pictures to be used (stored in images), which is named BG (background map), BAR_DOWN

bar_up (upper layer of progress bar, blue gradient), JDT (percentage text).

Step 3: Make custom materials

You can use a variety of production software to make the effect you want, and explain the source of the elements of this picture.

Background: Light and Shadow in the game screenshot.

Progressbook bottom and top: Made at Photoshop, try to use gradients.

Percent number: ASCII code watch.

Step 4: Add applications to these four materials

Put the four pictures (only PNG format) in the Image/BX folder, and recommend JSON text with corresponding names, such as: BG.JSON

Then enter the following code (background map):

 {{

"Parent": "Builtin/Image",
"Image": "CustomLoadingscreen: Image/BX/BG.Png",,
"POSITION_TYPE": "Center", "Offset_pos": "Center",
"Position": {
"X": "0",
"Y": "0",
"Width": "Screen_width+1",
"Height": "Screen_height+1"
},
"Texture": {
"X": "0",
"Y": "0",
"Width": "1",
"Height": "1"
}
} 

Among them, pay attention to the path, location, and size adjustment.

Try to use this code in progress: (Of course you can adjust the location, a certain size adjustment)

 {{

"Parent": "Builtin/Image",
"Image": "CustomLoadingscreen: Image/BX/JDT.PNG",,
"POSITION_TYPE": "Center", "Center",
"Offset_pos": "Center", "Center",
"Position": {
"X": "-Screen_width*0.4+Percentage*Screen_width*0.4",
"Y": "Screen_height*0.2-12", "Width": "Percentage*Screen_width*0.8",
"Height": "4"
},
"Texture": {
"X": "0",
"Y": "0",
"Width": "Percentage",
"Height": "2"
}
} 

For loading percentage numbers, try using the following code:

 {{

"Parent": "Builtin/Text",
"Image": "CUSTMLOADINGSCREEN: WORD/ASCII.png",
"POSITION_TYPE": "Center", "Center",
"Offset_pos": "Center", "Center",
"Text": "(Floor (Percentage*100))+'.'+(Floor (Percentage*1000)%10)+'%'",
"Position": {
"X": "0",
"Y": "Screen_height*0.3-20",
"Width": "0", "height": "0"
},
"Color": "0xfffffffff"
} 

Note: ASCII.Png is the corresponding character table (this tutorial is placed in a WORD folder), which can be generated on the website.

Now, you should have 3 PNG files and 4 JSON files in your image file. You can do it. Enter the game test effect!