png ring of death revisited

Versions

• Python: 3.7.1
• OS: MacOS Mojave 10.14
• MacBook Pro (Retina, 13-inch, Early 2015)
• Intel Iris Graphics 6100 1536 MB
• Kivy: 1.10.1
• Kivy installation method: pip install into conda environment

Description

When placing a png on a canvas a ring appears around the outside unexpectedly. The expectation is that no ring will appear.

This issue has been discussed in the past: https://groups.google.com/forum/#!topic/kivy-users/W2lloACEKCw

And there is a similar issue: #4463

The above do not address the use case below where an image simply needs to be placed on a canvas that does not have a uniform background. Maybe I did not understand the discussed solutions, but I tried exporting this white_circle.png format from Adobe illustrator in about every configuration I could think of: PNG, PNG8, anti-aliasing options, interlace options. The transparency option has to be enabled because the image crosses boundaries.

Code and Logs

from kivy.app import App
from kivy.lang import Builder
from kivy.uix.boxlayout import BoxLayout


Builder.load_string("""
<MainWidget>

    canvas.before:
        Color:
            rgba: 1,1,1,1
        Rectangle:
            pos: self.pos
            size: self.size
    
    Widget:
    
    Widget:
        canvas.before:
            Color:
                rgba: 0.5,0.5,0.5,1
            Rectangle:
                pos: self.pos
                size: self.size
            
            Color:
                rgba: 1,1,1,1
            Rectangle:
                source: './white_circle.png'
                pos: self.pos[0] - dp(100), self.pos[1] + dp(100)
                size: self.width + dp(200), self.width + dp(200)
            
    Widget:
            
""")


class MainWidget(BoxLayout):
    def __init__(self, **kwargs):
        super(MainWidget, self).__init__(**kwargs)


class MyApp(App):
    def build(self):
        return MainWidget()


if __name__ == '__main__' or __name__ == 'android':
    MyApp().run()

Screen shot

white_circle.png

[tshirtman]

It’s unlikely to be solved us any time soon, i’m fine with leaving it open for reference, but if you (or anyone) wants to investigate and find a proper fix, that would be awesome 😃.

[tito]

@ssolari “Preventing an outline in parts of the PNG when scaling the image” - we cannot do magic everywhere for everything! 😃

As explained before, the RGB part when the A is black (aka transparent) have a wrong color. You must put white color if you want to have good antialiasing. I don’t know how others toolkit are “fixing” theses kind of issues. When you make transparent images: make sure the RGB part always cover the whole image with a consistent color (aka if you do a circle, you shouldn’t see a black/white circle in RGB). Only Alpha should have black/white that create the circle shape.

IMO, it is not revisited, it’s the same as explained on previous posts 😃