帖子
帖子
用户
博客
课程
显示全部楼层
216
帖子
5
勋章
5939
Y币

volume模块demo示例

[复制链接]
发表于 2019-7-13 14:52:20
本模块封装了原生代码调节app系统媒体音量功能(备注:由于iOS系统的特有情况,调节音量会自动弹出系统的音量图标)。

点击进入模块详情

  1. <!DOCTYPE html>
  2. <html>

  3. <head>
  4.     <title>Module Develop</title>
  5.     <meta charset="utf-8">
  6.     <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
  7.     <style type="text/css">
  8.         html,
  9.         body {
  10.             height: 100%
  11.         }

  12.         body {
  13.             background-color: #fff;
  14.             margin: 0;
  15.         }

  16.         #wrap {
  17.             height: 100%;
  18.             position: relative;
  19.         }

  20.         #header {
  21.             padding-top: 20px;
  22.             background-color: #5082c2;
  23.             height: 44px;
  24.             position: relative;
  25.         }

  26.         #header h1 {
  27.             font-size: 20px;
  28.             height: 44px;
  29.             line-height: 44px;
  30.             margin: 0em;
  31.             color: #fff;
  32.             margin-left: 100px;
  33.             margin-right: 100px;
  34.             text-align: center;
  35.         }

  36.         #main {
  37.             display: -webkit-box;
  38.             -webkit-box-orient: vertical;
  39.             -webkit-box-pack: center;
  40.         }

  41.         a.button {
  42.             display: -webkit-box;
  43.             -webkit-box-orient: vertical;
  44.             -webkit-box-pack: center;
  45.             -webkit-box-align: center;
  46.             height: 32px;
  47.             margin: 8px;
  48.             background-color: rgba(240, 240, 240, 1.0);
  49.             border-color: rgba(220, 220, 220, 1.0);
  50.             border-width: 2px;
  51.             border-style: solid;
  52.         }

  53.         a.active {
  54.             background-color: rgba(240, 240, 240, 0.7);
  55.         }
  56.     </style>
  57. </head>

  58. <body>
  59.     <div id="wrap">
  60.         <div id="main">
  61.             <a class="button" tapmode="active" onclick="startPlay()">播放音乐</a>

  62.             <a class="button" tapmode="active" onclick="initVolume()">初始化</a>
  63.             <a class="button" tapmode="active" onclick="getVolume()">获取当前音量</a>
  64.             <a class="button" tapmode="active" onclick="setVolume(0)">设置媒体音量0</a>
  65.             <a class="button" tapmode="active" onclick="setVolume(10)">设置媒体音量10</a>
  66.             <a class="button" tapmode="active" onclick="setVolume(50)">设置媒体音量50</a>
  67.             <a class="button" tapmode="active" onclick="setVolume(80)">设置媒体音量80</a>
  68.             <a class="button" tapmode="active" onclick="setVolume(100)">设置媒体音量100</a>
  69.             <a class="button" tapmode="active" onclick="setSpeakerphoneOn()">扬声器与听筒切换</a>
  70.         </div>
  71.     </div>
  72. </body>
  73. <script type="text/javascript" src="../script/api.js"></script>
  74. <script>
  75.     var demo;

  76.     function initVolume() {
  77.         demo.initVolume(function(ret, err) {
  78.             alert(JSON.stringify(ret));
  79.         });
  80.     }

  81.     function getVolume() {
  82.         demo.getVolume(function(ret, err) {
  83.             alert(JSON.stringify(ret));
  84.         });
  85.     }


  86.     function setVolume(index) {
  87.         demo.setVolume({
  88.             volume: index
  89.         }, function(ret, err) {
  90.             alert(JSON.stringify(ret));
  91.         });
  92.     }

  93.     function setSpeakerphoneOn() {
  94.         demo.setSpeakerphoneOn(function(ret, err) {
  95.             alert(JSON.stringify(ret));
  96.         });
  97.     }

  98.     function startPlay() {
  99.         api.startPlay({
  100.             path: 'widget://res/shangxuege.mp3'
  101.         }, function(ret, err) {});
  102.     }

  103.     function apiready() {
  104.         demo = api.require('volume');
  105.         if (!demo) {
  106.             alert("请添加模块后编译");
  107.             return;
  108.         }

  109.     }
  110. </script>

  111. </html>
复制代码


您需要登录后才可以回帖 登录

本版积分规则