feat: Custom HUD, Native Theme Support and Mixing Components and Wallpapers
Theme Sytem
Drawing Support
- [x] Web Drawer
- [x] Native Drawer
- [x] Drawer Reference System
Component Overlay
- [x] Component Standards
- [x] Component Factory
- [x] Editor Boundaries Support
- [x] Creation and Deletion of Components via Rest API
- [ ] Serializing and Deserializing Components from Disk
Editor (Assign @SenkJu)
- [x] Dragging Components
- [ ] Managment Panel
- [ ] Component Editor (Settings)
Wallpaper
- [x] Drawing (supports .png, .frag)
- [x] Selection via Rest API
LiquidBounce Theme
Generic Theme (Native)
- [x] Native Theme System
- [ ] Standarised Design
- [ ] Title Screen
- [ ] Alt Manager
- [ ] Proxy Manager
- [ ] Click GUI
get detekted
get detekted
If detekt complaints, the code probably sucks ;)
get detekted
If detekt complaints, the code probably sucks ;)
:fire:
get detekted
If detekt complaints, the code probably sucks ;)
detekt will complain at any code, no matter who writes it. one time detekt just shouted at me because i didn't make 17 new lines for this one really easy to use function.
get detekted
If detekt complaints, the code probably sucks ;)
detekt will complain at any code, no matter who writes it. one time detekt just shouted at me because i didn't make 17 new lines for this one really easy to use function.
stop dickriding izuna
get detekted
If detekt complaints, the code probably sucks ;)
detekt will complain at any code, no matter who writes it. one time detekt just shouted at me because i didn't make 17 new lines for this one really easy to use function.
stop dickriding izuna
"Draft", yk that?
@liquidsquid1
detekt will complain at any code, no matter who writes it. one time detekt just shouted at me because i didn't make 17 new lines for this one really easy to use function.
Detekt will give you warnings about symptoms of bad code style (= code smells). 99% of the complaints are legit - even though we only care about 95% because the rest is just too minor. I added it to prevent people from writing code like this which might work great but is a pain to understand and debug. I know it is annoying, but it works The number of if statements with 6 conditions, lines longer than the line limit, 4x nested loops and functions longer than two screens went down drastically.
get detekted
If detekt complaints, the code probably sucks ;)
detekt will complain at any code, no matter who writes it. one time detekt just shouted at me because i didn't make 17 new lines for this one really easy to use function.
stop dickriding izuna
"Draft", yk that?
I know it's a draft, but he should stop dickriding in general
3 Themes at once and CustomHUD demo (with fixed boundaries)
3 Themes at once and CustomHUD demo (with fixed boundaries)
looks both nice and goofy
A theme can now create any type of component:
including custom settings:
{
"name": "Text",
"default": false,
"alignment": {
"horizontal": "Center",
"horizontalOffset": 0,
"vertical": "Center",
"verticalOffset": 0
},
"settings": [
{
"type": "TEXT",
"name": "Text",
"default": "Text"
},
{
"type": "COLOR",
"name": "Color",
"default": 4294967295
},
{
"type": "TEXT",
"name": "Font",
"default": "Inter"
},
{
"type": "INT",
"name": "Size",
"default": 14,
"range": {
"min": 1,
"max": 100
},
"suffix": "px"
},
{
"type": "CONFIGURABLE",
"name": "Decorations",
"settings": [
{
"type": "BOOLEAN",
"name": "Bold",
"default": false
},
{
"type": "BOOLEAN",
"name": "Italic",
"default": false
},
{
"type": "BOOLEAN",
"name": "Underline",
"default": false
},
{
"type": "BOOLEAN",
"name": "Strikethrough",
"default": false
}
]
},
{
"type": "TOGGLEABLE",
"name": "Shadow",
"default": false,
"settings": [
{
"type": "INT",
"name": "OffsetX",
"default": 0,
"range": {
"min": -10,
"max": 10
},
"suffix": "px"
},
{
"type": "INT",
"name": "OffsetY",
"default": 0,
"range": {
"min": -10,
"max": 10
},
"suffix": "px"
},
{
"type": "INT",
"name": "BlurRadius",
"default": 0,
"range": {
"min": 0,
"max": 10
},
"suffix": "px"
},
{
"type": "COLOR",
"name": "Color",
"default": 4278190080
}
]
},
{
"type": "TOGGLEABLE",
"name": "Glow",
"default": false,
"settings": [
{
"type": "INT",
"name": "Radius",
"default": 0,
"range": {
"min": 0,
"max": 10
},
"suffix": "px"
},
{
"type": "COLOR",
"name": "Color",
"default": 4294967295
}
]
}
]
}
which will (when ready) be displayed in the edit dialog:
(my tech demo GUI)
https://github.com/user-attachments/assets/6a2e2e65-d36c-4204-8442-f624a3fd1a2e
Font Changer with Fonts that are dynamically loaded from theme assets folders. Will be improved after this PR is completed and https://github.com/CCBlueX/LiquidBounce/pull/3921 is being merged since I'm looking forward to support full-varity of all system fonts by using dynamic font loading.
It should be noted that the GUI design is not fixed; these are just demonstrations created by me. I'm neither a designer nor a web developer, so the visuals are likely to be unappealing. They are included as a proof of concept.
A theme can now create any type of component:
including custom settings:
{ "name": "Text", "default": false, "alignment": { "horizontal": "Center", "horizontalOffset": 0, "vertical": "Center", "verticalOffset": 0 }, "settings": [ { "type": "TEXT", "name": "Text", "default": "Text" }, { "type": "COLOR", "name": "Color", "default": 4294967295 }, { "type": "TEXT", "name": "Font", "default": "Inter" }, { "type": "INT", "name": "Size", "default": 14, "range": { "min": 1, "max": 100 }, "suffix": "px" }, { "type": "CONFIGURABLE", "name": "Decorations", "settings": [ { "type": "BOOLEAN", "name": "Bold", "default": false }, { "type": "BOOLEAN", "name": "Italic", "default": false }, { "type": "BOOLEAN", "name": "Underline", "default": false }, { "type": "BOOLEAN", "name": "Strikethrough", "default": false } ] }, { "type": "TOGGLEABLE", "name": "Shadow", "default": false, "settings": [ { "type": "INT", "name": "OffsetX", "default": 0, "range": { "min": -10, "max": 10 }, "suffix": "px" }, { "type": "INT", "name": "OffsetY", "default": 0, "range": { "min": -10, "max": 10 }, "suffix": "px" }, { "type": "INT", "name": "BlurRadius", "default": 0, "range": { "min": 0, "max": 10 }, "suffix": "px" }, { "type": "COLOR", "name": "Color", "default": 4278190080 } ] }, { "type": "TOGGLEABLE", "name": "Glow", "default": false, "settings": [ { "type": "INT", "name": "Radius", "default": 0, "range": { "min": 0, "max": 10 }, "suffix": "px" }, { "type": "COLOR", "name": "Color", "default": 4294967295 } ] } ] }which will (when ready) be displayed in the edit dialog:
(my tech demo GUI)
finally custom blur radius :pray:
A theme can now create any type of component:
including custom settings:
{ "name": "Text", "default": false, "alignment": { "horizontal": "Center", "horizontalOffset": 0, "vertical": "Center", "verticalOffset": 0 }, "settings": [ { "type": "TEXT", "name": "Text", "default": "Text" }, { "type": "COLOR", "name": "Color", "default": 4294967295 }, { "type": "TEXT", "name": "Font", "default": "Inter" }, { "type": "INT", "name": "Size", "default": 14, "range": { "min": 1, "max": 100 }, "suffix": "px" }, { "type": "CONFIGURABLE", "name": "Decorations", "settings": [ { "type": "BOOLEAN", "name": "Bold", "default": false }, { "type": "BOOLEAN", "name": "Italic", "default": false }, { "type": "BOOLEAN", "name": "Underline", "default": false }, { "type": "BOOLEAN", "name": "Strikethrough", "default": false } ] }, { "type": "TOGGLEABLE", "name": "Shadow", "default": false, "settings": [ { "type": "INT", "name": "OffsetX", "default": 0, "range": { "min": -10, "max": 10 }, "suffix": "px" }, { "type": "INT", "name": "OffsetY", "default": 0, "range": { "min": -10, "max": 10 }, "suffix": "px" }, { "type": "INT", "name": "BlurRadius", "default": 0, "range": { "min": 0, "max": 10 }, "suffix": "px" }, { "type": "COLOR", "name": "Color", "default": 4278190080 } ] }, { "type": "TOGGLEABLE", "name": "Glow", "default": false, "settings": [ { "type": "INT", "name": "Radius", "default": 0, "range": { "min": 0, "max": 10 }, "suffix": "px" }, { "type": "COLOR", "name": "Color", "default": 4294967295 } ] } ] }which will (when ready) be displayed in the edit dialog:
(my tech demo GUI)
finally custom blur radius 🙏
this does not change HUD shaders, its only component settings (CSS)
A theme can now create any type of component:
including custom settings:
{ "name": "Text", "default": false, "alignment": { "horizontal": "Center", "horizontalOffset": 0, "vertical": "Center", "verticalOffset": 0 }, "settings": [ { "type": "TEXT", "name": "Text", "default": "Text" }, { "type": "COLOR", "name": "Color", "default": 4294967295 }, { "type": "TEXT", "name": "Font", "default": "Inter" }, { "type": "INT", "name": "Size", "default": 14, "range": { "min": 1, "max": 100 }, "suffix": "px" }, { "type": "CONFIGURABLE", "name": "Decorations", "settings": [ { "type": "BOOLEAN", "name": "Bold", "default": false }, { "type": "BOOLEAN", "name": "Italic", "default": false }, { "type": "BOOLEAN", "name": "Underline", "default": false }, { "type": "BOOLEAN", "name": "Strikethrough", "default": false } ] }, { "type": "TOGGLEABLE", "name": "Shadow", "default": false, "settings": [ { "type": "INT", "name": "OffsetX", "default": 0, "range": { "min": -10, "max": 10 }, "suffix": "px" }, { "type": "INT", "name": "OffsetY", "default": 0, "range": { "min": -10, "max": 10 }, "suffix": "px" }, { "type": "INT", "name": "BlurRadius", "default": 0, "range": { "min": 0, "max": 10 }, "suffix": "px" }, { "type": "COLOR", "name": "Color", "default": 4278190080 } ] }, { "type": "TOGGLEABLE", "name": "Glow", "default": false, "settings": [ { "type": "INT", "name": "Radius", "default": 0, "range": { "min": 0, "max": 10 }, "suffix": "px" }, { "type": "COLOR", "name": "Color", "default": 4294967295 } ] } ] }which will (when ready) be displayed in the edit dialog:
(my tech demo GUI)
finally custom blur radius 🙏
this does not change HUD shaders, its only component settings (CSS)
(edit) nvm i didnt see that this was shadow blur radius
I think on devices that don't support chromium, it shouldn't be loaded and the native theme should be applied automatically.
I think on devices that don't support chromium, it shouldn't be loaded and the native theme should be applied automatically.
thats the reason why izuna made the native theme in the first place

(my tech demo GUI)