ROS Resources: Documentation | Support | Discussion Forum | Index | Service Status | ros @ Robotics Stack Exchange
Ask Your Question

Revision history [back]

click to hide/show revision 1
initial version

Created a UI file using QT Designer and added a button. The button uses a stylesheet where the background of the button is set to an image. The image for this button changes on Mouse click.

This works fine in the QT designer previewer, but not when i load it in to rqt.

user@ubuntu:~/catkin_ws/src/rqt_mypkg/resource$ cat MyPlugin2.ui 
    <?xml version="1.0" encoding="UTF-8"?>
    <ui version="4.0">
     <class>Form</class>
     <widget class="QWidget" name="Form">
      <property name="geometry">
       <rect>
        <x>0</x>
        <y>0</y>
        <width>159</width>
        <height>107</height>
       </rect>
      </property>
      <property name="windowTitle">
       <string>Directional Controls</string>
      </property>
      <property name="autoFillBackground">
       <bool>false</bool>
      </property>
      <property name="styleSheet">
       <string notr="true">
    QWidget
    {
        color: #b1b1b1;
        background-color: #535353;
    }
    </string>
      </property>
      <widget class="QPushButton" name="pushButtonForward">
       <property name="geometry">
        <rect>
         <x>20</x>
         <y>20</y>
         <width>125</width>
         <height>70</height>
        </rect>
       </property>
       <property name="minimumSize">
        <size>
         <width>125</width>
         <height>70</height>
        </size>
       </property>
       <property name="styleSheet">
        <string notr="true">QPushButton
    {
        background-image: url(:/ButtonUpMouseOff.png) ;
        background-repeat: none;
        background-position: top center;
    }

    QPushButton:pressed
    {
        background-image: url(:/ButtonUpMouseDown.jpg) ;
        background-repeat: none;
        background-position: top center;
        border-style: 0px;
    }
    </string>
       </property>
       <property name="text">
        <string/>
       </property>
      </widget>
     </widget>
     <resources>
      <include location="ButtonImages.qrc"/>
     </resources>
     <connections/>
    </ui>

Note: I tried png and jpg files.

user@ubuntu:~/catkin_ws/src/rqt_mypkg/resource$ cat ButtonImages.qrc 
<RCC>
  <qresource>
    <file>ButtonUpMouseDown.jpg</file>
    <file>ButtonUpMouseOff.png</file>
     </qresource>
</RCC>

This is my python plugin file. Loads the .ui file from the resource folder fine (but not the images).

user@ubuntu:~/catkin_ws/src/rqt_mypkg/src/rqt_mypkg$ cat my_module.py
import os
import rospy

from qt_gui.plugin import Plugin
from python_qt_binding import loadUi
from python_qt_binding.QtGui import QWidget

class MyPlugin(Plugin):

    def __init__(self, context):
        super(MyPlugin, self).__init__(context)
        # Give QObjects reasonable names
        self.setObjectName('MyPlugin')

        # Process standalone plugin command-line arguments
        from argparse import ArgumentParser
        parser = ArgumentParser()
        # Add argument(s) to the parser.
        parser.add_argument("-q", "--quiet", action="store_true",
                      dest="quiet",
                      help="Put plugin in silent mode")
        args, unknowns = parser.parse_known_args(context.argv())
        if not args.quiet:
            print 'arguments: ', args
            print 'unknowns: ', unknowns

        # Create QWidget
        self._widget = QWidget()
        # Get path to UI file which is a sibling of this file
        # in this example the .ui and .py file are in the same folder
        ui_file = os.path.join(os.path.dirname(os.path.realpath(__file__)), '../../resource/MyPlugin2.ui')
        # Extend the widget with all attributes and children from UI file
        loadUi(ui_file, self._widget)
        # Give QObjects reasonable names
        self._widget.setObjectName('MyPluginUi')
        # Show _widget.windowTitle on left-top of each plugin (when 
        # it's set in _widget). This is useful when you open multiple 
        # plugins at once. Also if you open multiple instances of your 
        # plugin at once, these lines add number to make it easy to 
        # tell from pane to pane.
        if context.serial_number() > 1:
            self._widget.setWindowTitle(self._widget.windowTitle() + (' (%d)' % context.serial_number()))
        # Add widget to the user interface
        context.add_widget(self._widget)

    def shutdown_plugin(self):
        # TODO unregister all publishers here
        pass

    def save_settings(self, plugin_settings, instance_settings):
        # TODO save intrinsic configuration, usually using:
        # instance_settings.set_value(k, v)
        pass

    def restore_settings(self, plugin_settings, instance_settings):
        # TODO restore intrinsic configuration, usually using:
        # v = instance_settings.value(k)
        pass

    #def trigger_configuration(self):
        # Comment in to signal that the plugin has a way to configure
        # This will enable a setting button (gear icon) in each dock widget title bar
        # Usually used to open a modal configuration dialog