mirror of
https://github.com/wailsapp/wails.git
synced 2025-05-06 17:50:33 +08:00
efe0c8d534
* [v3-Windows] New DIP system for Enhanced High DPI Monitor Support * Update changelog * Remove asset middleware * Remove SetThreadDpiAwarenessContext() * Fix macOS build. * Fill missing screens fields (linux, darwin) * Skip DPI transformation on unsupported platforms * Simplify distanceFromRectSquared() * Update v3/pkg/application/screenmanager.go Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> --------- Co-authored-by: Lea Anthony <lea.anthony@gmail.com> Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
90 lines
3.3 KiB
HTML
90 lines
3.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Window Demo</title>
|
|
<style>
|
|
body {
|
|
color: white;
|
|
}
|
|
</style>
|
|
<script src="/wails/runtime.js" type="module"></script>
|
|
<script>
|
|
async function callBinding(name, ...params) {
|
|
return wails.Call.ByName(name, ...params)
|
|
}
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<div style="background-color: aquamarine; height: 50px;" onclick="showInfo = !showInfo">
|
|
<div style="background-color: rgb(57, 109, 92); width: 50%; height: 100%; position: relative;">
|
|
<span id="text" style="float: left; font-size: 1.5em;"></span>
|
|
<div style="background-color: rgb(237, 157, 66); width: 40px; height: 100%; opacity: 0.5; position: absolute; right: -20px;"></div>
|
|
</div>
|
|
</div>
|
|
<!-- ===================================================== -->
|
|
<hr>
|
|
<label>
|
|
✥
|
|
<input id="step" type="number" value="50" style="width: 50px" title="Step, Arrow Move" onkeydown="arrowMove(event)">
|
|
</label>
|
|
X:
|
|
<button onclick="setPos(true, -step.value)"><</button>
|
|
<button onclick="setPos(true, +step.value)">></button>
|
|
Width:
|
|
<button onclick="setSize(true, -step.value)">-</button>
|
|
<button onclick="setSize(true, +step.value)">+</button>
|
|
|
|
<button onclick="getBounds()">getBounds</button>
|
|
<button onclick="getBounds().then(b => {x.value = b.x; y.value = b.y; w.value = b.width; h.value = b.height})">↡</button>
|
|
<div style="height: 10px"></div>
|
|
<input id="x" type="number" value="100" style="width: 50px" title="X">
|
|
<input id="y" type="number" value="100" style="width: 50px" title="Y">
|
|
<button onclick="setPos(false, +x.value, +y.value)">setPos</button>
|
|
|
|
<input id="w" type="number" value="800" style="width: 50px" title="Width">
|
|
<input id="h" type="number" value="600" style="width: 50px" title="Height">
|
|
<button onclick="setSize(false, +w.value, +h.value)">setSize</button>
|
|
|
|
<button onclick="setBounds(+x.value, +y.value, +w.value, +h.value)">setBounds</button>
|
|
<hr>
|
|
<!-- ===================================================== -->
|
|
|
|
<script>
|
|
function arrowMove(e) {
|
|
let x = 0, y = 0
|
|
if (e.key == 'ArrowLeft') x = -step.value
|
|
if (e.key == 'ArrowRight') x = +step.value
|
|
if (e.key == 'ArrowUp') y = -step.value
|
|
if (e.key == 'ArrowDown') y = +step.value
|
|
if (!(x || y)) return
|
|
e.preventDefault()
|
|
setPos(true, x, y)
|
|
}
|
|
function setPos(relative, x, y=0) {
|
|
callBinding('main.WindowService.SetPos', relative, x, y)
|
|
}
|
|
function setSize(relative, w, h=0) {
|
|
callBinding('main.WindowService.SetSize', relative, w, h)
|
|
}
|
|
function setBounds(x, y, w, h) {
|
|
callBinding('main.WindowService.SetBounds', x, y, w, h)
|
|
}
|
|
async function getBounds() {
|
|
const b = await callBinding('main.WindowService.GetBounds')
|
|
return {x: b.X, y: b.Y, width: b.Width, height: b.Height}
|
|
}
|
|
let showInfo = false
|
|
setInterval(async () => {
|
|
if (!showInfo) {
|
|
text.textContent = ''
|
|
return
|
|
}
|
|
const b = await getBounds()
|
|
text.textContent = `${b.x}, ${b.y} - ${b.width}, ${b.height}`
|
|
}, 100);
|
|
</script>
|
|
|
|
</body>
|
|
</html> |