Micro-Letter Applet-Pictures, audio recordings, sound playback, music playback, video, file code examples _javascript tips

Source: Internet
Author: User
Tags button type

This paper introduces the development of micro-credit program, mainly including pictures, audio recordings, sound playback, music playback, video, documents, as follows:

Image:

Wx.chooseimage (OBJECT)

Select a picture from your local album or take a photo with your camera.

Object parameter Description:

Note: The temporary path of the file, in the small program during this startup can be used normally, such as the need for lasting preservation, in the active call Wx.savefile, the next time the applet can be accessed.

Sample code:

Wx.chooseimage ({
 count:1,//Default 9
 sizetype: [' original ', ' compressed '],//can specify whether it is an original or a compressed image, the default is both
 sourcetype : [' album ', ' Camera '],//You can specify whether the source is an album or a camera, both of which have
 success:function (res) {
  //Returns a list of local file paths for the selected photos, TempFilePath can be used as the SRC attribute of the IMG tag to display the picture
  var tempfilepaths = res.tempfilepaths
 }
})

Wx.previewimage (OBJECT)

Preview the picture.

Object parameter Description:

Sample code:

Wx.previewimage ({
 current: ",////The HTTP URL of the currently displayed picture
 : []//The picture you want to preview HTTP link list
})

Wx.getimageinfo (OBJECT)

Get picture information

Object parameter Description:

Success Return Parameter Description:

Sample code:

Wx.getimageinfo ({
 src: ' images/a.jpg ',
 success:function (res) {
  console.log (res.width)
  Console.log (res.height)
 }
})

wx.chooseimage ({
 success:function (res) {
  Wx.getimageinfo ({
   Src:res.tempfilepaths[0],
   success:function (res) {
    console.log (res.width)
    Console.log ( res.height)}}})

Recording:

Wx.startrecord (OBJECT)

Start recording. Returns the temporary file path of the recording file when the Wx.stoprecord is invoked voluntarily, or when the recording is over 1 minutes and automatically ends the recording.

Object parameter Description:

Note: The temporary path of the file, in the small program during this startup can be used normally, such as the need for lasting preservation, in the active call Wx.savefile, the next time the applet can be accessed.

Wx.stoprecord ()

The active call stops recording.

Sample code:

Wx.startrecord ({
 success:function (res) {
  var tempfilepath = Res.tempfilepath 
 },
 fail:function (RES) {
   //recording failed
 }
})
settimeout (function () {
 //End recording 
 Wx.stoprecord ()
}, 10000)

Audio playback control:

Wx.playvoice (OBJECT)

Start playing the voice, while only one voice file is playing, if the previous voice file is not finished, the previous speech playback will be interrupted.

Object parameter Description:

Sample code:

Wx.startrecord ({
 success:function (res) {
  var tempfilepath = Res.tempfilepath
  wx.playvoice ({
   Filepath:tempfilepath,
   complete:function () {
   }}}
)

Wx.pausevoice ()

Pauses the voice that is playing. When you call Wx.playvoice again to play the same file, it starts playing from the pause. If you want to play from the beginning, you need to call Wx.stopvoice first.

Sample code:

Wx.startrecord ({
 success:function (res) {
  var tempfilepath = Res.tempfilepath
   wx.playvoice ({
   Filepath:tempfilepath
  })

  settimeout (function () {
    //Pause playback
   wx.pausevoice ()
  }, 5000)
 }
})

Wx.stopvoice ()

Ends the voice playback.

Sample code:

Wx.startrecord ({
 success:function (res) {
  var tempfilepath = Res.tempfilepath
  wx.playvoice ({
   Filepath:tempfilepath
  })

  settimeout (function () {
   wx.stopvoice ()
  }, 5000)
 }}
)

Music Playback control:

Wx.getbackgroundaudioplayerstate (OBJECT)
Gets the music playback status.

Object parameter Description:

Success Return Parameter Description:

Sample code:

Wx.getbackgroundaudioplayerstate ({
  success:function (res) {
    var status = Res.status
    var dataurl = Res.dataurl
    var currentposition = res.currentposition
    var duration = Res.duration
    var downloadpercent = Res.downloadpercent
  }
})

Wx.playbackgroundaudio (OBJECT)

Play music and only one piece of music is playing.

Object parameter Description

Sample code

Wx.playbackgroundaudio ({
  dataurl: ',
  title: ',
  coverimgurl: '
})

Wx.pausebackgroundaudio ()
Pause playing music.

Sample code

Wx.pausebackgroundaudio ()

Wx.seekbackgroundaudio (OBJECT)
Control music playback progress.

Object parameter Description

Sample code

Wx.seekbackgroundaudio ({
  position:30
})

Wx.stopbackgroundaudio ()

Stop playing music.

Sample code

Wx.stopbackgroundaudio ()

Wx.onbackgroundaudioplay (CALLBACK)

Listen for music playback.

Wx.onbackgroundaudiopause (CALLBACK)
Listen for music pauses.

Wx.onbackgroundaudiostop (CALLBACK)

Listen for music to stop.

File:

Wx.savefile (OBJECT)

Save the file to local.

Object parameter Description:

Sample code:

Wx.startrecord ({
 success:function (res) {
  var tempfilepath = Res.tempfilepath
  wx.savefile ({
   Tempfilepath:tempfilepath,
   success:function (res) {
    var savedfilepath = Res.savedfilepath
   }
  })
 }
})

Wx.getsavedfilelist (OBJECT)

Get a list of locally saved files

Object parameter Description:

Success Return Parameter Description:

Description of the project in FileList:

Sample code:

Wx.getsavedfilelist ({
 success:function (res) {
  console.log (res.filelist)
 }
})

Wx.getsavedfileinfo (OBJECT)

Get file information for local files

Object parameter Description:

Success Return Parameter Description:

Sample code:

Wx.getsavedfileinfo ({
 filePath: ' Wxfile://somefile ',//Only for example, not true file path
 success:function (res) {
  Console.log (res.size)
  console.log (res.createtime)
 }
)

Wx.removesavedfile (OBJECT)

To delete a locally stored file

Object parameter Description:

Sample code:

Wx.getsavedfilelist ({
 success:function (res) {
  if (Res.fileList.length > 0) {
   wx.removesavedfile ({
    Filepath:res.filelist[0].filepath,
    complete:function (res) {
     Console.log (res)
    }
   })
  }
 }
})

Wx.opendocument (OBJECT)

New open page open document, support format: Doc, xls, ppt, PDF, docx, xlsx, pptx

Object parameter Description:

Sample code

Wx.downloadfile ({
 URL: ' http://example.com/somefile.pdf ',
 success:function (res) {
  var filePath = Res.tempfilepath 
  wx.opendocument ({
   filepath:filepath,
   success:function (res) {
    Console.log (' Open document Successful '}}}}
)

Video:

Wx.choosevideo (OBJECT)

Take a video or select a video from a phone album to return to the temporary file path of the video.

Object parameter Description:

Return parameter Description:

Note: The temporary path of the file, in the small program during this startup can be used normally, such as the need for lasting preservation, in the active call Wx.savefile, the next time the applet can be accessed.

Sample code:

<view class= "Container" >
  <video src= "{{src}}" ></video>
  <button bindtap= Bindbuttontap "> Get video </button>
</view>
Page ({
  bindbuttontap:function () {
    var that = this
    wx.choosevideo ({
      sourcetype: [' album ', ' Camera '],
      maxduration:60,
      camera: [' Front ', ' Back '],
      success:function (res) {
        that.setdata ({
          src: Res.tempfilepath})}})

Audio Component control:

Wx.createaudiocontext (audioid)

Creates and returns a audio context Audiocontext object

Audiocontext

Audiocontext is bound to a audio component through audioid, which allows it to manipulate a audio component.

List of methods for Audiocontext objects:

Sample code:

 <!--audio.wxml--> <audio src= ' {{src}} ' id= ' Myaudio ' ></audio> <bu Tton type= "PRIMARY" bindtap= "Audioplay" > Play </button> <button type= "PRIMARY" bindtap= "Audiopause" > Pause </button> <button type= "PRIMARY" bindtap= "audio14" > Set current playback time to 14 seconds </button> <button type= "primary "Bindtap=" Audiostart > Back to the beginning </button> 
Audio.js
Page ({
 onready:function (e) {
  //use Wx.createaudiocontext to get audio context contexts
  This.audioctx = Wx.createaudiocontext (' Myaudio ')
 },
 data: {
  src: ' http://ws.stream.qqmusic.qq.com/ m500001vfvsj21xfqb.mp3?guid=ffffffff82def4af4b12b3cd9337d5e7&uin=346897220&vkey= 6292f51e1e384e06dcbdc9ab7c49fd713d632d313ac4858bacb8ddd29067d3c601481d36e62053bf8dfeaf74c0a5ccfadd6471160caf3e6a &fromtag=46 ',
 },
 audioplay:function () {
  this.audioCtx.play ()
 },
 audiopause:function ( {
  this.audioCtx.pause ()
 },
 audio14:function () {This.audioCtx.seek ()}
 ,
 Audiostart:function () {
  this.audioCtx.seek (0)
 }
})

Video Component control:

Wx.createvideocontext (VideoID)

Create and return a video context Videocontext object

Videocontext

Videocontext is bound to a video component through VideoID, which allows it to manipulate a video component.

List of methods for Videocontext objects:

Sample code:

<view class= "section TC" >
 <video id= "Myvideo" src= "http://wxsnsdy.tc.qq.com/105/20210/" snsdyvideodownload?filekey= 30280201010421301f0201690402534804102ca905ce620b1241b726bc41dcff44e00204012882540400&bizid=1023&hy=sh &fileparam=302c020101042530230204136ffd93020457e3c4ff02024ef202031e8d7f02030f42400204045a320a0201000400 "  enable-danmu danmu-btn controls></video>
 <view class= "Btn-area" >
  <input bindblur= " Bindinputblur "/>
  <button bindtap=" Bindsenddanmu "> Send barrage </button>
 </view>
</ View>
function Getrandomcolor () {let
 RGB = [] for
 (Let i = 0; i < 3; ++i) {let
  color = Math.floor (Math.random ( ) * 256). toString
  color = Color.length = = 1? ' 0 ' + color:color
  rgb.push (color)
 } return
 ' # ' + rgb.join (')
}

Page ({
 onready:function ( RES) {
  This.videocontext = wx.createvideocontext (' Myvideo ')
 },
 inputvalue: ',
 Bindinputblur: Function (e) {
  this.inputvalue = E.detail.value
 },
 bindsenddanmu:function () {
  This.videoContext.sendDanmu ({
   text:this.inputValue,
   Color:getrandomcolor ()})}
)

The above is the entire content of this article, I hope to help you learn, but also hope that we support the cloud habitat community.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.