Showing
8 changed files
with
77 additions
and
7 deletions
| @@ -4,6 +4,7 @@ import { Logger } from 'wdKit/Index'; | @@ -4,6 +4,7 @@ import { Logger } from 'wdKit/Index'; | ||
| 4 | import { performJSCallNative } from './JsBridgeBiz'; | 4 | import { performJSCallNative } from './JsBridgeBiz'; |
| 5 | import { H5CallNativeType } from './H5CallNativeType'; | 5 | import { H5CallNativeType } from './H5CallNativeType'; |
| 6 | import { Message } from 'wdJsBridge/src/main/ets/bean/Message'; | 6 | import { Message } from 'wdJsBridge/src/main/ets/bean/Message'; |
| 7 | +import { DateTimeUtils } from 'wdKit' | ||
| 7 | 8 | ||
| 8 | const TAG = 'WdWebLocalComponent'; | 9 | const TAG = 'WdWebLocalComponent'; |
| 9 | 10 | ||
| @@ -22,6 +23,13 @@ export struct WdWebLocalComponent { | @@ -22,6 +23,13 @@ export struct WdWebLocalComponent { | ||
| 22 | @State positionLeft: number = 0 | 23 | @State positionLeft: number = 0 |
| 23 | @State positionTop: number = 0 | 24 | @State positionTop: number = 0 |
| 24 | @State videoLandscape: string = '1' | 25 | @State videoLandscape: string = '1' |
| 26 | + @State curRate: PlaybackSpeed = PlaybackSpeed.Speed_Forward_1_00_X | ||
| 27 | + @State sliderStartTime: string = ''; | ||
| 28 | + @State currentTime: number = 0; | ||
| 29 | + @State durationTime: number = 0; | ||
| 30 | + @State durationStringTime: string = ''; | ||
| 31 | + @State isPause: boolean = true; | ||
| 32 | + controller: VideoController = new VideoController() | ||
| 25 | 33 | ||
| 26 | build() { | 34 | build() { |
| 27 | Column() { | 35 | Column() { |
| @@ -77,12 +85,78 @@ export struct WdWebLocalComponent { | @@ -77,12 +85,78 @@ export struct WdWebLocalComponent { | ||
| 77 | }) | 85 | }) |
| 78 | 86 | ||
| 79 | if (this.videoUrl) { | 87 | if (this.videoUrl) { |
| 80 | - Video({ src: this.videoUrl }) | 88 | + Stack({ alignContent: Alignment.Bottom }) { |
| 89 | + Video({ | ||
| 90 | + src: this.videoUrl, | ||
| 91 | + currentProgressRate: this.curRate, | ||
| 92 | + controller: this.controller | ||
| 93 | + }) | ||
| 94 | + .borderRadius(5) | ||
| 95 | + .controls(false) | ||
| 81 | .autoPlay(true) | 96 | .autoPlay(true) |
| 82 | .objectFit(ImageFit.Contain) | 97 | .objectFit(ImageFit.Contain) |
| 98 | + .onStart(() => { | ||
| 99 | + this.isPause = false | ||
| 100 | + }) | ||
| 101 | + .onPause(() => { | ||
| 102 | + this.isPause = true | ||
| 103 | + }) | ||
| 104 | + .onPrepared((event) => { | ||
| 105 | + if (event) { | ||
| 106 | + this.durationTime = event.duration | ||
| 107 | + } | ||
| 108 | + }) | ||
| 109 | + .onUpdate((event) => { | ||
| 110 | + if (event) { | ||
| 111 | + this.currentTime = event.time | ||
| 112 | + } | ||
| 113 | + }) | ||
| 114 | + Row() { | ||
| 115 | + Image($r(this.isPause ? 'app.media.icon_play' : 'app.media.icon_pause')) | ||
| 116 | + .width(24) | ||
| 117 | + .height(24) | ||
| 118 | + .onClick(()=>{ | ||
| 119 | + if(this.isPause){ | ||
| 120 | + this.controller.start() | ||
| 121 | + }else{ | ||
| 122 | + this.controller.pause() | ||
| 123 | + } | ||
| 124 | + }) | ||
| 125 | + Row() { | ||
| 126 | + Text(DateTimeUtils.getFormattedDuration(this.currentTime * 1000)).fontSize(12).fontColor(Color.White).fontWeight(600) | ||
| 127 | + Slider({ | ||
| 128 | + value: this.currentTime, | ||
| 129 | + min: 0, | ||
| 130 | + max: this.durationTime | ||
| 131 | + }) | ||
| 132 | + .width("50%") | ||
| 133 | + .selectedColor('#ED2800') | ||
| 134 | + .margin({ left: 4, right: 4 }) | ||
| 135 | + // .blockStyle({ | ||
| 136 | + // type: SliderBlockType.IMAGE, | ||
| 137 | + // image: $r('app.media.slider_block') | ||
| 138 | + // }) | ||
| 139 | + // .blockSize({ width: 18, height: 12 }) | ||
| 140 | + .onChange((value: number, mode: SliderChangeMode) => { | ||
| 141 | + this.controller.setCurrentTime(value); | ||
| 142 | + }) | ||
| 143 | + Text(DateTimeUtils.getFormattedDuration(this.durationTime * 1000)).fontSize(12).fontColor(Color.White).fontWeight(600) | ||
| 144 | + } | ||
| 145 | + .justifyContent(FlexAlign.Center) | ||
| 146 | + | ||
| 147 | + Image($r('app.media.icon_full_screen')) | ||
| 148 | + .width(24) | ||
| 149 | + .height(24) | ||
| 150 | + .onClick(()=>{ | ||
| 151 | + this.controller.requestFullscreen(true) | ||
| 152 | + }) | ||
| 153 | + } | ||
| 154 | + .opacity(0.8) | ||
| 155 | + .width("100%") | ||
| 156 | + .justifyContent(FlexAlign.SpaceAround) | ||
| 157 | + } | ||
| 83 | .width(this.positionWidth) | 158 | .width(this.positionWidth) |
| 84 | .height(this.positionHeight) | 159 | .height(this.positionHeight) |
| 85 | - .borderRadius(5) | ||
| 86 | .alignRules({ | 160 | .alignRules({ |
| 87 | top: { anchor: "__container__", align: VerticalAlign.Top }, | 161 | top: { anchor: "__container__", align: VerticalAlign.Top }, |
| 88 | }) | 162 | }) |
| @@ -92,7 +166,6 @@ export struct WdWebLocalComponent { | @@ -92,7 +166,6 @@ export struct WdWebLocalComponent { | ||
| 92 | }) | 166 | }) |
| 93 | .id("video") | 167 | .id("video") |
| 94 | } | 168 | } |
| 95 | - | ||
| 96 | } | 169 | } |
| 97 | }.width('100%') | 170 | }.width('100%') |
| 98 | .height(this.webHeight) | 171 | .height(this.webHeight) |
289 Bytes
339 Bytes
293 Bytes
1.79 KB
497 Bytes
| @@ -169,16 +169,13 @@ export struct ImageAndTextPageComponent { | @@ -169,16 +169,13 @@ export struct ImageAndTextPageComponent { | ||
| 169 | detailedSkeleton() | 169 | detailedSkeleton() |
| 170 | } | 170 | } |
| 171 | } | 171 | } |
| 172 | - | ||
| 173 | //底部交互区 | 172 | //底部交互区 |
| 174 | - if (this.contentDetailData?.length) { | ||
| 175 | OperRowListView({ | 173 | OperRowListView({ |
| 176 | contentDetailData: this.contentDetailData[0], | 174 | contentDetailData: this.contentDetailData[0], |
| 177 | publishCommentModel: this.publishCommentModel, | 175 | publishCommentModel: this.publishCommentModel, |
| 178 | operationButtonList: this.operationButtonList, | 176 | operationButtonList: this.operationButtonList, |
| 179 | }) | 177 | }) |
| 180 | } | 178 | } |
| 181 | - } | ||
| 182 | 179 | ||
| 183 | } | 180 | } |
| 184 | .width(CommonConstants.FULL_WIDTH) | 181 | .width(CommonConstants.FULL_WIDTH) |
| @@ -319,7 +319,7 @@ struct ChannelDialog { | @@ -319,7 +319,7 @@ struct ChannelDialog { | ||
| 319 | } | 319 | } |
| 320 | } | 320 | } |
| 321 | }), | 321 | }), |
| 322 | - PanGesture({ fingers: 1, direction: null, distance: 0 }) | 322 | + PanGesture({ fingers: 1, direction: this.isEditIng ? PanDirection.All:PanDirection.None, distance: 0 }) |
| 323 | .onActionStart((event: GestureEvent) => { | 323 | .onActionStart((event: GestureEvent) => { |
| 324 | this.dragItem = item.num | 324 | this.dragItem = item.num |
| 325 | this.dragRefOffsetX = 0 | 325 | this.dragRefOffsetX = 0 |
-
Please register or login to post a comment