Led Like buttons/Widgets

mrjj

Hi
This is how you make your own
http://www.ics.com/blog/integrating-custom-widget-qt-designer

However If you do not need to have it visual seen in design mode, you can skip ALL the parts
with making it a plugin. and simply use the promote feature
http://doc.qt.io/qt-4.8/designer-using-custom-widgets.html

That makes it far easier and you can have a simple LED pretty fast.

VRonin

class Led : public QLabel {
  Q_OBJECT
  Led(const Led&) = delete;
  Led& operator=(const Led&) = delete;
 public slots:
  void setOn() {
    onPix.fill(Qt::red);
    setPixmap(onPix);
  }
  void setOff() {
    onPix.fill(Qt::black);
    setPixmap(onPix);
  }
  void setPower(bool val) {
    if(val) setOn();
    else setOff();
  }
 public:
  virtual ~Led() = default;
  explicit Led(QWidget* parent = nullptr)
    : QLabel(parent)
    , onPix(48, 48) {
    onPix.fill(Qt::black);
    setPixmap(onPix);
    setScaledContents(true);
  }
 private:
  QPixmap onPix;
};

? Offline

Hi! You could also use a QPushButton with a LED-like icon on it.

VRonin

My first implementation was quite embarrassing, this is a bit better:

class Led : public QWidget{
    Q_OBJECT
    Q_PROPERTY(bool power READ power WRITE setPower NOTIFY powerChanged)
    Led(const Led&)=delete;
    Led& operator=(const Led&)=delete;
public:
    explicit Led(QWidget* parent=nullptr)
        :QWidget(parent)
        , m_power(false)
    {}
    bool power() const
    {
        return m_power;
    }
public slots:
    void setPower(bool power)
    {
        if(power!=m_power){
            m_power = power;
            emit powerChanged();
            update();
        }
    }
signals:
    void powerChanged();
protected:
    virtual void paintEvent(QPaintEvent *event) override{
        Q_UNUSED(event)
        QPainter ledPainter(this);
        ledPainter.setPen(Qt::black);
        if(m_power)
            ledPainter.setBrush(Qt::red);
        else
            ledPainter.setBrush(Qt::NoBrush);
        ledPainter.drawEllipse(rect());
    }
private:
    bool m_power;
};

You can change paintEvent to make it look prettier

Edit:

Thanks @mrjj for the suggestion about better handling of the update/repaint

mrjj

@VRonin
Np, only discovered it as i made a test project :)
https://www.dropbox.com/s/you53vbvl5z73ql/myleds.zip?dl=0

alt text

To show off the promote thing and the Led.

SGaist

Hi,

Just in case, there's QLed that might also be of interest.

mrjj

@SGaist
Funny enough I also found that ;)
Its Qt4-ish and needed to be updated to new plugin export macros and includes for designer
interface. the pro file also had old keywords and some more stuff needed.

Here is version that can compile on Windows Qt5.7.
https://www.dropbox.com/s/38endyfoexb28nd/QLeds57.zip?dl=0

? Offline

There's also a LED widget in KDE4, KLed Class Reference.

Bruschetta

Guys thank a lot for all your hints. I will find a solution that better fits in my project for sure. Thumbs up for all your answers!

Bruschetta

@mrjj
This is a very interesting plugin , i would like to use it.
I can build the project i downloaded from your dropbox but i still do not find the plugin into my designer.

I'm under windows , are there any particular passages i have to do to make it work?
Thank a lot for your time.

My QT version is 5.7

mrjj

@Bruschetta
Hi.
Plugins are Dlls. Creator are compiled with Visual Studio. (2013)
So to load custom plugin, it must be compiled with visual studio and not mingw.
Then the dll should be copied to "\bin\plugins\designer"

Alternative you can use the Qleds by Promotion
http://doc.qt.io/qt-5/designer-using-custom-widgets.html

Alternative, you can have my VS DLL
https://www.dropbox.com/s/1f65fzcew6pjm2z/VSqledplugin.zip?dl=0
Copy to C:\Qt\Tools\QtCreator\bin\plugins\designer
Disclaimer: Normally I do not recommend downloading DLLS from forums.

Bruschetta

@mrjj
Your answer is very exaustive, thanks for the heads up!

mrjj

@Bruschetta
Np.
I think its needs a .pri file to be complete
http://doc.qt.io/qt-5/designer-creating-custom-widgets.html
section "Splitting up the Plugin"
To make it easy to use in a clean project.
Then all you need to do is
include(QLeds.pri)
to use in a project. Didn't try that yet.

Bruschetta

@mrjj
with the dll now i see the widget in the Designer.
Anyway if i use it in i have serveral errors.

In particular i tried to create the PRI file containing:

INCLUDEPATH += $$PWD
HEADERS += $$PWD/qled.h
SOURCES += $$PWD/qled.cpp

That i added to the plugin and the project file

Whan i try to compile now i get this error

mingw32-make[1]: *** No rule to make target '../../QTProjects-New/Alpha2/qled.cpp', needed by 'debug/qled.o'. Stop.:

What i'm doing wrong with this pri files?
Is again mingw fault?

mrjj

@Bruschetta
Hi.
seems fine.
I have not tried this yet.
No, should not be mingw fault. :)

maybe we be need
QT += QLed

Sounds like its not linking the plugin but I not sure if that will do it.

I also really want to know how to do this the right way. as I think its very little needed to fully work but
not sure what it is.

Bruschetta

@mrjj
Unfortunately for me .pri files are not working, neither copying the qled.h and qled.cpp into the project.

I got those warnings during compile time

warning: 'virtual const QMetaObject* QLed::metaObject() const' redeclared without dllimport attribute: previous dllimport ignored
 warning: 'void QLed::setOffColor(QLed::ledColor)' redeclared without dllimport attribute: previous dllimport ignored
.
.

and errors

QTProjects\build-Alpha2-Desktop_Qt_5_7_0_MinGW_32bit-Debug/debug/moc_qled.cpp:151: undefined reference to `_imp___ZN4QLed10setOnColorENS_8ledColorE
QTProjects\build-Alpha2-Desktop_Qt_5_7_0_MinGW_32bit-Debug/debug/moc_qled.cpp:153: undefined reference to `_imp___ZN4QLed8setShapeENS_8ledShapeE
.
.

tried to add qledplugin.dll as lib in the .pro file too without success.

Have you any suggestion ? :)
Thanks again for the attention and time

mrjj

Yes. If you remove the QDESIGNER_WIDGET_EXPORT
from the qled.h it will link and run
as in

class /*QDESIGNER_WIDGET_EXPORT*/ QLed : public QWidget {

You also need the qres in PRI file
qled.pri

QT += svg
INCLUDEPATH += $$PWD
HEADERS += $$PWD/qled.h
SOURCES += $$PWD/qled.cpp

RESOURCES += $$PWD/qled.qrc

Note that this is slightly hack-ish as you need QDESIGNER_WIDGET_EXPORT when compiling as plugin.
But not when using it via .PRI file.

Bruschetta

@mrjj
you have been fast as lightning! And it's working! Thahks a lot!

mrjj

@Bruschetta
Super :)

BlackDogWhite

@mrjj You have been very helpful to @Bruschetta and I'm wondering if you will go a little further.

The Qleds57.zip file is no longer in your drop box. Would you mind terribly putting up a copy again? Or a 5.10 version?

I'm trying to walk through this as a beginner and keep running into roadblocks.