增加虚拟音量键

static/rtcEngine/WXtrialInterface.html

@@ -53,18 +53,24 @@
                     <div class="flex-column-container">
                         <div>
                             <div v-for="item in definitionList" :key="item.key"
-                                :class="['tc drawer-item mb-20', {active: definitionValue === item.value}]"
+                                :class="['tc drawer-item mb-15', {active: definitionValue === item.value}]"
                                 @click="definitionFun(item.value)">
                                 {{item.name}}
                             </div>
-                            <div class="tc drawer-item" @click="resolutionRatio">
+                            <div class="tc drawer-item mb-15" @click="resolutionRatio">
                                 分辨率
                             </div>
+                            <div class="tc drawer-item mb-15" @click="engine.ExexuteKeyBoard(24)">
+                                音量 +
+                            </div>
+                            <div class="tc drawer-item" @click="engine.ExexuteKeyBoard(25)">
+                                音量 -
+                            </div>
                         </div>
                     </div>
                     <div class="exit">
                         <template v-for="(item, index) in exitList">
-                            <div :key="item.key" :class="['tc', {'mb-20': index !== exitList.length - 1}, item.key]"
+                            <div :key="item.key" :class="['tc', {'mb-15': index !== exitList.length - 1}, item.key]"
                                 @click="exitFun(item.key)">
                                 <img :src="item.img" alt="">
                                 <div class="drawer-item">

static/rtcEngine/css/WXtrialInterface.css

@@ -67,6 +67,10 @@ html {
   margin-bottom: 0.2rem;
 }
 
+.mb-15 {
+  margin-bottom: 0.15rem;
+}
+
 [v-cloak] {
   display: none;
 }
@@ -134,21 +138,21 @@ html {
   height: 0.3rem;
 }
 .layout .levitated-sphere-overlay {
-  height: calc(100% - 0.5rem);
+  height: calc(100% - 0.6rem);
   background-color: transparent;
 }
 .layout .levitated-sphere-drawer {
-  top: 46%;
-  height: calc(100% - 0.5rem);
-  min-width: 0.8rem;
+  top: 45.5%;
+  height: calc(100% - 0.6rem);
   max-height: none !important;
+  min-width: 0.7rem;
   color: #fff;
   background-color: rgba(2, 2, 6, 0.5);
-  padding: 0.8rem 0.1rem 0;
+  padding: 0.3rem 0.1rem 0;
   box-sizing: border-box;
 }
 .layout .levitated-sphere-drawer .drawer-item {
-  line-height: 0.36rem;
+  line-height: 0.3rem;
   border-radius: 0.03rem;
 }
 .layout .levitated-sphere-drawer .drawer-item.active {

static/rtcEngine/scss/WXtrialInterface.scss

@@ -71,6 +71,10 @@ html {
     margin-bottom: toREM(20);
 }
 
+.mb-15 {
+    margin-bottom: toREM(15);
+}
+
 [v-cloak] {
     display: none;
 }
@@ -142,23 +146,23 @@ html {
 
     // 右侧抽屉框
     .levitated-sphere-overlay {
-        height: calc(100% - toREM(50));
+        height: calc(100% - toREM(60));
         background-color: transparent;
     }
 
     .levitated-sphere-drawer {
-        top: 46%;
-        height: calc(100% - toREM(50));
+        top: 45.5%;
+        height: calc(100% - toREM(60));
         max-height: none !important;
+        min-width: toREM(70);
         color: #fff;
         background-color: rgba(2, 2, 6, .5);
-        padding: toREM(80) toREM(10) 0;
+        padding: toREM(30) toREM(10) 0;
         box-sizing: border-box;
 
         .drawer-item {
-            line-height: toREM(36);
+            line-height: toREM(30);
             border-radius: toREM(3);
-
             &.active {
                 background: rgba(255, 255, 255, 1);
                 color: #000;