Search code examples
iosswiftuiviewcore-graphicstransparency

Make UIView Transparent to Only Certain Views


I currently have a UIView, which is completely transparent and put above many other labels. There is a background image behind all the labels, and, since all labels are transparent-backgrounded, I can see through them to see the picture. Then, as this view placed on top of labels is also set to transparent, I can see the labels behind it. Is there a way to make this view only transparent to the background image? That it, when I see through it, I ONLY see the background image and not the labels, as if the labels don't exist under this view.

P.S. I've seen this post which is definitely related, but the link in the answer is dead.

Thanks in advance!

EDIT

This is what I mean:

enter image description here

The transparent view that the arrow is pointing to, is NOT in the scroll view, but hovering above it. There will be a lot of text content in the scrollview, and therefore when they pass under the pointed view, they will be visible. How do I make this hovering view reflect only the big imageview behind it, and not any text behind it? That is, I want that when texts pass under this view, they are invisible, and the view always reflects the background image. And, as it's an always-changing image and not a solid color, I cannot just set the color of this hovering view to match the background.


Solution

  • I don't really get your question, but I will give you a solution the link you have provided.

    So in the link, we have a big transparent circle and we wish to block the small circle in the background right.

    What you can is this.

    You create two identical views.

    First view is your normal view, you display whatever you want on it. The second you will be a backgroundView which is of the same position and same size as the first view. But the catch is this, the backgroundView will be displaying the same background color as the real background view.

    So the view hierarchy will be like this

    1. Display View (Circle shape)
    2. BackgroundView (Circle size, same position as first view, same color as real background view, in this case color Blue)
    3. Real BackgroundView (Color blue ).

    then all you have to do is keep the alpha value of the backgroundView as 1 and change the alpha value of the first view to, let's say, 0.6

    sample code

     private func addCircle(){
        // adding a blue circle
        let circleView = UIView()
        circleView.backgroundColor = .blue
        circleView.alpha = 0.5
    
        view.addSubview(circleView)
    
        circleView.bounds = CGRect(x: 0, y: 0, width: 100, height: 100)
        circleView.center = view.center
        circleView.layer.cornerRadius = 100 / 2
        circleView.layer.masksToBounds = true
    
    
        // adding a backgroundView
        let backgroundView = UIView()
        backgroundView.backgroundColor = .red
        view.insertSubview(backgroundView, belowSubview: circleView)
    
        backgroundView.bounds = CGRect(x: 0, y: 0, width: 100, height: 100)
        backgroundView.center = view.center
        backgroundView.layer.cornerRadius = 100 / 2
        backgroundView.layer.masksToBounds = true
    
    
    }