HISE Logo Forum
    • Categories
    • Register
    • Login

    Something is wrong with colour blending when opacity is involved

    Scheduled Pinned Locked Moved Bug Reports
    30 Posts 6 Posters 1.5k Views
    Loading More Posts
    • 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.
    • d.healeyD
      d.healey @Matt_SF
      last edited by

      @Matt_SF I don't see a difference.

      @tomekslesicki's is on the left, yours is on the right

      ef6f4461-fec9-486b-a970-de3446d878b3-image.png

      Matt_SFM 1 Reply Last reply Reply Quote 0
      • Matt_SFM
        Matt_SF @d.healey
        last edited by Matt_SF

        @d-healey ah, that's odd... here's what I get

        8ac26944-212a-408e-867a-ec20c920200c-image.png

        Develop branch
        Win10 & VS17 / Ventura & Xcode 14. 3

        T 1 Reply Last reply Reply Quote 0
        • T
          tomekslesicki @Matt_SF
          last edited by

          Thanks guys, I'm getting the same problem with Matt's snippet, unfortunately.

          @d-healey maybe you're right about the opacity stack, but then if 1 is 100%, isn't it a bug that if a semi-transparent layer is overlayed on top of a layer that already is fully visible, the opacity can go above 100%?

          d.healeyD 1 Reply Last reply Reply Quote 0
          • d.healeyD
            d.healey @tomekslesicki
            last edited by

            @tomekslesicki Yes it does seem a little strange

            Christoph HartC 1 Reply Last reply Reply Quote 0
            • Christoph HartC
              Christoph Hart @d.healey
              last edited by

              Alright, either my monitor is not calibrated correctly or I'm getting blind, but I don't see any difference and this entire topic looks like a big prank to me :)

              Can somebody make a clear example that shows the difference like night and day type (and not a colour that is 0xFF292929 but should be 0xFF292928.

              T 1 Reply Last reply Reply Quote 0
              • T
                tomekslesicki @Christoph Hart
                last edited by

                @Christoph-Hart it's not about night and day, it's just that if it's about creating an impression of a half-opaque panel with controls, it doesn't look good if there's suddenly a rectangle overlaid on top of the panel.

                Christoph HartC 1 Reply Last reply Reply Quote 0
                • Christoph HartC
                  Christoph Hart @tomekslesicki
                  last edited by

                  @tomekslesicki But where is the rectangle? I don't see a rectangle.

                  d.healeyD 1 Reply Last reply Reply Quote 0
                  • d.healeyD
                    d.healey @Christoph Hart
                    last edited by

                    @Christoph-Hart

                    But where is the rectangle? I don't see a rectangle.

                    Must be a monitor (or eyeball) setting issue :p the rectangle is subtle. I'll see if I can make a clearer example.

                    d.healeyD 1 Reply Last reply Reply Quote 0
                    • d.healeyD
                      d.healey @d.healey
                      last edited by

                      This post is deleted!
                      1 Reply Last reply Reply Quote 0
                      • d.healeyD
                        d.healey
                        last edited by d.healey

                        Ok here's something interesting.

                        Alpha values

                        0.1 = No rectangle
                        0.2 = No rectangle
                        0.3 = Rectangle
                        0.4 = No rectangle
                        0.5 = Rectangle
                        0.6 = No rectangle @tomekslesicki Maybe just use this value
                        0.7 = Rectangle
                        0.8 = No rectangle
                        0.9 = Rectangle

                        Here I have taken the same snippet as before and adjusted the contrast in an image editor

                        3dc29a29-5f8e-49e4-be9e-93cb1e27663c-image.png

                        T 1 Reply Last reply Reply Quote 0
                        • T
                          tomekslesicki @d.healey
                          last edited by

                          @d-healey thanks, David, you're way better at explaining things than I am!

                          Christoph HartC 1 Reply Last reply Reply Quote 0
                          • Christoph HartC
                            Christoph Hart @tomekslesicki
                            last edited by

                            @tomekslesicki Ah finally - actually I think that the PNG compression of the screenshot makes the differences even more subtle, but now I have finally proof that you aren't executing an elaborated prank :)

                            Alright, the minimal use case to demonstrate this issue is:

                            const var Background = Content.getComponent("Background");
                            
                            const var backgroundgrey = 0xFF333333;
                            
                            Background.setPaintRoutine(function(g)
                            {
                            	g.fillAll(backgroundgrey);
                            	g.setColour(Colours.withAlpha(backgroundgrey, 0.6));
                            	g.fillRect(this.getLocalBounds(50));
                            });
                            

                            I've deliberately used a pure grey in order to rule out rounding errors. For me, 0.6 creates the most visible rectangle. Curiously, in a raw JUCE component, it doesn't show that rectangle, so I'll try to check where the error comes from.

                            Christoph HartC 1 Reply Last reply Reply Quote 2
                            • Christoph HartC
                              Christoph Hart @Christoph Hart
                              last edited by

                              Curiously, in a raw JUCE component, it doesn't show that rectangle

                              Nope, my weak eyes struck again, it's actually the same when using raw JUCE.

                              auto grey = Colour(0xFF333333);
                              
                              g.fillAll(grey);
                              g.setColour(grey.withAlpha(0.6f));
                              g.fillRect(getLocalBounds().reduced(50));
                              

                              Also shows up that box. Now it gets complicated :)

                              Christoph HartC 1 Reply Last reply Reply Quote 1
                              • Christoph HartC
                                Christoph Hart @Christoph Hart
                                last edited by

                                I've posted it in the JUCE forum, let's see how it goes.

                                Link Preview Image
                                Subtle colour error

                                Hi everybody, it seems that the graphics renderer behaves a bit weird when drawing the same colour over itself with a different alpha value. The best way to reproduce this is this example code: auto grey = Colour(0xFF3…

                                favicon

                                JUCE (forum.juce.com)

                                I wouldn't hold my breath that there is an easy solution for this though...

                                1 Reply Last reply Reply Quote 1
                                • First post
                                  Last post

                                20

                                Online

                                1.9k

                                Users

                                12.5k

                                Topics

                                108.8k

                                Posts