Forums

OverviewV-Play 2 Support (Qt 5)MultiResolutionImage – am I using it wrong › Reply To: MultiResolutionImage – am I using it wrong

OverviewV-Play 2 Support (Qt 5)MultiResolutionImage – am I using it wrong › Reply To: MultiResolutionImage – am I using it wrong
#8432

Christian
V-Play Team

Hi alb,

great question!

You did nothing wrong, it is just how the MultiResolutionImage works internally..

First, you would need to provide different versions of your image for MultiResolutionImage to make sense. That is, a low-res version img.png, then a hd version stored in +hd/img.png and a hd2 version +hd2/img.png.

Second, you would need to revert the scaling that is applied internally in MultiResolutionImage. You can take this code as a reference which we are using to make a round circular overlay around an Image in the GameNetwork user view:

// scaling is required otherwise the image would be blurred due to content scaling
Item {
    scale: internalContentScaleFactorForImages
    transformOrigin: Item.TopLeft
    // we need to set a height so verticalCenter anchor works
    height: avatar.height * internalContentScaleFactorForImages
    anchors.verticalCenter: parent.verticalCenter

  Image {
    id: avatar
    width: roundedImage.width / internalContentScaleFactorForImages
    height: roundedImage.height / internalContentScaleFactorForImages
    smooth: true
    visible: false
  }

  Rectangle {
    id: maskObject
    // the black part is the inner circle
    color: "black"
    anchors.fill: avatar
    // if the logical size is used here, it looks blurry; 
    // thus first scale it twice the size of the contentScale and then scale it back again! 
    radius: avatar.width * 0.5
    visible: false
    smooth: true

  }

  OpacityMask {
    anchors.fill: avatar
    source: avatar
    maskSource: maskObject
  }

}// end of scaled Item

 

Cheers, Chris

Voted #1 for:

  • Easiest to learn
  • Most time saving
  • Best support

Develop Cross-Platform Apps and Games 50% Faster!

  • Voted the best supported, most time-saving and easiest to learn cross-platform development tool
  • Based on the Qt framework, with native performance and appearance on all platforms including iOS and Android
  • Offers a variety of plugins to monetize, analyze and engage users
FREE!
create apps
create games
cross platform
native performance
3rd party services
game network
multiplayer
level editor
easiest to learn
biggest time saving
best support