AutoAndroidController

**一、框架：Electron + React + Vite

**二、开发命令

• npm run dev：只启动 Vite 前端开发服务器。
• npm run electron：直接启动 Electron（加载本地文件）。
• npm run electron:dev：同时启动 Vite 开发服务器并在准备好后打开 Electron（推荐开发时使用）。
• npm run build：构建生产版本。
• npm run preview：预览构建后的应用。

**三、将页面设置为子页面（条件渲染）

步骤：

1. 修改 src/pages/Home.jsx：

• 添加：import Devices from './Devices/Devices';
• 在 HomeLogic() 中获取：const { showDevices, setShowDevices } = HomeLogic();
• 在 return 中添加：{showDevices && <Devices />} 和按钮控制显示/隐藏

2. 修改 src/pages/Home.js：

• 添加：import { useState } from 'react';
• 在 HomeLogic 中添加：const [showDevices, setShowDevices] = useState(false);
• return 中暴露：showDevices, setShowDevices

3. 修改 src/App.jsx：

• 删除 Devices 的 import 和组件使用

**四、响应式适配方案

推荐组合：媒体查询 + 相对单位 + Flexbox

• 布局单位：rem、vw、%
• 字体大小：clamp(最小, 自适应, 最大)
• 间距内边距：rem 或 %
• 关键尺寸：vw 或 %
• 布局控制：Flexbox + 媒体查询断点