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
Forum Updated to NodeBB v4.3 + New Features

Put button and icon inside QLineEdit

Scheduled Pinned Locked Moved Unsolved Language Bindings
python
3 Posts 3 Posters 5.5k 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