1# 通话设备切换 2 3### 介绍 4 5本示例主要展示了通话设备切换的相关功能，使用[@ohos.multimedia.avCastPicker](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-avsession-kit/ohos-multimedia-avcastpicker.md)和[@ohos.multimedia.avCastPickerParam](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-avsession-kit/js-apis-avCastPickerParam.md)等接口实现通话设备切换功能。 6 7> 注意： 8> 通话设备切换按钮可显示默认样式或者自定义样式，默认样式由系统提供，自定义组件由应用提供。还可参考相关的[开发指南](https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/media/avsession/using-switch-call-devices.md)。 9 10### 效果预览 11 12| 主页 | 默认样式页面 | 自定义样式页面 | 13|-------------------------------- | -------------------------------- | -------------------------------- | 14|  |  |  | 15 16### 使用说明 17 181. 点击进入主页，可以选择点击按钮默认样式组件和自定义样式组件，如果点击默认样式组件，跳转到显示默认样式的页面；点击自定义样式组件，跳转到显示自定义样式的页面； 192. 进入页面后，有三个按钮，分别是start,stop和设备切换按钮，点击start按钮，可播放音频，点击stop，可暂停音频， 点击设备切换按钮，可选择当前输出设备并显示设备对应的样式。 20 21### 工程目录 22 23项目中关键的目录结构如下： 24 25``` 26entry/src/main/ets/ 27|---pages 28|---|---Index.ets //初始界面实现 29|---|---DefaultPicker.ets //默认样式实现 30|---|---CustomPicker.ets //自定义样式实现 31 32``` 33 34### 具体实现 35 36#### 初始界面实现 37 38 初始界面相关的实现都封装在pages/Index.ets下，源码参考：[pages/Index.ets](./entry/src/main/ets/pages/Index.ets)。 39 40 * 界面显示两个按钮分别为默认样式组件和自定义样式组件，可分别跳转到系统默认样式实现界面和自定义样式实现界面，相关代码如下： 41 42 ```ets 43 Button() { 44 // 按钮的内容 45 } 46 .onClick(async() => { 47 await router.pushUrl({ url:'pages/DefaultPicker' });//系统默认样式实现 48 }) 49 50 Button() { 51 // 按钮的内容 52 } 53 .onClick(async() => { 54 await router.pushUrl({ url:'pages/CustomPicker' });//自定义样式实现 55 }) 56 ``` 57#### 默认系统样式 58 59 默认系统样式的相关内容封装在pages/DefaultPicker.ets下，源码参考：[pages/DefaultPicker.ets](./entry/src/main/ets/pages/DefaultPicker.ets)。 60 61 * 在需要切换设备的通话界面创建AVCastPicker组件。 62 63 ```ets 64 import { AVCastPicker } from '@kit.AVSessionKit'; 65 66 AVCastPicker({ 67 normalColor: this.avCastPickerColor, 68 activeColor: this.avCastPickerColor, 69 }) 70 .size({ width: 45, height: 45 }) 71 ``` 72 73 * 拉起组件前需创建voice_call类型的AVSession，AVSession在构造方法中支持不同的类型参数，由AVSessionType定义，voice_call表示通话类型。 74 75 ```ets 76 import { avSession } from '@kit.AVSessionKit'; 77 78 init() { 79 //... 80 this.session = await avSession.createAVSession(this.appContext, 'voiptest', 'voice_call'); 81 } 82 ``` 83 84 * 创建VOICE_COMMUNICATION类型的AudioRenderer，并播放，可模拟通话场景： 85 86 * 创建如下三个变量。 87 88 ```ets 89 private audioRendererInfo: audio.AudioRendererInfo = { 90 usage: audio.StreamUsage.STREAM_USAGE_VOICE_COMMUNICATION, 91 rendererFlags: 0 92 } 93 private audioStreamInfo: audio.AudioStreamInfo = { 94 samplingRate: audio.AudioSamplingRate.SAMPLE_RATE_48000, // 采样率 95 channels: audio.AudioChannel.CHANNEL_2, // 通道 96 sampleFormat: audio.AudioSampleFormat.SAMPLE_FORMAT_S16LE, // 采样格式 97 encodingType: audio.AudioEncodingType.ENCODING_TYPE_RAW // 编码格式 98 } 99 private audioRendererOption: audio.AudioRendererOptions = { 100 streamInfo: this.audioStreamInfo, 101 rendererInfo: this.audioRendererInfo 102 } 103 ``` 104 105 * 调用 startRenderer() 播放音频。 106 107 * 调用 stopRenderer() 暂停播放音频。 108 109#### 自定义样式 110 111 自定义样式的相关内容封装在pages/CustomPicker.ets下，源码参考：[pages/CustomPicker.ets](./entry/src/main/ets/pages/CustomPicker.ets)。 112 113 * 在需要切换设备的通话界面创建AVCastPicker组件。 114 115 ```ets 116 117 import { AVCastPicker } from '@kit.AVSessionKit'; 118 119 @State pickerImage: ResourceStr = $r('app.media.ic_earpiece'); 120 121 @Builder 122 ImangeBuilder(): void { 123 Image(this.pickerImage) 124 .size({ width: '100%', height: '100%' }) 125 .backgroundColor('#00000000') 126 .fillColor(Color.Black) 127 } 128 129 Column() { 130 Button() { 131 AVCastPicker({ 132 normalColor: this.avCastPickerColor, 133 activeColor: this.avCastPickerColor, 134 customPicker: (): void => this.ImangeBuilder(), 135 onStateChange: (state: AVCastPickerState) => { 136 console.error(`change avcastpicker: ${state}`); 137 } 138 }) 139 .size({ width: 45, height: 45 }) 140 } 141 .size({ width: 64, height: 64 }) 142 .type(ButtonType.Circle) 143 .backgroundColor(Color.Orange) 144 } 145 .size({ width: '33%', height: 64 }) 146 147 ``` 148 149 * 拉起组件前也需创建voice_call类型的AVSession。为了保证能够正常更新样式，需要监听当前设备切换，如果当前设备切换，将刷新显示样式 150 151 ```ets 152 153 import { avSession } from '@kit.AVSessionKit'; 154 import { audio } from '@kit.AudioKit'; 155 156 init(){ 157 this.session = await avSession.createAVSession(this.appContext, 'voiptest', 'voice_call'); 158 this.observerDevices(); 159 } 160 161 async observerDevices() { 162 if(!this.audioRoutingManager) { 163 return; 164 } 165 let desc: audio.AudioDeviceDescriptors = this.audioRoutingManager.getPreferredOutputDeviceForRendererInfoSync(this.audioRendererInfo); 166 this.changePickerShow(desc); 167 audioRoutingManager.on('preferOutputDeviceChangeForRendererInfo', this.audioRendererInfo, (desc: audio.AudioDeviceDescriptors) => { 168 if(!this.audioRoutingManager) { 169 return; 170 } 171 console.log(`device change to: ${desc[0].deviceType}`); 172 let devices: audio.AudioDeviceDescriptors = this.audioRoutingManager.getPreferredOutputDeviceForRendererInfoSync(this.audioRendererInfo); 173 this.changePickerShow(devices); 174 }); 175 } 176 177 private changePickerShow(desc: audio.AudioDeviceDescriptors) { 178 if (desc[0].deviceType === 2) { 179 this.pickerImage = $r('app.media.ic_public_sound'); 180 } else if (desc[0].deviceType === 7) { 181 this.pickerImage = $r('app.media.ic_bluetooth'); 182 } else { 183 this.pickerImage = $r('app.media.ic_earpiece'); 184 } 185 } 186 187 ``` 188 189 * 创建VOICE_COMMUNICATION类型的AudioRenderer，并播放，可模拟通话场景，具体实现如默认样式。 190 191### 相关权限 192 193不涉及 194 195### 依赖 196 197不涉及 198 199### 约束与限制 200 2011. 本示例仅支持标准系统上运行。 202 2032. 本示例为Stage模型，支持API12版本SDK，SDK版本号(API Version 12 Release),镜像版本号(5.0 Release)。 204 2053. 本示例需要使用DevEco Studio 版本号(5.0 Release)及以上版本才可编译运行。 206 2074. 本示例手机设备支持，RK暂不支持。 208 209### 下载 210 211如需单独下载本工程，执行如下命令： 212 213``` 214git init 215git config core.sparsecheckout true 216echo code/BasicFeature/Media/AVSession/AvCastPickerForCall > .git/info/sparse-checkout 217git remote add origin https://gitee.com/openharmony/applications_app_samples.git 218git pull origin master 219``` 220
