Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt
  • Unsolved
Collapse
qtws26_logo

The Qt Event of the Year: Qt World Summit 2026

Save Your Spot >
Brand Logo
  1. Home
  2. Qt Development
  3. General and Desktop
  4. How to achieve Fuzzy masking effect!
Qt 6.12 LTS is out! See what's new in the release blog

How to achieve Fuzzy masking effect!

Scheduled Pinned Locked Moved General and Desktop
14 Posts 3 Posters 7.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.
  • ? Offline
    ? Offline
    A Former User
    wrote on last edited by
    #1

    I want to setting the background-image
    for example this photo:
    !http://www.qtcn.org/bbs/attachment/Mon_1308/26_124672_e84c65b26f1dd44.jpg(QQ self define skin)!
    this is qq self define skin!
    when you press the self define button !you can watch it!
    Forgive me for my poor English level!thank you everyone!

    1 Reply Last reply
    0
    • ? Offline
      ? Offline
      A Former User
      wrote on last edited by
      #2

      Background image of a widget, qml or graphics scene??
      for a widget you can do something like this:
      myWidget->setStyleSheet("background-image: url(./image.png)")

      1 Reply Last reply
      0
      • ? Offline
        ? Offline
        A Former User
        wrote on last edited by
        #3

        my view is how to make the photo by code !
        thank you!
        [quote author="pkj__" date="1376988327"]Background image of a widget, qml or graphics scene??
        for a widget you can do something like this:
        myWidget->setStyleSheet("background-image: url(./image.png)")
        [/quote]

        1 Reply Last reply
        0
        • JKSHJ Offline
          JKSHJ Offline
          JKSH
          Moderators
          wrote on last edited by
          #4

          The fuzzy effect is called "bokeh".

          Normally, people don't use code. People use cameras or Photoshop: http://www.youtube.com/watch?v=bvCZy3zRHAU

          Qt Doc Search for browsers: forum.qt.io/topic/35616/web-browser-extension-for-improved-doc-searches

          1 Reply Last reply
          0
          • ? Offline
            ? Offline
            A Former User
            wrote on last edited by
            #5

            thank you very much ,how to achieve by code!
            [quote author="JKSH" date="1377005079"]The fuzzy effect is called "bokeh".

            Normally, people don't use code. People use cameras or Photoshop: http://www.youtube.com/watch?v=bvCZy3zRHAU[/quote]

            1 Reply Last reply
            0
            • JKSHJ Offline
              JKSHJ Offline
              JKSH
              Moderators
              wrote on last edited by
              #6

              Oh, do you mean: "How to blur the photo edges?"

              You can use QML code: http://qt-project.org/doc/qt-5.1/qtgraphicaleffects/qml-qtgraphicaleffects1-maskedblur.html

              It is hard to use C++ code.

              Qt Doc Search for browsers: forum.qt.io/topic/35616/web-browser-extension-for-improved-doc-searches

              1 Reply Last reply
              0
              • ? Offline
                ? Offline
                A Former User
                wrote on last edited by
                #7

                thank you,but my program is gui !
                [quote author="JKSH" date="1377048353"]Oh, do you mean: "How to blur the photo edges?"

                You can use QML code: http://qt-project.org/doc/qt-5.1/qtgraphicaleffects/qml-qtgraphicaleffects1-maskedblur.html

                It is hard to use C++ code.

                [/quote]

                1 Reply Last reply
                0
                • JKSHJ Offline
                  JKSHJ Offline
                  JKSH
                  Moderators
                  wrote on last edited by
                  #8

                  [quote author="hk520590" date="1377049309"]thank you,but my program is gui ![/quote]It is hard to achieve the effect with C++ code.

                  It is better if you use an image editing program to make it blur. Then, save the blurred image.

                  Qt Doc Search for browsers: forum.qt.io/topic/35616/web-browser-extension-for-improved-doc-searches

                  1 Reply Last reply
                  0
                  • ? Offline
                    ? Offline
                    A Former User
                    wrote on last edited by
                    #9

                    thank you ,my way is get two image by 'photoshop'!
                    but I think it is not good !
                    [quote author="JKSH" date="1377050466"][quote author="hk520590" date="1377049309"]thank you,but my program is gui ![/quote]It is hard to achieve the effect with C++ code.

                    It is better if you use an image editing program to make it blur. Then, save the blurred image.[/quote]

                    1 Reply Last reply
                    0
                    • JKSHJ Offline
                      JKSHJ Offline
                      JKSH
                      Moderators
                      wrote on last edited by
                      #10

                      [quote author="hk520590" date="1377075638"]thank you ,my way is get two image by 'photoshop'!
                      but I think it is not good ![/quote]It is the best way.

                      There are 3 possible solutions:

                      Write image processing code in C++ to make the blur

                      Convert your GUI from C++ to QML, and then use the QML blur feature

                      Use Photoshop

                      (1) and (2) both take a long time. (3) is the fastest.

                      Qt Doc Search for browsers: forum.qt.io/topic/35616/web-browser-extension-for-improved-doc-searches

                      1 Reply Last reply
                      0
                      • ? Offline
                        ? Offline
                        A Former User
                        wrote on last edited by
                        #11

                        thank you, but I want to the user self define,
                        how to achieve it?
                        sorry my English is poor!

                        1 Reply Last reply
                        0
                        • ? Offline
                          ? Offline
                          A Former User
                          wrote on last edited by
                          #12

                          thank you, but I want to the user self define, how to achieve it?
                          sorry my English is poor!
                          [quote author="JKSH" date="1377079071"][quote author="hk520590" date="1377075638"]thank you ,my way is get two image by 'photoshop'!
                          but I think it is not good ![/quote]It is the best way.

                          There are 3 possible solutions:

                          Write image processing code in C++ to make the blur

                          Convert your GUI from C++ to QML, and then use the QML blur feature

                          Use Photoshop

                          (1) and (2) both take a long time. (3) is the fastest.[/quote]

                          1 Reply Last reply
                          0
                          • JKSHJ Offline
                            JKSHJ Offline
                            JKSH
                            Moderators
                            wrote on last edited by
                            #13

                            Choose (1) or (2)

                            If you want, you can post in a subforum with other languages like http://qt-project.org/forums/viewforum/39/

                            Qt Doc Search for browsers: forum.qt.io/topic/35616/web-browser-extension-for-improved-doc-searches

                            1 Reply Last reply
                            0
                            • ? Offline
                              ? Offline
                              A Former User
                              wrote on last edited by
                              #14

                              thank you!
                              I have solved!
                              my way is:
                              @ QPainter p(this);

                              QRect rc(0,0,300,this->height());
                              p.drawImage(rc,image);
                              
                              QLinearGradient linearGradient(280,0,300, 0); 
                              
                              linearGradient.setColorAt(0,QColor(255,255,255,0));
                              linearGradient.setColorAt(1.0,image.pixel(150,50)); 
                              
                              p.setBrush(QBrush(linearGradient));
                              
                              p.setPen(QColor(255,255,255,0));
                              p.drawRect(0,0,this->width(),this->height());@
                              

                              [quote author="JKSH" date="1377134599"]Choose (1) or (2)

                              If you want, you can post in a subforum with other languages like http://qt-project.org/forums/viewforum/39/[/quote]

                              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
                              • Unsolved