In this article we will see how we can set skin to the non-editable combo box when mouse hover over it. Skin is basically the background image but skin adjust its size according to the size of combo box.Non-editable combo box is in which user can’t insert data, setEditable
method is used to make combo box editable. Skin will only appear the combo box is non-editable and mouse hover over it.
In order to do this we have to change the style sheet code of the combo box, below is the style sheet code
QComboBox::!editable:hover { border-image : url(image.png); }
Below is the implementation
# importing libraries from PyQt5.QtWidgets import * from PyQt5 import QtCore, QtGui from PyQt5.QtGui import * from PyQt5.QtCore import * import sys class Window(QMainWindow): def __init__( self ): super ().__init__() # setting title self .setWindowTitle( "Python " ) # setting geometry self .setGeometry( 100 , 100 , 600 , 400 ) # calling method self .UiComponents() # showing all the widgets self .show() # method for widgets def UiComponents( self ): # creating a check-able combo box object self .combo_box = QComboBox( self ) # setting geometry of combo box self .combo_box.setGeometry( 200 , 150 , 200 , 80 ) # making combo box editable # self.combo_box.setEditable(True) # geek list geek_list = [ "Sayian" , "Super Sayian" , "Super Sayian 2" , "Super Sayian B" ] # adding list of items to combo box self .combo_box.addItems(geek_list) # setting style sheet of combo box # adding skin to the combo box when it is non-editable # and when mouse hover over it self .combo_box.setStyleSheet( "QComboBox::! editable:hover" "{" "border-image : url(image.png);" "border : 1px solid black;" "}" ) # create pyqt5 app App = QApplication(sys.argv) # create the instance of our Window window = Window() window.show() # start the app sys.exit(App. exec ()) |
Output :