Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. MultiEffect not changing color of image
QtWS25 Last Chance

MultiEffect not changing color of image

Scheduled Pinned Locked Moved Solved QML and Qt Quick
2 Posts 1 Posters 472 Views
  • 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.
  • mzimmersM Offline
    mzimmersM Offline
    mzimmers
    wrote on last edited by
    #1

    Hi all -

    I'm trying to use MultiEffect to change the color of an image. From my reading of the docs, I'd expect this code to change the color of the image to yellow:

    import QtQuick
    import QtQuick.Controls
    import QtQuick.Effects
    
    ApplicationWindow {
        id: mainWindow
    
        visible: true
        width: 640
        height: 480
    
        Image {
            id: image
            anchors.centerIn: parent
            fillMode: Image.PreserveAspectFit
            source: "qrc:/HomeBlue.svg"
            visible: false
        }
    
        MultiEffect {
            source: image
            anchors.fill: image
            colorization: 1.0
            colorizationColor: 'yellow'
        }
    }
    

    But it's not. I've tried with a PNG file with no luck.
    I'll also include the source for the SVG file I'm using, in case someone wants to try to replicate my issue:

    <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
    <path d="M27 26.9998V14.4373C26.9978 14.2989 26.9679 14.1623 26.912 14.0357C26.8562 13.909 26.7756 13.7948 26.675 13.6998L16.675 4.61228C16.4907 4.44363 16.2499 4.3501 16 4.3501C15.7501 4.3501 15.5093 4.44363 15.325 4.61228L5.325 13.6998C5.22437 13.7948 5.14378 13.909 5.08796 14.0357C5.03215 14.1623 5.00224 14.2989 5 14.4373V26.9998" stroke="#161254" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
    <path d="M2 27H30" stroke="#161254" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
    <path d="M19 27V20C19 19.7348 18.8946 19.4804 18.7071 19.2929C18.5196 19.1054 18.2652 19 18 19H14C13.7348 19 13.4804 19.1054 13.2929 19.2929C13.1054 19.4804 13 19.7348 13 20V27" stroke="#161254" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
    </svg>
    

    Thanks for any enlightenment on this...

    mzimmersM 1 Reply Last reply
    0
    • mzimmersM mzimmers

      Hi all -

      I'm trying to use MultiEffect to change the color of an image. From my reading of the docs, I'd expect this code to change the color of the image to yellow:

      import QtQuick
      import QtQuick.Controls
      import QtQuick.Effects
      
      ApplicationWindow {
          id: mainWindow
      
          visible: true
          width: 640
          height: 480
      
          Image {
              id: image
              anchors.centerIn: parent
              fillMode: Image.PreserveAspectFit
              source: "qrc:/HomeBlue.svg"
              visible: false
          }
      
          MultiEffect {
              source: image
              anchors.fill: image
              colorization: 1.0
              colorizationColor: 'yellow'
          }
      }
      

      But it's not. I've tried with a PNG file with no luck.
      I'll also include the source for the SVG file I'm using, in case someone wants to try to replicate my issue:

      <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
      <path d="M27 26.9998V14.4373C26.9978 14.2989 26.9679 14.1623 26.912 14.0357C26.8562 13.909 26.7756 13.7948 26.675 13.6998L16.675 4.61228C16.4907 4.44363 16.2499 4.3501 16 4.3501C15.7501 4.3501 15.5093 4.44363 15.325 4.61228L5.325 13.6998C5.22437 13.7948 5.14378 13.909 5.08796 14.0357C5.03215 14.1623 5.00224 14.2989 5 14.4373V26.9998" stroke="#161254" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
      <path d="M2 27H30" stroke="#161254" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
      <path d="M19 27V20C19 19.7348 18.8946 19.4804 18.7071 19.2929C18.5196 19.1054 18.2652 19 18 19H14C13.7348 19 13.4804 19.1054 13.2929 19.2929C13.1054 19.4804 13 19.7348 13 20V27" stroke="#161254" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
      </svg>
      

      Thanks for any enlightenment on this...

      mzimmersM Offline
      mzimmersM Offline
      mzimmers
      wrote on last edited by
      #2

      I found the problem (at least for SVG files)...same principle as this one.

      Evidently, for MultiEffect colorization to work, whatever it's going to colorize must be set to white. This applies to strokes as well as fill. I don't know whether this is a bug, or just the way it works.

      1 Reply Last reply
      0
      • mzimmersM mzimmers has marked this topic as solved on

      • Login

      • Login or register to search.
      • First post
        Last post
      0
      • Categories
      • Recent
      • Tags
      • Popular
      • Users
      • Groups
      • Search
      • Get Qt Extensions
      • Unsolved