diff --git a/publish/changeLog.md b/publish/changeLog.md
index 2e921f9b..60d51a2e 100644
--- a/publish/changeLog.md
+++ b/publish/changeLog.md
@@ -1,6 +1,7 @@
### 新增
- 新增**MAC**及**Linux**版本(需要的可自行下载)
+- 新增音量调整
- 新增任务栏播放进度条控制选项(现在可在设置界面关闭在任务栏显示的播放进度)
- 新增更新出错时的弹窗提示
- 从该版本起,非安装版也会有更新弹窗提醒了,但仍然需要手动下载新版本更新,版本信息可到设置页面查看
diff --git a/src/renderer/components/core/Icons.vue b/src/renderer/components/core/Icons.vue
index 740f9d37..5fb446e9 100644
--- a/src/renderer/components/core/Icons.vue
+++ b/src/renderer/components/core/Icons.vue
@@ -50,9 +50,9 @@ svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/19
//- path(fill='currentColor' d='M174.522,0h-26.848c-9.885,0-17.897,8.013-17.897,17.899v62.533L37.513,2.522c-3.483-2.406-7.807-2.005-11.072-2.005c-13.061,0-13.004,11.7-13.004,14.666v175.983c0,2.507-0.057,14.666,13.004,14.666c3.265,0,7.589,0.401,11.072-2.005l92.265-77.91v62.016c0,9.885,8.012,17.898,17.897,17.898h26.848c9.885,0,17.898-8.013,17.898-17.898V17.899C192.421,8.013,184.408,0,174.522,0z')
g#icon-sound
// 0 0 291.063 291.064
- path(d='M26.512,204.255h18.292l106.48,67.761c12.354,7.855,22.369,2.361,22.369-12.282v-69.397c16.933-8.854,28.501-26.559,28.501-46.983c0-20.425-11.568-38.129-28.501-46.986V31.645c0-14.639-10.18-20.401-22.731-12.873L44.804,82.443H26.512C11.866,82.443,0,94.311,0,108.955v68.789C0,192.387,11.866,204.255,26.512,204.255z')
- path(d='M219.791,152.899c-0.818,11.185-4.039,21.758-9.569,31.426c-3.635,6.354-1.43,14.452,4.919,18.087c2.082,1.187,4.34,1.751,6.576,1.751c4.599,0,9.062-2.393,11.517-6.675c7.508-13.138,11.889-27.491,12.986-42.663c1.714-23.397-4.836-46.781-18.455-65.845c-4.256-5.96-12.536-7.332-18.491-3.081c-5.959,4.259-7.337,12.531-3.08,18.491C216.218,118.425,221.055,135.653,219.791,152.899z')
- path(d='M290.7,158c3.34-45.736-16.508-89.592-53.097-117.318c-5.841-4.433-14.146-3.27-18.568,2.556c-4.428,5.838-3.283,14.151,2.558,18.568c29.401,22.281,45.355,57.521,42.668,94.252c-2.02,27.636-14.375,53.159-34.787,71.867c-5.396,4.95-5.758,13.339-0.808,18.729c2.609,2.854,6.188,4.298,9.771,4.298c3.194,0,6.41-1.154,8.953-3.484C272.805,224.175,288.184,192.408,290.7,158z')
+ path(fill='currentColor' d='M26.512,204.255h18.292l106.48,67.761c12.354,7.855,22.369,2.361,22.369-12.282v-69.397c16.933-8.854,28.501-26.559,28.501-46.983c0-20.425-11.568-38.129-28.501-46.986V31.645c0-14.639-10.18-20.401-22.731-12.873L44.804,82.443H26.512C11.866,82.443,0,94.311,0,108.955v68.789C0,192.387,11.866,204.255,26.512,204.255z')
+ path(fill='currentColor' d='M219.791,152.899c-0.818,11.185-4.039,21.758-9.569,31.426c-3.635,6.354-1.43,14.452,4.919,18.087c2.082,1.187,4.34,1.751,6.576,1.751c4.599,0,9.062-2.393,11.517-6.675c7.508-13.138,11.889-27.491,12.986-42.663c1.714-23.397-4.836-46.781-18.455-65.845c-4.256-5.96-12.536-7.332-18.491-3.081c-5.959,4.259-7.337,12.531-3.08,18.491C216.218,118.425,221.055,135.653,219.791,152.899z')
+ path(fill='currentColor' d='M290.7,158c3.34-45.736-16.508-89.592-53.097-117.318c-5.841-4.433-14.146-3.27-18.568,2.556c-4.428,5.838-3.283,14.151,2.558,18.568c29.401,22.281,45.355,57.521,42.668,94.252c-2.02,27.636-14.375,53.159-34.787,71.867c-5.396,4.95-5.758,13.339-0.808,18.729c2.609,2.854,6.188,4.298,9.771,4.298c3.194,0,6.41-1.154,8.953-3.484C272.805,224.175,288.184,192.408,290.7,158z')
diff --git a/src/renderer/components/core/Player.vue b/src/renderer/components/core/Player.vue
index afe86d6a..40e46492 100644
--- a/src/renderer/components/core/Player.vue
+++ b/src/renderer/components/core/Player.vue
@@ -8,6 +8,13 @@ div(:class="$style.player")
div(:class="$style.column1")
div(:class="$style.container")
div(:class="$style.title") {{title}}
+ div(:class="$style.volumeContent")
+ div(:class="$style.volume" @click.stop='handleChangeVolume' :title="`当前音量:${volumeStr}%`")
+ div(:class="$style.volumeBar" :style="{ width: volumeStr + '%' }")
+
+ //- div(:class="$style.playBtn" @click='handleNext' title="音量")
+ svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' viewBox='0 0 291.063 291.064' space='preserve')
+ use(xlink:href='#icon-sound')
div(:class="$style.playBtn" @click='handleNext' title="下一首")
svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' viewBox='0 0 220.847 220.847' space='preserve')
use(xlink:href='#icon-nextMusic')
@@ -50,6 +57,7 @@ export default {
return {
show: true,
audio: null,
+ volume: 0,
nowPlayTime: 0,
maxPlayTime: 0,
isPlay: false,
@@ -98,6 +106,9 @@ export default {
isAPITemp() {
return this.setting.apiSource == 'temp'
},
+ volumeStr() {
+ return parseInt(this.volume * 100)
+ },
},
mounted() {
this.setProgessWidth()
@@ -139,6 +150,9 @@ export default {
if (n.toFixed(2) === o.toFixed(2)) return
this.sendProgressEvent(n, 'normal')
},
+ volume(n) {
+ this.handleSaveVolume(n)
+ },
},
methods: {
...mapActions('player', ['getUrl', 'getPic', 'getLrc']),
@@ -147,9 +161,11 @@ export default {
'fixPlayIndex',
'resetChangePlay',
]),
+ ...mapMutations(['setVolume']),
...mapMutations('list', ['updateMusicInfo']),
init() {
- this.audio = document.createElement('audio')
+ window.a = this.audio = document.createElement('audio')
+ this.volume = this.audio.volume = this.setting.player.volume
this.audio.controls = false
this.audio.autoplay = true
this.audio.loop = this.setting.player.togglePlayMethod === 'singleLoop'
@@ -438,6 +454,17 @@ export default {
clearAppTitle() {
setTitle()
},
+ handleChangeVolume(e) {
+ let val = e.offsetX / 70
+ if (val < 0) val = 0
+ if (val > 1) val = 1
+ if (val > 0.97) val = 1
+ this.volume = val
+ if (this.audio) this.audio.volume = this.volume
+ },
+ handleSaveVolume(volume) {
+ this.setVolume(volume)
+ },
},
}
@@ -509,6 +536,39 @@ export default {
.mixin-ellipsis-1;
}
+.volume-content {
+ width: 100px;
+ display: flex;
+ align-items: center;
+ padding: 0 15px;
+}
+
+.volume {
+ cursor: pointer;
+ width: 100%;
+ height: 0.25em;
+ border-radius: 10px;
+ // overflow: hidden;
+ transition: @transition-theme;
+ transition-property: background-color;
+ background-color: @color-player-progress;
+ // background-color: #f5f5f5;
+ position: relative;
+ border-radius: @radius-progress-border;
+}
+
+.volume-bar {
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 0;
+ height: 100%;
+ border-radius: @radius-progress-border;
+ transition-duration: 0.2s;
+ background-color: @color-player-progress-bar2;
+ box-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
+}
+
.play-btn {
+ .play-btn {
margin-left: 10px;
diff --git a/src/renderer/components/material/InputRange.vue b/src/renderer/components/material/InputRange.vue
new file mode 100644
index 00000000..d63577a7
--- /dev/null
+++ b/src/renderer/components/material/InputRange.vue
@@ -0,0 +1,80 @@
+
+ input(type="range" :class="[$style.range, min ? $style.min : '']" :disabled="disabled" v-model="val" input="handleInput" @change="handleChange")
+
+
+
+
+
+
diff --git a/src/renderer/store/mutations.js b/src/renderer/store/mutations.js
index 0d0adb9f..89fdcebc 100644
--- a/src/renderer/store/mutations.js
+++ b/src/renderer/store/mutations.js
@@ -23,4 +23,7 @@ export default {
if (isShow !== undefined) state.version.showModal = isShow
if (isError !== undefined) state.version.isError = isError
},
+ setVolume(state, val) {
+ state.setting.player.volume = val
+ },
}
diff --git a/src/renderer/utils/index.js b/src/renderer/utils/index.js
index 71c27340..633a4d95 100644
--- a/src/renderer/utils/index.js
+++ b/src/renderer/utils/index.js
@@ -168,6 +168,7 @@ export const updateSetting = setting => {
togglePlayMethod: 'listLoop',
highQuality: false,
isShowTaskProgess: true,
+ volume: 1,
},
list: {
isShowAlbumName: true,