diff --git a/en/application-dev/ui/video.md b/en/application-dev/ui/video.md new file mode 100644 index 0000000000000000000000000000000000000000..58510f8728859d0bdc0e8f4836ff5255da399c29 --- /dev/null +++ b/en/application-dev/ui/video.md @@ -0,0 +1,210 @@ +# video + +- [Child Components](#zh-cn_topic_0000001058670744_section9288143101012) +- [Attributes](#zh-cn_topic_0000001058670744_section2907183951110) +- [Events](#zh-cn_topic_0000001058670744_section3892191911214) +- [Methods](#zh-cn_topic_0000001058670744_section45171131134215) +- [Example](#zh-cn_topic_0000001058670746_section16867208402) + +The <video> component provides a video player. + +## Child Components + +Not supported. + +## Attributes + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

Name

+

Type

+

Default Value

+

Mandatory

+

Description

+

src

+

string

+

-

+

No

+

Path of the video to play.

+

muted

+

boolean

+

false

+

No

+

Whether the video is muted.

+

autoplay

+

boolean

+

false

+

No

+

Whether the video is automatically played.

+

controls

+

boolean

+

true

+

No

+

Whether to display the video playback control bar. The value false means not to display the control bar, and true means that the display of the control bar is controlled by the system. The default value is true.

+
+ +## Events + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

Name

+

Parameter

+

Description

+

start

+

-

+

Triggered when video playback starts.

+

pause

+

-

+

Triggered when video playback is paused.

+

finish

+

-

+

Triggered when video playback is finished.

+

error

+

-

+

Triggered when video playback fails.

+

seeking

+

{ currenttime: value(s) }

+

Time reported when the seek bar is being manipulated, in seconds.

+

seeked

+

{ currenttime: value(s) }

+

Time reported when the seek operation completes, in seconds.

+

timeupdate

+

{ currenttime: value(s) }

+

Current video playback time (in seconds) reported when the playback progress changes. This time is reported every 250 ms.

+
+ +## Methods + + + + + + + + + + + + + + + + + + + + +

Name

+

Parameter

+

Description

+

start

+

-

+

Starts video playback.

+

pause

+

-

+

Pauses video playback.

+

setCurrentTime

+

{ currenttime: value(s) }

+

Sets the seek position of the video.

+
+ +## Example + +``` + +
+ +
+``` + +``` +/* xxx.js */ +export default { + data: { + event:'', + seekingtime:'', + timeupdatetime:'', + seekedtime:'', + isStart: true, + }, + startCallback:function(){this.event = 'Video playback starts.';}, + pauseCallback:function(){this.event = 'Video playback is paused.';}, + finishCallback:function(){this.event = 'Video playback is finished.';}, + errorCallback:function(){this.event = 'Video playback fails.';}, + seekingCallback:function(e){ this.seekingtime = e.currenttime; }, + timeupdateCallback:function(e){ this.timeupdatetime = e.currenttime;}, + change_start_pause: function() { + if(this.isStart) { + this.$element('videoId').pause(); + this.isStart = false; + } else { + this.$element('videoId').start(); + this.isStart = true; + } + } +} +```