feat(Device): add wireless connections

README.md

@@ -6,7 +6,7 @@ Due to the delay and blurred image quality of the mirror screen. This project fo
 
 ## Features
 
-- [ ] Wired and wireless connections to Android devices
+- [x] Wired and wireless connections to Android devices
 - [x] Start scrcpy-server and connect to it
 - [x] Implement scrcpy client control protocol
 - [x] Mouse and keyboard mapping

src-tauri/src/adb.rs

@@ -166,4 +166,22 @@ impl Adb {
             .context("Failed to execute 'adb start-server'")?;
         Ok(())
     }
+
+    pub fn cmd_connect(res_dir: &PathBuf, address: &str) -> Result<String> {
+        let mut adb_command = Adb::cmd_base(res_dir);
+        let output = adb_command
+            .args(&["connect", address])
+            .output()
+            .context(format!("Failed to execute 'adb connect {}'", address))?;
+
+        let res = String::from_utf8(output.stdout)?;
+        Ok(res)
+    }
+}
+
+#[test]
+fn t() {
+    let res_dir = PathBuf::from("/Users/akichase/Projects/github/scrcpy-mask/src-tauri/resource/");
+    let res = Adb::cmd_connect(&res_dir, "127.0.0.1:1234").unwrap();
+    println!("{}", res)
 }

src-tauri/src/main.rs

@@ -109,6 +109,7 @@ fn start_scrcpy_server(
 }
 
 #[tauri::command]
+/// get device screen size
 fn get_device_screen_size(id: String, app: tauri::AppHandle) -> Result<(u32, u32), String> {
     let dir = app.path().resource_dir().unwrap().join("resource");
     match ScrcpyClient::get_device_screen_size(&dir, &id) {
@@ -118,6 +119,17 @@ fn get_device_screen_size(id: String, app: tauri::AppHandle) -> Result<(u32, u32
 }
 
 #[tauri::command]
+/// connect to wireless device
+fn adb_connect(address: String, app: tauri::AppHandle) -> Result<String, String> {
+    let dir = app.path().resource_dir().unwrap().join("resource");
+    match Adb::cmd_connect(&dir, &address) {
+        Ok(res) => Ok(res),
+        Err(e) => Err(e.to_string()),
+    }
+}
+
+#[tauri::command]
+/// load default key mapping config file
 fn load_default_keyconfig(app: tauri::AppHandle) -> Result<String, String> {
     let dir = app.path().resource_dir().unwrap().join("resource");
     let file = ResHelper::get_file_path(&dir, ResourceName::DefaultKeyConfig);
@@ -205,6 +217,7 @@ async fn main() {
             push_server_file,
             start_scrcpy_server,
             get_device_screen_size,
+            adb_connect,
             load_default_keyconfig
         ])
         .run(tauri::generate_context!())

src/components/Device.vue

@@ -16,10 +16,12 @@ import {
   forwardServerPort,
   startScrcpyServer,
   getDeviceScreenSize,
+  adbConnect,
 } from "../invoke";
 import {
   NH4,
   NP,
+  NInput,
   NInputNumber,
   NButton,
   NDataTable,
@@ -35,6 +37,7 @@ import {
   DropdownOption,
   useDialog,
   useMessage,
+  NInputGroup,
 } from "naive-ui";
 import { CloseCircle, InformationCircle } from "@vicons/ionicons5";
 import { Refresh } from "@vicons/ionicons5";
@@ -48,6 +51,7 @@ const store = useGlobalStore();
 const message = useMessage();
 
 const port = ref(27183);
+const address = ref("");
 
 const localStore = new Store("store.bin");
 
@@ -257,6 +261,18 @@ async function refreshDevices() {
   devices.value = await adbDevices();
   store.hideLoading();
 }
+
+async function connectDevice() {
+  if (!address.value) {
+    message.error("请输入无线调试地址");
+    return;
+  }
+
+  store.showLoading();
+  const msg = await adbConnect(address.value);
+  store.hideLoading();
+  message.info(msg);
+}
 </script>
 
 <template>
@@ -269,8 +285,18 @@ async function refreshDevices() {
           :show-button="false"
           :min="16384"
           :max="49151"
+          placeholder="Scrcpy 本地端口"
           style="max-width: 300px"
         />
+        <NH4 prefix="bar">无线连接</NH4>
+        <NInputGroup style="max-width: 300px">
+          <NInput
+            v-model:value="address"
+            clearable
+            placeholder="无线调试地址"
+          />
+          <NButton type="primary" @click="connectDevice">连接</NButton>
+        </NInputGroup>
         <NH4 prefix="bar">设备尺寸</NH4>
         <NFlex justify="left" align="center">
           <NFormItem label="宽度">

src/invoke.ts

@@ -35,6 +35,10 @@ export async function getDeviceScreenSize(
   return await invoke("get_device_screen_size", { id });
 }
 
+export async function adbConnect(address: string): Promise<string> {
+  return await invoke("adb_connect", { address });
+}
+
 export async function loadDefaultKeyconfig(): Promise<string> {
   return await invoke("load_default_keyconfig");
 }