mirror of
https://github.com/AkiChase/scrcpy-mask
synced 2025-04-21 04:25:13 +08:00
feat(sidebar): add volume control
This commit is contained in:
parent
3f50553ced
commit
86594363f5
@ -5,11 +5,13 @@ import {
|
|||||||
LogoAndroid,
|
LogoAndroid,
|
||||||
SettingsOutline,
|
SettingsOutline,
|
||||||
ReturnDownBackOutline,
|
ReturnDownBackOutline,
|
||||||
|
VolumeHighOutline,
|
||||||
|
VolumeLowOutline,
|
||||||
StopOutline,
|
StopOutline,
|
||||||
ListOutline,
|
ListOutline,
|
||||||
} from "@vicons/ionicons5";
|
} from "@vicons/ionicons5";
|
||||||
import { Keyboard24Regular } from "@vicons/fluent";
|
import { Keyboard24Regular } from "@vicons/fluent";
|
||||||
import { NIcon } from "naive-ui";
|
import { NIcon, useMessage } from "naive-ui";
|
||||||
import { useGlobalStore } from "../store/global";
|
import { useGlobalStore } from "../store/global";
|
||||||
import { sendInjectKeycode } from "../frontcommand/controlMsg";
|
import { sendInjectKeycode } from "../frontcommand/controlMsg";
|
||||||
import {
|
import {
|
||||||
@ -21,6 +23,7 @@ import {
|
|||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
const store = useGlobalStore();
|
const store = useGlobalStore();
|
||||||
|
const message = useMessage();
|
||||||
|
|
||||||
function nav(name: string) {
|
function nav(name: string) {
|
||||||
router.replace({ name });
|
router.replace({ name });
|
||||||
@ -49,6 +52,8 @@ async function sendKeyCodeToDevice(code: AndroidKeycode) {
|
|||||||
repeat: 0,
|
repeat: 0,
|
||||||
metastate: AndroidMetastate.AMETA_NONE,
|
metastate: AndroidMetastate.AMETA_NONE,
|
||||||
});
|
});
|
||||||
|
} else {
|
||||||
|
message.error("未连接设备");
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
@ -83,6 +88,16 @@ async function sendKeyCodeToDevice(code: AndroidKeycode) {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="nav">
|
<div class="nav">
|
||||||
|
<div @click="sendKeyCodeToDevice(AndroidKeycode.AKEYCODE_VOLUME_UP)">
|
||||||
|
<NIcon>
|
||||||
|
<VolumeHighOutline />
|
||||||
|
</NIcon>
|
||||||
|
</div>
|
||||||
|
<div @click="sendKeyCodeToDevice(AndroidKeycode.AKEYCODE_VOLUME_DOWN)">
|
||||||
|
<NIcon>
|
||||||
|
<VolumeLowOutline />
|
||||||
|
</NIcon>
|
||||||
|
</div>
|
||||||
<div @click="sendKeyCodeToDevice(AndroidKeycode.AKEYCODE_BACK)">
|
<div @click="sendKeyCodeToDevice(AndroidKeycode.AKEYCODE_BACK)">
|
||||||
<NIcon>
|
<NIcon>
|
||||||
<ReturnDownBackOutline />
|
<ReturnDownBackOutline />
|
||||||
@ -173,16 +188,14 @@ async function sendKeyCodeToDevice(code: AndroidKeycode) {
|
|||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
||||||
.NIcon {
|
cursor: pointer;
|
||||||
cursor: pointer;
|
transition: transform 0.3s ease;
|
||||||
transition: transform 0.3s ease;
|
|
||||||
}
|
|
||||||
|
|
||||||
.NIcon:hover {
|
&:hover {
|
||||||
color: var(--primary-hover-color);
|
color: var(--primary-hover-color);
|
||||||
transform: scale(1.1);
|
transform: scale(1.1);
|
||||||
}
|
}
|
||||||
.NIcon:active {
|
&:active {
|
||||||
color: var(--primary-pressed-color);
|
color: var(--primary-pressed-color);
|
||||||
transform: scale(0.9);
|
transform: scale(0.9);
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user