CODEWITHSUNDEEP
iosswiftuiimageviewinterface-builderuivisualeffectview
Jacob
Jacob

Reputation: 2338

Vibrancy Effect on UIImageView

I asked this question a while back, but I seem to be having somewhat of the same issue, now with a UIImageView: Vibrancy Effect on UIButton in Interface Builder

What I would like to do is replicate the effect seen in the iOS Photos app on the play icon when looking at a video thumbnail. Here is a screenshot:

Example

As you can see, there seems to be a nested UIVisualEffectView, one with an Extra Light Blur, and one with a Dark Blur and Vibrancy. However, when I try to implement this setup in interface builder I do not get the same result. The part I am struggling with is getting the play arrow to use vibrancy.

The only image I am using is the play arrow, and I have set its rendering mode to Template as the Apple docs say to do.

Any help would be appreciated!

Upvotes: 1

Views: 1101

Answers (1)

Warif Akhand Rishi
Warif Akhand Rishi

Reputation: 24248

enter image description here

Made a demo project at
https://github.com/rishi420/VibrancyEffectTest

First I tried with ASCII character used for play. The character is "►". Set it as a button title. It works but not very beautiful.

Then I tried with image. The image has solid color for the middle triangle. Other areas are transparent. It would look like this:
enter image description here

This is how it looks on white background. Simply hide the backgroundImageView in the sample project. I see gray color arrow, can not reproduce "but in this sample project it is just white".

For test, In the middle image there is a transparent (0.5) dark view behind the vibrancy effect view.

enter image description here

Upvotes: 1

Related Questions