第一句子网 > 基于QT的网络音乐播放器（二）

基于QT的网络音乐播放器（二）

时间：2019-08-31 03:45:18

相关推荐

基于QT的网络音乐播放器（二）

前面我对这个音乐播放器已经做了个简单的介绍了（其实就是瞎扯了一波），接下来就是实在货了，这篇我将给大家介绍一下界面的总体布局和QSS的代码。

ui界面：

QSS代码：

/*播放按钮*/QPushButton#play_Btn:!hover{border-image: url(:/images/play4.png);}QPushButton#play_Btn:hover{border-image: url(:/images/play5.png);}/*上一曲按钮*/QPushButton#last_Btn:!hover{border-image: url(:/images/last.png);}QPushButton#last_Btn:hover{border-image: url(:/images/last1.png);}/*下一曲按钮*/QPushButton#next_Btn:hover{border-image: url(:/images/next1.png);}QPushButton#next_Btn:!hover{border-image: url(:/images/next.png);}/*静音按钮*/QPushButton#muteButton:!hover{border-image: url(:/images/sound.png);}QPushButton#muteButton:hover{border-image: url(:/images/sound.png);}QPushButton#muteButton:pressed{border-image: url(:/images/nosound_light.png);}/*播放顺序*/QPushButton#playPattern_Btn{border-image: url(:/images/shunxu.png);}/*添加*/QPushButton#add_Btn:!hover{border-image: url(:/images/addmusic.png);}QPushButton#add_Btn:hover{border-image: url(:/images/add.png);}/**/QPushButton#Collection_Btn:!hover{border-image: url(:/images/heart01.png);}QPushButton#Collection_Btn:hover{border-image: url(:/images/heart01.png);}/*搜索*/QPushButton#search_Btn:!hover{border-color:rgba(0, 0, 0, 50);border-width: 1px;border-style: solid;border-radius: 5px;font-size:12px;}QPushButton#search_Btn:hover{border-color:rgba(0, 0, 0, 50);border-width: 2px;border-style: solid;border-radius: 5px;font-size:12px;}QPushButton#search_Btn:pressed{border-color:rgba(0, 255, 0, 100);border-width: 1px;border-style: solid;border-radius: 5px;font-size:12px;}/*关闭*/QPushButton#close_Btn:!hover{border-image: url(:/images/close.png);}QPushButton#close_Btn:hover{border-image: url(:/images/closew.png);}/*最小化*/QPushButton#min_Btn:!hover{border-image: url(:/images/min.png);}QPushButton#min_Btn:hover{border-image: url(:/images/minw.png);}/*播放进度条*/QSlider::groove:horizontal {border: 1px solid #4A708B;background: #C0C0C0;height: 5px;border-radius: 1px;padding-left:-1px;padding-right:-1px;}QSlider::sub-page:horizontal {background: qlineargradient(x1:0, y1:0, x2:0, y2:1,stop:0 #B1B1B1, stop:1 #c4c4c4);background: qlineargradient(x1: 0, y1: 0.2, x2: 1, y2: 1,stop: 0 #5DCCFF, stop: 1 #1874CD);border: 1px solid #4A708B;height: 10px;border-radius: 2px;}QSlider::add-page:horizontal {background: #575757;border: 0px solid #777;height: 10px;border-radius: 2px;}QSlider::handle:horizontal{background: qradialgradient(spread:pad, cx:0.5, cy:0.5, radius:0.5, fx:0.5, fy:0.5,stop:0.6 #45ADED, stop:0.778409 rgba(255, 255, 255, 255));width: 11px;margin-top: -3px;margin-bottom: -3px;border-radius: 5px;}QSlider::handle:horizontal:hover {background: qradialgradient(spread:pad, cx:0.5, cy:0.5, radius:0.5, fx:0.5, fy:0.5, stop:0.6 #2A8BDA,stop:0.778409 rgba(255, 255, 255, 255));width: 11px;margin-top: -3px;margin-bottom: -3px;border-radius: 5px;}QSlider::sub-page:horizontal:disabled {background: #00009C;border-color: #999;}QSlider::add-page:horizontal:disabled {background: #eee;border-color: #999;}QSlider::handle:horizontal:disabled {background: #eee;border: 1px solid #aaa;border-radius: 4px;}/*音量进度条*/QSlider::groove:vertical {border: 1px solid #4A708B;background: #C0C0C0;width: 5px;border-radius: 1px;padding-left:-1px;padding-right:-1px;padding-top:-1px;padding-bottom:-1px;}QSlider::sub-page:vertical {background: #575757;border: 1px solid #4A708B;border-radius: 2px;}QSlider::add-page:vertical {background: qlineargradient(x1:0, y1:0, x2:0, y2:1,stop:0 #c4c4c4, stop:1 #B1B1B1);background: qlineargradient(x1: 0, y1: 0.2, x2: 1, y2: 1,stop: 0 #5DCCFF, stop: 1 #1874CD);border: 0px solid #777;width: 10px;border-radius: 2px;}QSlider::handle:vertical{background: qradialgradient(spread:pad, cx:0.5, cy:0.5, radius:0.5, fx:0.5, fy:0.5, stop:0.6 #45ADED,stop:0.778409 rgba(255, 255, 255, 255));height: 11px;margin-left: -3px;margin-right: -3px;border-radius: 5px;}QSlider::sub-page:vertical:disabled {background: #00009C;border-color: #999;}QSlider::add-page:vertical:disabled {background: #eee;border-color: #999;}QSlider::handle:vertical:disabled {background: #eee;border: 1px solid #aaa;border-radius: 4px;}/*搜索框*/QLineEdit#search_LineEdit:hover{background-color: rgba(0, 0, 0, 0);border-color:rgb(84, 255, 159);border-right-color:rgb(84, 255, 159);border-left-color:rgb(84, 255, 159);border-width: 2px;border-style: solid;border-radius: 4px;}QLineEdit#search_LineEdit:!hover{background-color: rgba(0, 0, 0, 0);border-color:rgba(0, 0, 0, 50);border-width: 1px;border-style: solid;border-radius: 4px;}

如果需要图片资源的可以找我要，因为我对QSS也不是很熟悉，所以好多样式借鉴了其他大佬的。如果有更好看的样式推荐的话，大家也可以分享出来，互相学习嘛。