Jayden/wayvr
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

edit overlay design

Browse Source
This commit is contained in:
galister
2025-11-12 23:27:26 +09:00
parent 278420b2ce
commit d26ddd66bd
5 changed files with 78 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

66
wlx-overlay-s/src/assets/gui/edit.xml
View File

@@ -4,40 +4,54 @@
<var key="tint_color" value="#0044CC99" />
</theme>
<template name="TopButton">
<rectangle id="~id" color="~bg_color" padding="8" round="50%">
<sprite color="~device_color" width="48" height="48" src="${src}" />
</rectangle>
</template>
<macro name="button_style"
margin="2" overflow="hidden" box_sizing="border_box" align_items="center" justify_content="center"
border_color="#0044CC" border="2" round="8" color="#000A1C" color2="#000002" gradient="vertical" />
border="2" round="50%" padding="8" gradient="vertical" tooltip_side="bottom" />
<template name="TopButton">
<Button id="${id}" macro="button_style" tooltip="${tooltip}" _press="${press}" border_color="#0044CC" color="#000A1C" color2="#000002" >
<sprite color="~device_color" width="48" height="48" src="${src}" />
</Button>
</template>
<template name="TopButtonDanger">
<Button id="${id}" macro="button_style" tooltip="${tooltip}" _press="${press}" border_color="#CC0000" color="#110000" color2="#020000" >
<sprite color="~device_color" width="48" height="48" src="${src}" />
</Button>
</template>
<template name="TopButtonFaded">
<Button id="${id}" macro="button_style" tooltip="${tooltip}" _press="${press}" border_color="#707070" color="#202020" color2="#010101" >
<sprite color="~device_color" width="48" height="48" src="${src}" />
</Button>
</template>
<elements>
<div width="100%" height="100%">
<rectangle width="100%" height="100%" padding="4" gap="4" align_items="center" justify_content="center" color="#000000DD" flex_direction="row">
<div></div>
<div flex_direction="column">
<div></div>
<rectangle padding="10" gap="8" round="100%" color="~bg_color" justify_content="center" >
<TopButton id="lock" src="bar/lock_open.svg" />
<TopButton id="anchor" src="bar/anchor.svg" />
<TopButton id="mouse" src="bar/mouse.svg" />
<TopButton id="fade" src="bar/fade.svg" />
<TopButton id="move" src="bar/move-all.svg" />
<TopButton id="resize" src="bar/resize.svg" />
<TopButton id="inout" src="bar/inout.svg" />
<TopButton id="delete" src="bar/delete.svg" />
</rectangle>
<rectangle padding="8" gap="8" round="100%" color="~bg_color_active" justify_content="center" align_items="center">
<label text="range 10-20 value 15" />
<Slider width="200" height="16" min_value="10" max_value="20" value="15" />
<CheckBox id="test0" text="AM/PM clock" />
</rectangle>
<div></div>
<rectangle padding="20" gap="8" round="100%" color="~bg_color" justify_content="center" >
<div flex_direction="column" gap="8">
<label align="center" translation="Point on a window to change its parameters.&#xA;Once done, leave edit mode using the button on the right." />
<div flex_direction="row" gap="4">
<TopButton id="lock" src="bar/lock_open.svg" tooltip="Lock interaction" kind="btn_primary" />
<TopButton id="anchor" src="bar/anchor.svg" tooltip="Positioning" kind="btn_primary" />
<TopButton id="fade" src="bar/fade.svg" tooltip="Opacity" kind="btn_primary" />
<TopButton id="move" src="bar/move-all.svg" tooltip="Move (click &amp; drag)" kind="btn_primary" />
<TopButton id="resize" src="bar/resize.svg" tooltip="Resize (click &amp; drag)" kind="btn_primary" />
<TopButton id="inout" src="bar/inout.svg" tooltip="Adjust distance (click &amp; drag)" kind="btn_primary" />
<TopButtonDanger id="delete" src="bar/delete.svg" tooltip="Delete" kind="btn_danger" />
<div width="8" height="100%" />
<TopButtonFaded src="watch/edit.svg" tooltip="Leave edit mode" press="::EditToggle" kind="btn_faded" />
</div>
<div padding="8" gap="8" justify_content="center" align_items="center">
<label translation="Opacity" />
<Slider width="200" height="16" min_value="5" max_value="100" value="100" />
<CheckBox id="additive" translation="Additive" tooltip="Alpha blend mode" tooltip_side="bottom" />
</div>
</div>
<div></div>
</rectangle>
</div>
</rectangle>
</div>
</elements>