# MultiDeviceInteraction

**Repository Path**: harmonyos_samples/multi-device-interaction

## Basic Information

- **Project Name**: MultiDeviceInteraction
- **Description**: 本实例依托系统级交互归一化能力，实现了跨多端设备的统一交互体验。支持触控屏、触控板、鼠标、键盘等多种输入方式，涵盖基础输入事件、手势识别、拖拽操作及焦点管理等核心交互功能，为多设备交互提供完整示例。
- **Primary Language**: Unknown
- **License**: Apache-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 2
- **Forks**: 3
- **Created**: 2025-10-21
- **Last Updated**: 2025-11-18

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 实现多设备交互功能

## 项目简介

本实例依托系统级交互归一化能力，实现了跨多端设备的统一交互体验。支持触控屏、触控板、鼠标、键盘等多种输入方式，涵盖基础输入事件、手势识别、拖拽操作及焦点管理等核心交互功能，为多设备交互提供完整示例。

## 效果预览
| 输入设备选择                                            | 交互事件选择                                               | 交互体验                                                |
|---------------------------------------------------|------------------------------------------------------|-----------------------------------------------------|
| <img src='./screenshots/device/page1.png' width=320> | <img src='./screenshots/device/page2.png' width=320> | <img src='./screenshots/device/page3.png' width=320> |

## 使用说明

1. 手机/平板/电脑/智慧屏设备运行default模块，手表设备运行wearable模块。
2. 在首页选择要交互的输入设备，进入该输入设备支持的交互事件页。
3. 选择要体验的交互事件，进行交互并查看交互效果。

## 工程目录

```
├───default                                                
│   ├───src/main/ets                               
│   │   ├───common                                        
│   │   │   ├───constants
│   │   │   │   └───Constants.ets                         // 常量类
│   │   │   └───utils
│   │   │       ├───ResourceConversion.ets                // 资源转换类
│   │   │       ├───Utils.ets                             // 通用方法
│   │   │       ├───WidthBreakpointType.ets               // 断点工具类
│   │   │       └───WindowUtil.ets                        // 窗口工具类
│   │   ├───entryability                            
│   │   │   └───EntryAbility.ets                          // Ability的生命周期回调内容
│   │   ├───entrybackupability                      
│   │   │   └───EntryBackupAbility.ets                    // Ability的生命周期回调内容
│   │   ├───pages    
│   │   │    └───Index.ets                                 // 首页       
│   │   └───view                                
│   │       ├───base       
│   │       │   ├───AxisEvent.ets                         // 轴事件
│   │       │   ├───FocusAxisEvent.ets                    // 焦点轴事件
│   │       │   ├───HandwriteEvent.ets                    // 手写笔事件
│   │       │   ├───HoverEvent.ets                        // 指针事件
│   │       │   └───KeyEvent.ets                          // 按键事件
│   │       ├───drag           
│   │       │   └───DragEvent.ets                         // 拖拽事件
│   │       ├───focus            
│   │       │   └───FocusEvent.ets                        // 焦点事件
│   │       ├───gesture         
│   │       │   ├───ClickEvent.ets                        // 点击事件
│   │       │   ├───LongPressGestureEvent.ets             // 长按手势
│   │       │   ├───PanGestureEvent.ets                   // 滑动手势
│   │       │   ├───PinchGestureEvent.ets                 // 捏合手势
│   │       │   ├───RotationGestureEvent.ets              // 旋转手势
│   │       │   ├───SwipeGestureEvent.ets                 // 轻扫手势
│   │       │   └───TapGestureEvent.ets                   // 点击手势
│   │       ├───InteractionEvents.ets                     // 设备事件列表页
│   │       ├───UserActionTitle.ets                       // 交互小标题组件
│   │       ├───UserButton.ets                            // 交互列表按钮组件
│   │       ├───UserDesc.ets                              // 交互设备响应组件
│   │       ├───UserText.ets                              // 交互数据展示组件
│   │       └───UserTitle.ets                             // 交互事件标题组件
│   └───src/main/resources 
└───wearable                                                  
    ├───src/main/ets                                    
    │   ├───pages                            
    │   │   └───Index.ets                                  // 首页
    │   ├───view
    │   │   ├───DigitalCrownEvent.ets                      // 表冠事件
    │   │   ├───PressureSensitive.ets                      // 压感交互
    │   │   └───SmartGestureEvent.ets                      // 智慧手势 
    │   ├───wearableability                      
    │   │   └───WearableAbility.ets                        // Ability的生命周期回调内容     
    │   └───wearablebackupability                                   
    │       └───WearableBackupAbility.ets                  // Ability的生命周期回调内容
    └───src/main/resources                        
```
## 具体实现
1. 基础输入事件如手写笔事件，可以直接使用HandwriteComponent手写套件组件，引入该组件可以直接实现不同笔触的手写功能。通过监听组件的事件，并在回调中进行业务处理，来响应输入设备的交互操作，如轴事件（onAxisEvent）、按键事件（onKeyEvent）等。
2. 手势事件需要在组件上添加对应的手势对象，以便系统可以收集并进行处理。通过gesture绑定手势，再配置不同的手势类型，如长按（LongPressGesture）、滑动（PanGesture）、捏合（PinchGesture）等常用手势，onAction为手势处理器识别成功的回调，在其中进行相应的业务处理。
3. 使用onFocus和onBlur事件监听组件的获焦与失焦状态变化。默认遵循系统走焦算法，同时支持通过tabIndex设置焦点顺序，并利用nextFocus属性自定义上下左右方向的焦点跳转路径，满足复杂界面的导航需求。
4. 拖拽功能通过一组事件协同实现，onDragStart、onDragEnter、onDragMove、onDragLeave、onDrop一系列的拖拽事件依次响应在拖拽过程中的事件，在各阶段事件中处理相应业务，可构建完整的拖拽交互流程。

## 相关权限

无


## 约束与限制

1.设备限制

本端设备：手表/手机/平板/电脑/智慧屏设备。
  
2.HarmonyOS系统：HarmonyOS 6.0.0 Release 及以上。

3.DevEco Studio版本：DevEco Studio 6.0.0 Release 及以上。

4.HarmonyOS SDK版本：HarmonyOS 6.0.0 Release SDK及以上。