Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. Language Bindings
  4. Put button and icon inside QLineEdit
Qt 6.11 is out! See what's new in the release blog

Put button and icon inside QLineEdit

Scheduled Pinned Locked Moved Unsolved Language Bindings
python
3 Posts 3 Posters 6.2k Views 1 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • V Offline
    V Offline
    voltron
    wrote on last edited by A Former User
    #1

    I need to put an SVG icon on the left and button on the right inside QLineEdit to get something like this

    custom line edit

    I sucessfully managed to add QToolButton on the right with following code

    class MyLineEdit(QLineEdit):
        def __init__(self, parent=None):
            QLineEdit.__init__(self, parent)
    
            self.setPlaceholderText(self.tr('Password'))
            self.setEchoMode(QLineEdit.Password)
    
            self.btnToggle = QToolButton(self)
            self.btnToggle.setIcon(QIcon('toggle.svg'))
            self.btnToggle.setCursor(Qt.ArrowCursor)
            self.btnToggle.setStyleSheet('QToolButton { border: none; padding: 0px; }')
    
            frameWidth = self.style().pixelMetric(QStyle.PM_DefaultFrameWidth)
            self.setStyleSheet('QLineEdit {{ padding-right: {}px; }} '.format(self.btnToggle.sizeHint().width() + frameWidth + 1))
            msz = self.minimumSizeHint()
            self.setMinimumSize(max(msz.width(), self.btnToggle.sizeHint().height() + frameWidth * 2 + 2),
                                max(msz.height(), self.btnToggle.sizeHint().height() + frameWidth * 2 + 2))
    
        def resizeEvent(self, event):
            sz = self.btnToggle.sizeHint()
            frameWidth = self.style().pixelMetric(QStyle.PM_DefaultFrameWidth)
            self.btnToggle.move(self.rect().right() - frameWidth - sz.width(),
                               (self.rect().bottom() + 1 - sz.height())/2)
    

    But can't figure out how to add svg image (using QSvgWidget as display) in the right. Any ideas how to do this?

    raven-worxR 1 Reply Last reply
    0
    • R Offline
      R Offline
      redstoneleo
      wrote on last edited by
      #2

      see if this can helps you
      http://blog.csdn.net/liang19890820/article/details/50357523

      1 Reply Last reply
      0
      • V voltron

        I need to put an SVG icon on the left and button on the right inside QLineEdit to get something like this

        custom line edit

        I sucessfully managed to add QToolButton on the right with following code

        class MyLineEdit(QLineEdit):
            def __init__(self, parent=None):
                QLineEdit.__init__(self, parent)
        
                self.setPlaceholderText(self.tr('Password'))
                self.setEchoMode(QLineEdit.Password)
        
                self.btnToggle = QToolButton(self)
                self.btnToggle.setIcon(QIcon('toggle.svg'))
                self.btnToggle.setCursor(Qt.ArrowCursor)
                self.btnToggle.setStyleSheet('QToolButton { border: none; padding: 0px; }')
        
                frameWidth = self.style().pixelMetric(QStyle.PM_DefaultFrameWidth)
                self.setStyleSheet('QLineEdit {{ padding-right: {}px; }} '.format(self.btnToggle.sizeHint().width() + frameWidth + 1))
                msz = self.minimumSizeHint()
                self.setMinimumSize(max(msz.width(), self.btnToggle.sizeHint().height() + frameWidth * 2 + 2),
                                    max(msz.height(), self.btnToggle.sizeHint().height() + frameWidth * 2 + 2))
        
            def resizeEvent(self, event):
                sz = self.btnToggle.sizeHint()
                frameWidth = self.style().pixelMetric(QStyle.PM_DefaultFrameWidth)
                self.btnToggle.move(self.rect().right() - frameWidth - sz.width(),
                                   (self.rect().bottom() + 1 - sz.height())/2)
        

        But can't figure out how to add svg image (using QSvgWidget as display) in the right. Any ideas how to do this?

        raven-worxR Offline
        raven-worxR Offline
        raven-worx
        Moderators
        wrote on last edited by
        #3

        @voltron
        simply put the QSvgWidget and the line edit widget into a QHBoxLayout and set the content-margins and spacing to 0.
        Then put this layout into a plain container widget.

        --- SUPPORT REQUESTS VIA CHAT WILL BE IGNORED ---
        If you have a question please use the forum so others can benefit from the solution in the future

        1 Reply Last reply
        0

        • Login

        • Login or register to search.
        • First post
          Last post
        0
        • Categories
        • Recent
        • Tags
        • Popular
        • Users
        • Groups
        • Search
        • Get Qt Extensions
        • Unsolved