1

I have make simple rectangle in qml but when width of window 400, the quality is but when change size of window, one or two sides of the rectangle is not ok!

Even add these code! not fix!

antialiasing: true
smooth: true
layer.enabled: true
layer.mipmap: true
layer.smooth: true

In first below image is bad graphics, how to solve that?!

When default run : (down & right sides is bad and low graphics)

enter image description here

when width of window is equal 400 :

enter image description here

or when border is equal 2 :

enter image description here

How to ok that?!

    Window {
    id: window
    width: 401
    height: 400
    visible: true

    onWidthChanged: console.log(width)

    color: 'gray'

    Slider{
        id: slider
        from: 1
        to: 2
        onValueChanged: console.log(value)
    }

    Rectangle{
        id: simpleRectangle
        x: 90
        y:150

        color: 'transparent'
        border.color: "#262626"
        border.width: slider.value

        width: parent.width * .5
        height: width*.6

    }
}

This prob is enter link description here can be observed;

eyllanesc
  • 235,170
  • 19
  • 170
  • 241
S At
  • 422
  • 5
  • 15

1 Answers1

0

Your Rectangle is using width: parent.width * .5. When the parent.width is 401 that will return 200.5. So you're asking it to draw a border at a half pixel boundary. It accomplishes that by using anti-aliasing across the nearest two pixels. If you want it to round to the nearest whole pixel, then you can use math functions:

width: Math.round(parent.width * .5)
height: Math.round(width * .6)
JarMan
  • 7,589
  • 1
  • 10
  • 25
  • Thanks, but when use this or set `width: 201` the down side is not ok! – S At Jul 30 '21 at 12:56
  • 1
    You need to do the same for `height`. I've updated my answer. – JarMan Jul 30 '21 at 12:58
  • Thx, when add radius for four corner, none of them not smooth! Can u suggest me?! – S At Jul 30 '21 at 13:02
  • I'm not sure what you are seeing with your corners. You may want to create a separate question for that. – JarMan Jul 30 '21 at 13:05
  • type of `width` is `real`, why can't set `200.5` on it?! – S At Jul 30 '21 at 13:11
  • You can set it to 200.5. But there's no such thing as half of a pixel. So Qt simulates that by blending it across the two nearest pixels. Read up on anti-aliasing. – JarMan Jul 30 '21 at 13:13