0

Rough example of what I am trying to do

I updated this with an image of what I am trying to achieve, its a blur on a image which adds a touch of shading and even white on white is visible. I am basically working on putting buttons of various kinds on top of images and welcome's any and all assistance on best practices. I know facebook does this in some way as an app example.

To summarize what I am trying to achieve. I have an image that takes up the full screen and I would like to place a button on top of that image that does something like blur around it with padding so that it looks clean on top of the image. My button is a heart png, red outline with clear inside, and is represented as a square because of the irregular shape. I would like the heart to be on top of a circle that does something like blur the image so it can always be seen.

I found a number of similar solutions to this problem using UIBlurEffect but nothing that specifically addresses the "square image" and how I would control making the blur circle larger/smaller in terms of the padding around the square. I tinkered with creating a UIView that was transparent, placing a circle with a blur into there and then adding the button with their centers aligned but this seems like an incorrect approach and wasn't quite working. I suspect that for people with expertise this is something where I just need to have the correct usage of the UIBlurEffect.

matt
  • 515,959
  • 87
  • 875
  • 1,141
Daniel Patriarca
  • 361
  • 3
  • 20
  • Can you please attach an image of what you're trying to achieve? – Jack Tiong May 02 '19 at 01:30
  • Let me work on an image in Adobe of what I am trying to achieve. An app that does something similar is the iPhone phone app. When you are on a call there are circular buttons for mute, keypad, speaker, add call, facetime, and contacts. The button images are inside a circle. In my ideal example my heart image would be inside that circle, the circle would be a blur effect, and I would be able to make the circle larger or smaller by adjusting an integer value or something. – Daniel Patriarca May 02 '19 at 22:47
  • I added an image. Hopefully this helps clear up what I am trying to do? – Daniel Patriarca May 04 '19 at 02:13

0 Answers0