1# @ohos.multimedia.movingphotoview (动态照片) 2 3用于播放动态照片文件并控制其播放状态的组件。 4 5> **说明:** 6> 7> 该组件从API Version 12开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。 8> 当前不支持在预览器中使用MovingPhotoView组件。 9 10## 导入模块 11 12``` 13import { MovingPhotoView, MovingPhotoViewController, MovingPhotoViewAttribute } from '@kit.MediaLibraryKit'; 14``` 15 16## MovingPhotoView 17 18> **说明:** 19> 20> - 当前不支持动态属性设置。 21> - 当前不支持ArkUI通用属性ComponentOptions中expandSafeArea属性设置。 22> - 该组件长按触发播放时组件区域放大为1.1倍。 23> - 该组件使用[AVPlayer](../apis-media-kit/_a_v_player.md#avplayer)进行播放,同时开启的[AVPlayer](../apis-media-kit/_a_v_player.md#avplayer)个数不建议超过3个,超过3个可能会出现视频播放卡顿现象。 24 25MovingPhotoView(options: MovingPhotoViewOptions) 26 27**参数:** 28 29 30| 参数名 | 参数类型 | 必填 | 参数描述 | 31| ------- | --------------------------------------------------------- | ---- | -------------- | 32| options | [MovingPhotoViewOptions](#movingphotoviewoptions) | 是 | 动态照片信息。 | 33 34## MovingPhotoViewOptions 35 36 37| 参数名 | 参数类型 | 必填 | 参数描述 | 38| ----------- | ------------------------------------------------------------------------------------------------ | ---- | ----------------------------------------------------------------------------------------------------------------------------------------------- | 39| movingPhoto | [MovingPhoto](js-apis-photoAccessHelper.md#movingphoto12) | 是 | 支持媒体库MovingPhoto数据源,具体信息详见[MovingPhoto说明](js-apis-photoAccessHelper.md#movingphoto12)。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 40| controller | [MovingPhotoViewController](#movingphotoviewcontroller) | 否 | 设置动态照片控制器,可以控制动态照片的播放状态。<br/>**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 | 41| imageAIOptions<sup>18+</sup> | [ImageAIOptions](../apis-arkui/arkui-ts/ts-image-common.md#imageaioptions) | 否 | 设置动态照片AI分析选项,可配置分析类型或绑定一个分析控制器。<br/>**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 | 42 43## 属性 44 45除支持[通用属性](../apis-arkui/arkui-ts/ts-component-general-attributes.md)外,还支持以下属性: 46 47### muted 48 49muted(isMuted: boolean) 50 51设置是否静音。 52 53**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 54 55**系统能力:** SystemCapability.FileManagement.PhotoAccessHelper.Core 56 57**参数:** 58 59 60| 参数名 | 类型 | 必填 | 说明 | 61| ------- | ------- | ---- | ---------------------------- | 62| isMuted | boolean | 是 | 是否静音。<br/>默认值:false。<br/>false:非静音。<br/>true:静音。| 63 64### objectFit 65 66objectFit(value: ImageFit) 67 68设置动态照片显示模式。 69 70**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 71 72**系统能力:** SystemCapability.FileManagement.PhotoAccessHelper.Core 73 74**参数:** 75 76 77| 参数名 | 类型 | 必填 | 说明 | 78| ------ | ----------------------------------------------------------------------------- | ---- | -------------------------------- | 79| value | [ImageFit](../apis-arkui/arkui-ts/ts-appendix-enums.md#imagefit) | 是 | 视频显示模式。<br/>默认值:Cover。 | 80 81### autoPlayPeriod<sup>13+</sup> 82 83autoPlayPeriod(startTime: number, endTime: number) 84 85设置自动播放区间,附属于autoPlay的子配置项。 86 87在调用此方法前,需将[autoPlay](#autoplay13)设置为true,设置自动播放,否则指定的视频区间(startTime, endTime)无法生效。 88 89**原子化服务API:** 从API version 13开始,该接口支持在原子化服务中使用。 90 91**系统能力:** SystemCapability.FileManagement.PhotoAccessHelper.Core 92 93**参数:** 94 95 96| 参数名 | 类型 | 必填 | 说明 | 97| ------- | ------- | ---- | ---------------------------- | 98| startTime| number| 是 | 区间播放开始时间,单位:ms。<br/>取值范围:大于等于0。| 99| endTime| number| 是 | 区间播放结束时间,单位:ms。<br/>取值范围:大于startTime。 | 100 101### autoPlay<sup>13+</sup> 102 103autoPlay(isAutoPlay: boolean) 104 105设置自动播放,自动播放一遍视频,完成播放后显示静态图。 106 107**原子化服务API:** 从API version 13开始,该接口支持在原子化服务中使用。 108 109**系统能力:** SystemCapability.FileManagement.PhotoAccessHelper.Core 110 111**参数:** 112 113 114| 参数名 | 类型 | 必填 | 说明 | 115| ------- | ------- | ---- | ---------------------------- | 116| isAutoPlay| boolean| 是 | 是否自动播放。<br/>false:不自动播放。<br/>true:自动播放。<br/>默认值:false。| 117 118### repeatPlay<sup>13+</sup> 119 120repeatPlay(isRepeatPlay: boolean) 121 122设置循环播放,重复播放视频。 repeatPlay与autoPlay及长按播放互斥,repeatPlay设置时,autoPlay和长按播放均不生效。 123 124**原子化服务API:** 从API version 13开始,该接口支持在原子化服务中使用。 125 126**系统能力:** SystemCapability.FileManagement.PhotoAccessHelper.Core 127 128**参数:** 129 130 131| 参数名 | 类型 | 必填 | 说明 | 132| ------- | ------- | ---- | ---------------------------- | 133| isRepeatPlay| boolean| 是 | 是否循环播放。<br/>false:不循环播放。<br/>true:循环播放。<br/>默认值:false。| 134 135### enableAnalyzer<sup>18+</sup> 136 137enableAnalyzer(enabled: boolean) 138 139设置该图片是否支持AI分析,当前支持主体识别、文字识别和对象查找等功能。 140 141**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 142 143**系统能力:** SystemCapability.FileManagement.PhotoAccessHelper.Core 144 145**参数:** 146 147 148| 参数名 | 类型 | 必填 | 说明 | 149| ------- | ------- | ---- | ---------------------------- | 150| enabled| boolean| 是 | 是否开启AI分析。<br/>false:不开启AI分析。<br/>true:开启AI分析。<br/>默认值:true。| 151 152## 事件 153 154除支持[通用事件](../apis-arkui/arkui-ts/ts-component-general-events.md)外,还支持以下事件: 155 156### onComplete<sup>13+</sup> 157 158onComplete(callback: MovingPhotoViewEventCallback) 159 160动态照片加载完成图片时触发该事件。 161 162**原子化服务API:** 从API version 13开始,该接口支持在原子化服务中使用。 163 164**系统能力:** SystemCapability.FileManagement.PhotoAccessHelper.Core 165 166**参数:** 167 168 169| 参数名 | 类型 | 必填 | 说明 | 170| -------- | ------------------------------------------------------------- | ---- | ------------------------------ | 171| callback | [MovingPhotoViewEventCallback](#movingphotovieweventcallback) | 是 | 动态照片加载完成图片的回调。 | 172 173### onStart 174 175onStart(callback: MovingPhotoViewEventCallback) 176 177播放时触发该事件。 178 179**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 180 181**系统能力:** SystemCapability.FileManagement.PhotoAccessHelper.Core 182 183**参数:** 184 185 186| 参数名 | 类型 | 必填 | 说明 | 187| -------- | ------------------------------------------------------------- | ---- | ------------------------------ | 188| callback | [MovingPhotoViewEventCallback](#movingphotovieweventcallback) | 是 | 动态照片开始播放时触发的回调。 | 189 190### onPause 191 192onPause(callback: MovingPhotoViewEventCallback) 193 194播放暂停时触发该事件。 195 196**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 197 198**系统能力:** SystemCapability.FileManagement.PhotoAccessHelper.Core 199 200**参数:** 201 202 203| 参数名 | 类型 | 必填 | 说明 | 204| -------- | ------------------------------------------------------------- | ---- | ------------------------------ | 205| callback | [MovingPhotoViewEventCallback](#movingphotovieweventcallback) | 是 | 动态照片播放暂停时触发的回调。 | 206 207### onFinish 208 209onFinish(callback: MovingPhotoViewEventCallback) 210 211播放结束时触发该事件。 212 213**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 214 215**系统能力:** SystemCapability.FileManagement.PhotoAccessHelper.Core 216 217**参数:** 218 219 220| 参数名 | 类型 | 必填 | 说明 | 221| -------- | ------------------------------------------------------------- | ---- | ------------------------------ | 222| callback | [MovingPhotoViewEventCallback](#movingphotovieweventcallback) | 是 | 动态照片播放结束时触发的回调。 | 223 224### onError 225 226onError(callback: MovingPhotoViewEventCallback) 227 228播放失败时触发该事件。 229 230**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 231 232**系统能力:** SystemCapability.FileManagement.PhotoAccessHelper.Core 233 234**参数:** 235 236 237| 参数名 | 类型 | 必填 | 说明 | 238| -------- | ------------------------------------------------------------- | ---- | ------------------------------ | 239| callback | [MovingPhotoViewEventCallback](#movingphotovieweventcallback) | 是 | 动态照片播放失败时触发的回调。 | 240 241### onStop 242 243onStop(callback: MovingPhotoViewEventCallback) 244 245播放停止时触发该事件(当stop()方法被调用后触发)。 246 247**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 248 249**系统能力:** SystemCapability.FileManagement.PhotoAccessHelper.Core 250 251**参数:** 252 253 254| 参数名 | 类型 | 必填 | 说明 | 255| -------- | ------------------------------------------------------------- | ---- | ------------------------------ | 256| callback | [MovingPhotoViewEventCallback](#movingphotovieweventcallback) | 是 | 动态照片停止播放时触发的回调。 | 257 258## MovingPhotoViewEventCallback 259 260declare type MovingPhotoViewEventCallback = () => void 261 262动态照片播放状态发生变化时触发的回调。 263 264## MovingPhotoViewController 265 266一个MovingPhotoViewController对象可以控制一个MovingPhotoView,可用视频播放实例请参考[@ohos.multimedia.media](../apis-media-kit/js-apis-media.md)。 267 268### startPlayback 269 270startPlayback(): void 271 272开始播放。 273 274**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 275 276**系统能力:** SystemCapability.FileManagement.PhotoAccessHelper.Core 277 278### stopPlayback 279 280stopPlayback(): void 281 282停止播放,再次播放时从头开始播放。 283 284**原子化服务API:** 从API version 12开始,该接口支持在原子化服务中使用。 285 286**系统能力:** SystemCapability.FileManagement.PhotoAccessHelper.Core 287 288### refreshMovingPhoto<sup>18+</sup> 289 290refreshMovingPhoto(): void 291 292强制刷新动态照片组件加载的视频和图片资源,会打断组件当前的行为,使用时要谨慎。 293 294**原子化服务API:** 从API version 18开始,该接口支持在原子化服务中使用。 295 296**系统能力:** SystemCapability.FileManagement.PhotoAccessHelper.Core 297 298## 示例1:多种形式播放动态照片 299 300```ts 301// xxx.ets 302import { photoAccessHelper } from '@kit.MediaLibraryKit'; 303import { emitter } from '@kit.BasicServicesKit'; 304import { dataSharePredicates } from '@kit.ArkData'; 305import { MovingPhotoView, MovingPhotoViewController, MovingPhotoViewAttribute } from '@kit.MediaLibraryKit'; 306 307const PHOTO_SELECT_EVENT_ID: number = 80001 308 309@Entry 310@Component 311struct MovingPhotoViewDemo { 312 @State src: photoAccessHelper.MovingPhoto | undefined = undefined 313 @State isMuted: boolean = false 314 controller: MovingPhotoViewController = new MovingPhotoViewController() 315 private uiContext: UIContext = this.getUIContext() 316 317 aboutToAppear(): void { 318 emitter.on({ 319 eventId: PHOTO_SELECT_EVENT_ID, 320 priority: emitter.EventPriority.IMMEDIATE, 321 }, (eventData: emitter.EventData) => { 322 this.src = AppStorage.get<photoAccessHelper.MovingPhoto>('mv_data') as photoAccessHelper.MovingPhoto 323 }) 324 } 325 326 aboutToDisappear(): void { 327 emitter.off(PHOTO_SELECT_EVENT_ID) 328 } 329 330 build() { 331 Column() { 332 Row() { 333 Button('PICK') 334 .margin(5) 335 .onClick(async () => { 336 try { 337 let uris: Array<string> = [] 338 const photoSelectOptions = new photoAccessHelper.PhotoSelectOptions() 339 photoSelectOptions.MIMEType = photoAccessHelper.PhotoViewMIMETypes.IMAGE_VIDEO_TYPE 340 photoSelectOptions.maxSelectNumber = 2 341 const photoViewPicker = new photoAccessHelper.PhotoViewPicker() 342 let photoSelectResult: photoAccessHelper.PhotoSelectResult = await photoViewPicker.select(photoSelectOptions) 343 uris = photoSelectResult.photoUris 344 if (uris[0]) { 345 this.handlePickerResult(this.uiContext.getHostContext()!, uris[0], new MediaDataHandlerMovingPhoto()) 346 } 347 } catch (e) { 348 console.error(`pick file failed`) 349 } 350 }) 351 } 352 .alignItems(VerticalAlign.Center) 353 .justifyContent(FlexAlign.Center) 354 .height('15%') 355 356 Row() { 357 Column() { 358 MovingPhotoView({ 359 movingPhoto: this.src, 360 controller: this.controller 361 }) 362 .width('100%') 363 .height('100%') 364 .muted(this.isMuted) 365 .autoPlay(true) 366 .repeatPlay(false) 367 .autoPlayPeriod(0, 600) 368 .objectFit(ImageFit.Cover) 369 .onComplete(() => { 370 console.log('Completed'); 371 }) 372 .onStart(() => { 373 console.log('onStart') 374 }) 375 .onFinish(() => { 376 console.log('onFinish') 377 }) 378 .onStop(() => { 379 console.log('onStop') 380 }) 381 .onError(() => { 382 console.log('onError') 383 }) 384 } 385 } 386 .height('70%') 387 388 Row() { 389 Button('start') 390 .onClick(() => { 391 this.controller.startPlayback() 392 }) 393 .margin(5) 394 Button('stop') 395 .onClick(() => { 396 this.controller.stopPlayback() 397 }) 398 .margin(5) 399 Button('mute') 400 .onClick(() => { 401 this.isMuted = !this.isMuted 402 }) 403 .margin(5) 404 } 405 .alignItems(VerticalAlign.Center) 406 .justifyContent(FlexAlign.Center) 407 .height('15%') 408 } 409 } 410 411 async handlePickerResult(context: Context, uri: string, handler: photoAccessHelper.MediaAssetDataHandler<photoAccessHelper.MovingPhoto>): Promise<void> { 412 let uriPredicates: dataSharePredicates.DataSharePredicates = new dataSharePredicates.DataSharePredicates(); 413 uriPredicates.equalTo('uri', uri) 414 let fetchOptions: photoAccessHelper.FetchOptions = { 415 fetchColumns: [], 416 predicates: uriPredicates 417 }; 418 let phAccessHelper = photoAccessHelper.getPhotoAccessHelper(context) 419 let assetResult = await phAccessHelper.getAssets(fetchOptions) 420 let asset = await assetResult.getFirstObject() 421 let requestOptions: photoAccessHelper.RequestOptions = { 422 deliveryMode: photoAccessHelper.DeliveryMode.FAST_MODE, 423 } 424 try { 425 photoAccessHelper.MediaAssetManager.requestMovingPhoto(context, asset, requestOptions, handler) 426 } catch (err) { 427 console.error("request error: ", err) 428 } 429 } 430} 431 432class MediaDataHandlerMovingPhoto implements photoAccessHelper.MediaAssetDataHandler<photoAccessHelper.MovingPhoto> { 433 async onDataPrepared(movingPhoto: photoAccessHelper.MovingPhoto) { 434 AppStorage.setOrCreate('mv_data', movingPhoto) 435 emitter.emit({ 436 eventId: PHOTO_SELECT_EVENT_ID, 437 priority: emitter.EventPriority.IMMEDIATE, 438 }, { 439 }) 440 } 441} 442``` 443## 示例2:图像分析功能使用 444 445```ts 446// xxx.ets 447import { photoAccessHelper } from '@kit.MediaLibraryKit'; 448import { emitter } from '@kit.BasicServicesKit'; 449import { dataSharePredicates } from '@kit.ArkData'; 450import { MovingPhotoView, MovingPhotoViewController, MovingPhotoViewAttribute } from '@kit.MediaLibraryKit'; 451import visionImageAnalyzer from '@hms.ai.visionImageAnalyzer'; 452const PHOTO_SELECT_EVENT_ID: number = 80001 453 454@Entry 455@Component 456struct MovingPhotoViewDemo { 457 @State src: photoAccessHelper.MovingPhoto | undefined = undefined 458 @State isMuted: boolean = false 459 controller: MovingPhotoViewController = new MovingPhotoViewController() 460 private aiController: visionImageAnalyzer.VisionImageAnalyzerController = 461 new visionImageAnalyzer.VisionImageAnalyzerController() 462 private options: ImageAIOptions = { 463 types: [ImageAnalyzerType.SUBJECT, ImageAnalyzerType.TEXT, ImageAnalyzerType.OBJECT_LOOKUP], 464 aiController: this.aiController 465 } 466 private uiContext: UIContext = this.getUIContext() 467 468 aboutToAppear(): void { 469 emitter.on({ 470 eventId: PHOTO_SELECT_EVENT_ID, 471 priority: emitter.EventPriority.IMMEDIATE, 472 }, (eventData: emitter.EventData) => { 473 this.src = AppStorage.get<photoAccessHelper.MovingPhoto>('mv_data') as photoAccessHelper.MovingPhoto 474 }) 475 } 476 477 aboutToDisappear(): void { 478 emitter.off(PHOTO_SELECT_EVENT_ID) 479 } 480 481 build() { 482 Column() { 483 Row() { 484 Button('PICK') 485 .margin(5) 486 .onClick(async () => { 487 try { 488 let uris: Array<string> = [] 489 const photoSelectOptions = new photoAccessHelper.PhotoSelectOptions() 490 photoSelectOptions.MIMEType = photoAccessHelper.PhotoViewMIMETypes.IMAGE_VIDEO_TYPE 491 photoSelectOptions.maxSelectNumber = 2 492 const photoViewPicker = new photoAccessHelper.PhotoViewPicker() 493 let photoSelectResult: photoAccessHelper.PhotoSelectResult = await photoViewPicker.select(photoSelectOptions) 494 uris = photoSelectResult.photoUris 495 if (uris[0]) { 496 this.handlePickerResult(this.uiContext.getHostContext()!, uris[0], new MediaDataHandlerMovingPhoto()) 497 } 498 } catch (e) { 499 console.error(`pick file failed`) 500 } 501 }) 502 } 503 .alignItems(VerticalAlign.Center) 504 .justifyContent(FlexAlign.Center) 505 .height('15%') 506 507 Row() { 508 Column() { 509 MovingPhotoView({ 510 movingPhoto: this.src, 511 controller: this.controller, 512 imageAIOptions: this.options 513 }) 514 .width('100%') 515 .height('100%') 516 .muted(this.isMuted) 517 .autoPlay(true) 518 .repeatPlay(false) 519 .autoPlayPeriod(0, 600) 520 .objectFit(ImageFit.Cover) 521 .enableAnalyzer(true) 522 .onComplete(() => { 523 console.log('Completed'); 524 }) 525 .onStart(() => { 526 console.log('onStart') 527 }) 528 .onFinish(() => { 529 console.log('onFinish') 530 }) 531 .onStop(() => { 532 console.log('onStop') 533 }) 534 .onError(() => { 535 console.log('onError') 536 }) 537 } 538 } 539 .height('70%') 540 541 Row() { 542 Button('start') 543 .onClick(() => { 544 this.controller.startPlayback() 545 }) 546 .margin(5) 547 Button('stop') 548 .onClick(() => { 549 this.controller.stopPlayback() 550 }) 551 .margin(5) 552 Button('mute') 553 .onClick(() => { 554 this.isMuted = !this.isMuted 555 }) 556 .margin(5) 557 } 558 .alignItems(VerticalAlign.Center) 559 .justifyContent(FlexAlign.Center) 560 .height('15%') 561 } 562 } 563 564 async handlePickerResult(context: Context, uri: string, handler: photoAccessHelper.MediaAssetDataHandler<photoAccessHelper.MovingPhoto>): Promise<void> { 565 let uriPredicates: dataSharePredicates.DataSharePredicates = new dataSharePredicates.DataSharePredicates(); 566 uriPredicates.equalTo('uri', uri) 567 let fetchOptions: photoAccessHelper.FetchOptions = { 568 fetchColumns: [], 569 predicates: uriPredicates 570 }; 571 let phAccessHelper = photoAccessHelper.getPhotoAccessHelper(context) 572 let assetResult = await phAccessHelper.getAssets(fetchOptions) 573 let asset = await assetResult.getFirstObject() 574 let requestOptions: photoAccessHelper.RequestOptions = { 575 deliveryMode: photoAccessHelper.DeliveryMode.FAST_MODE, 576 } 577 try { 578 photoAccessHelper.MediaAssetManager.requestMovingPhoto(context, asset, requestOptions, handler) 579 } catch (err) { 580 console.error("request error: ", err) 581 } 582 } 583} 584 585class MediaDataHandlerMovingPhoto implements photoAccessHelper.MediaAssetDataHandler<photoAccessHelper.MovingPhoto> { 586 async onDataPrepared(movingPhoto: photoAccessHelper.MovingPhoto) { 587 AppStorage.setOrCreate('mv_data', movingPhoto) 588 emitter.emit({ 589 eventId: PHOTO_SELECT_EVENT_ID, 590 priority: emitter.EventPriority.IMMEDIATE, 591 }, { 592 }) 593 } 594} 595``` 596## 示例3:在原子化服务中使用动态照片 597 598```ts 599// xxx.ets 600import { photoAccessHelper, MovingPhotoView, MovingPhotoViewController, MovingPhotoViewAttribute } from '@kit.MediaLibraryKit'; 601 602let data: photoAccessHelper.MovingPhoto 603async function loading(context: Context) { 604 try { 605 // 需要确保imageFileUri和videoFileUri对应的资源在应用沙箱存在。 606 let imageFileUri = 'file://{bundleName}/data/storage/el2/base/haps/entry/files/xxx.jpg'; 607 let videoFileUri = 'file://{bundleName}/data/storage/el2/base/haps/entry/files/xxx.mp4'; 608 data = await photoAccessHelper.MediaAssetManager.loadMovingPhoto(context, imageFileUri, videoFileUri); 609 console.info('load moving photo successfully'); 610 } catch (err) { 611 console.error(`load moving photo failed with error: ${err.code}, ${err.message}`); 612 } 613} 614@Entry 615@Component 616struct Index { 617 controller: MovingPhotoViewController = new MovingPhotoViewController() 618 private uiContext: UIContext = this.getUIContext() 619 @State ImageFit: ImageFit | undefined | null = ImageFit.Contain; 620 @State flag: boolean = true; 621 @State autoPlayFlag: boolean = true; 622 @State repeatPlayFlag: boolean = false; 623 @State autoPlayPeriodStart: number = 0; 624 @State autoPlayPeriodEnd: number = 500; 625 aboutToAppear(): void { 626 loading(this.uiContext.getHostContext()!) 627 } 628 629 build() { 630 NavDestination() { 631 Column() { 632 Stack({ alignContent: Alignment.BottomStart }) { 633 MovingPhotoView({ 634 movingPhoto: data, 635 controller: this.controller 636 }) 637 .width(300) 638 .height(400) 639 .muted(this.flag) 640 .objectFit(this.ImageFit) 641 .autoPlay(this.autoPlayFlag) 642 .autoPlayPeriod(this.autoPlayPeriodStart, this.autoPlayPeriodEnd) 643 .repeatPlay(this.repeatPlayFlag) 644 .onComplete(() => { 645 console.info('onComplete') 646 }) 647 .onStart(() => { 648 console.info('onStart') 649 }) 650 .onStop(() => { 651 console.info('onStop') 652 }) 653 .onPause(() => { 654 console.info('onPause') 655 }) 656 .onFinish(() => { 657 console.info('onFinish') 658 }) 659 .onError(() => { 660 console.info('onError') 661 }) 662 } 663 664 Row() { 665 Button('Play') 666 .onClick(() => { 667 this.controller.startPlayback() 668 }) 669 Button('StopPlay') 670 .onClick(() => { 671 this.controller.stopPlayback() 672 }) 673 Button('refreshMovingPhoto') 674 .onClick(() => { 675 this.controller.refreshMovingPhoto() 676 }) 677 Button('mute').id('MovingPhotoView_true') 678 .onClick(() => { 679 this.flag = false 680 }) 681 } 682 } 683 } 684 } 685} 686```