Development/Tutorials/Graphics/HiDPI: Difference between revisions

    From KDE TechBase
    Line 52: Line 52:


    == QPainter ==
    == QPainter ==
    <code>QRect</code> and <code>QPoint</code> process all dimensions as integers. You need to change all of them to <code>QRectF</code> and <code>QPointF</code>.
    All width and height variables have to be <code>qreal</code> type instead of <code>int</code>.
    After all these changes, your <code>QPainter</code> object should be able to render HiDPI graphics.

    Revision as of 17:32, 20 July 2019

    Introduction

    HiDPI devices are very common today. Users need to scale up UI to make them looks like normal size. Common scale factors are: 1.25, 1.5, 1.75, 2, 3. This means UI dimensions are not integers anymore. Qt provides classes and functions that accept and return qreal instead of int. They usually end with F.

    • QRect --> QRectF
    • QPoint --> QPointF
    • QWidget::devicePixelRatio() --> QWidget::devicePixelRatioF()

    KDE and Qt applications may render blur icons and graphics. This guide shows how to make everything sharp and clear in HiDPI devices. Both Qt 5 Widgets and Qt 5 Quick applications are supported.

    Migrate to Qt 5 and KF5

    Qt 4 doesn't support HiDPI rendering. Please migrate your application to Qt 5 and KF5.

    Texts

    You don't need to do anything special. Text rendering should support HiDPI out of box.

    Icons

    In your application's main function, add the following lines at the very beginning:

    int main(int argc, char *argv[])
    {
        QApplication app(argc, argv);
        app.setAttribute(Qt::AA_UseHighDpiPixmaps, true);
        ...
    }
    

    Then all icons in your application should look sharp.

    QPixmap

    Change all QPixmap from

    pixmap = QPixmap( width, height );
    

    to

    pixmap = QPixmap( width * dpr, height * dpr );
    pixmap.setDevicePixelRatio(dpr);
    

    So where is the dpr variable from? You can get it from any QWidget objects with function devicePixelRatioF(). F means the function return a float number (qreal).

    And don't forget to change width and height from int to qreal.

    QPainter

    QRect and QPoint process all dimensions as integers. You need to change all of them to QRectF and QPointF.

    All width and height variables have to be qreal type instead of int.

    After all these changes, your QPainter object should be able to render HiDPI graphics.