2021-12-21

3 years ago · 82f674e5dc
parent 78833a9588
commit 82f674e5dc
15 changed files with 154 additions and 28 deletions
--- a/app.json
+++ b/app.json
@ -23,7 +23,7 @@
        "pages/test/textarea",
        "pages/test/audio",
        "pages/test/image",
-        "pages/test/vedio",
+        "pages/test/video",
        "pages/test/camera"
    ],
    "window": {
--- a/images/R-C.jpg
+++ b/images/R-C.jpg
--- a/pages/index/index.js
+++ b/pages/index/index.js
@ -44,7 +44,7 @@ Page({
        pages:[
          {title:'audio组件',url: "../test/audio"},
          {title:'image组件',url: "../test/image"},
-          {title:'vedio组件',url: "../test/vedio"},
+          {title:'video组件',url: "../test/video"},
          {title:'camera组件',url: "../test/camera"}
        ]
      }
--- a/pages/test/audio.js
+++ b/pages/test/audio.js
@ -5,18 +5,25 @@ Page({
     * 页面的初始数据
     */
    data: {
-        poster:'https://img.1ting.com/images/special/15/s300_2e0d202a2f39d3431d53053dac7f49c0.jpg',
-        name:'朋友',
-        author:'周华健',
-        src:'https://www.1ting.com/api/audio?/2021/12/08/08b_zd/01.mp3'
+        poster:'',
+        name:'删了吧',
+        author:'许佳豪',
+        src:'https://mp3.haoge500.com/upload/320/2021/11/11/1234749.mp3'
+    },
+    audioPlay:function(){
+        this.audioCtx.play();
+    },
+    audioPause:function(){
+        this.audioCtx.pause();
+    },
+    audioSeek0:function(){
+        this.audioCtx.seek(0);
    },
-
    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: function (options) {
-        const audioCtx=wx.createInnerAudioContext();
-        audioCtx.src='https://mp3.haoge500.com/upload/320/2021/11/11/1234749.mp3';
+        this.audioCtx=wx.createAudioContext('myAudio');
    },

    /**
--- a/pages/test/audio.wxml
+++ b/pages/test/audio.wxml
@ -3,4 +3,7 @@
 <view class="demobox">
    <view class="title">播放网络音频</view>
    <audio id="myAudio" poster="{{poster}}" name="{{name}}" author="{{author}}" src="{{src}}" controls="true" loop="true"></audio>
+    <button size="mini" bindtap="audioPlay">播放</button>
+    <button size="mini" bindtap="audioPause">暂停</button>
+    <button size="mini" bindtap="audioSeek0">回到开头</button>
 </view>
--- a/pages/test/camera.js
+++ b/pages/test/camera.js
@ -5,14 +5,21 @@ Page({
     * 页面的初始数据
     */
    data: {
-
+        
+    },
+    takePhoto:function(){
+        this.cameraCtx.takePhoto({
+            quality:'high',
+            success:(res)=>{
+                this.setData({src:res.tempImagePath});  
+            }
+        });
    },
-
    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: function (options) {
-
+        this.cameraCtx=wx.createCameraContext();
    },

    /**
--- a/pages/test/camera.wxml
+++ b/pages/test/camera.wxml
@ -1,2 +1,8 @@
 <!--pages/test/camera.wxml-->
 <text>pages/test/camera.wxml</text>
+<view class="demobox">
+  <view class="title">开启相机</view>
+  <camera device-position="back" flash="auto" style="width: 100%;height: 300px;"></camera>
+  <button type="primary" bindtap="takePhoto">拍照</button>
+  <image wx:if="{{src}}" mode="widthFix" src="{{src}}"></image>
+</view>
--- a/pages/test/image.wxml
+++ b/pages/test/image.wxml
@ -1,2 +1,14 @@
 <!--pages/test/image.wxml-->
 <text>pages/test/image.wxml</text>
+<view class="demobox">
+  <view class="title">1.缩放模式:scaleToFill不保持纵横比例缩放图片，使图片完全适应</view>
+  <image src='../../images/R-C.jpg' mode="scaleToFill"></image>
+  <view class="title">2.缩放模式:aspectFit保持纵横比例缩放图片，使长边能完全显示</view>
+  <image src='../../images/R-C.jpg' mode="aspectFit"></image>
+  <view class="title">3.缩放模式:aspectFill保持纵横比例缩放图片，只保证短边完全显示</view>
+  <image src='../../images/R-C.jpg' mode="aspectFill"></image>
+  <view class="title">4.缩放模式:widthFix宽度不变，高度变化，保持纵横比例</view>
+  <image src='../../images/R-C.jpg' mode="widthFix"></image>
+  <view class="title">5.裁剪模式:top不缩放图片，只显示图片的顶部区域</view>
+  <image src='../../images/R-C.jpg' mode="top"></image>
+</view>
--- a/pages/test/image.wxss
+++ b/pages/test/image.wxss
@ -1 +1,5 @@
-/* pages/test/image.wxss */
+/* pages/test/image.wxss */
+image{
+  width: 300rpx;
+  height: 300rpx;
+}
--- a/pages/test/vedio.wxml
+++ b/pages/test/vedio.wxml
@ -1,2 +0,0 @@
-<!--pages/test/vedio.wxml-->
-<text>pages/test/vedio.wxml</text>
--- a/pages/test/video.js
+++ b/pages/test/video.js
@ -0,0 +1,71 @@
+// pages/test/vedio.js
+Page({
+
+    /**
+     * 页面的初始数据
+     */
+    data: {
+        src:'http://wxsnsdy.tc.qq.com/105/20210/snsdyvideodownload?filekey=30280201010421301f0201690402534804102ca905ce620b1241b726bc41dcff44e00204012882540400&bizid=1023&hy=SH&fileparam=302c020101042530230204136ffd93020457e3c4ff02024ef202031e8d7f02030f42400204045a320a0201000400',
+        danmulist:[
+            {text:'第1s出现',color:'yellow',time:1},
+            {text:'第3s出现',color:'purple',time:3},
+            {text:'第7s出现',color:'red',time:7}
+        ]
+    },
+
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad: function (options) {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面初次渲染完成
+     */
+    onReady: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面隐藏
+     */
+    onHide: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面卸载
+     */
+    onUnload: function () {
+
+    },
+
+    /**
+     * 页面相关事件处理函数--监听用户下拉动作
+     */
+    onPullDownRefresh: function () {
+
+    },
+
+    /**
+     * 页面上拉触底事件的处理函数
+     */
+    onReachBottom: function () {
+
+    },
+
+    /**
+     * 用户点击右上角分享
+     */
+    onShareAppMessage: function () {
+
+    }
+})
--- a/pages/test/video.json
+++ b/pages/test/video.json
@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}
--- a/pages/test/video.wxml
+++ b/pages/test/video.wxml
@ -0,0 +1,6 @@
+<!--pages/test/vedio.wxml-->
+<text>pages/test/vedio.wxml</text>
+<view class="demobox">
+  <view class="title">播放网络视频</view>
+  <video src="{{src}}" controls="true" autoplay="true" danmu-list="{{danmulist}}"></video>
+</view>
--- a/pages/test/video.wxss
+++ b/pages/test/video.wxss
@ -0,0 +1 @@
+/* pages/test/vedio.wxss */
--- a/project.config.json
+++ b/project.config.json
@ -9,34 +9,42 @@
    ]
  },
  "setting": {
-    "bundle": false,
-    "userConfirmedBundleSwitch": false,
    "urlCheck": true,
-    "scopeDataCheck": false,
-    "coverView": true,
    "es6": true,
+    "enhance": true,
    "postcss": true,
-    "compileHotReLoad": false,
-    "lazyloadPlaceholderEnable": false,
    "preloadBackgroundData": false,
    "minified": true,
-    "autoAudits": false,
    "newFeature": false,
+    "coverView": true,
+    "nodeModules": false,
+    "autoAudits": false,
+    "showShadowRootInWxmlPanel": true,
+    "scopeDataCheck": false,
    "uglifyFileName": false,
+    "checkInvalidKey": true,
+    "checkSiteMap": true,
    "uploadWithSourceMap": true,
-    "useIsolateContext": true,
-    "nodeModules": false,
-    "enhance": true,
+    "compileHotReLoad": false,
+    "lazyloadPlaceholderEnable": false,
    "useMultiFrameRuntime": true,
    "useApiHook": true,
    "useApiHostProcess": true,
-    "showShadowRootInWxmlPanel": true,
-    "packNpmManually": false,
+    "babelSetting": {
+      "ignore": [],
+      "disablePlugins": [],
+      "outputPath": ""
+    },
    "enableEngineNative": false,
+    "useIsolateContext": true,
+    "userConfirmedBundleSwitch": false,
+    "packNpmManually": false,
    "packNpmRelationList": [],
    "minifyWXSS": true,
+    "disableUseStrict": false,
+    "minifyWXML": true,
    "showES6CompileOption": false,
-    "minifyWXML": true
+    "useCompilerPlugins": false
  },
  "compileType": "miniprogram",
  "libVersion": "2.19.4",