1

I have an UITextView with a "dropshadow" and a tableView below it. The problem that I can't figure out is how to make the "dropshadow" transparent so that tableView and details below can be seen through the shadow (see image below). I tried playing with the opacity and radius but it's not working.

Here is my code to create the drop shadow:

postDetails.layer.shadowColor = [[UIColor blackColor] CGColor];
postDetails.layer.shadowOffset = CGSizeMake(0.0f, 3.0f);
postDetails.layer.shadowRadius = 3.0f;
postDetails.layer.shadowOpacity = 0.3f;
postDetails.layer.masksToBounds = NO;

EDIT: I think what is also contributing to the issue is the the layout. it is:

  • UIView (superview)
  • UITextview (subview of UIView)
  • UITableView (subview of UIView)

The text should be able to be seen through the shadow for a cleaner look.

enter image description here

sudo
  • 1,648
  • 1
  • 20
  • 22

5 Answers5

2

The way I was able to do this is through the .shouldRasterize property.

  1. I create a view called shadow view.
  2. Make sure it is not transparent in any way.

  3. Configure the shadow in code:

    UIBezierPath *shadowPath = [UIBezierPath bezierPathWithRect:_viewShadow.bounds];
_viewShadow.layer.masksToBounds = NO;
_viewShadow.layer.shadowColor = [UIColor blackColor].CGColor;
_viewShadow.layer.shadowOffset = CGSizeMake(0.0f, 0.0f);
_viewShadow.layer.shadowOpacity = 1.0f;
_viewShadow.layer.shadowPath = shadowPath.CGPath;
_viewShadow.layer.shouldRasterize = true;

  4. Now we can make our shadow view transparent!

    _viewShadow.alpha = 0.8f;

  5. At this point you should see a transparent view where the drop shadow only shows outside of the borders of the image.

  6. Lastly, we display our content on top of the shadow view so it is not effected by the alpha changes.

I basically use the .shouldRasterize property to render the layer before any alpha-blending is done with the parent layer.

Isaac Paul
  • 1,959
  • 2
  • 15
  • 20
0

Try using the below code:

postDetails.layer.shadowColor = [UIColor colorWithWhite:.5 alpha:1].CGColor;
postDetails.layer. shadowOpacity = 1.0f;
Deepak Khiwani
  • 734
  • 1
  • 8
  • 33
0

Drop shadow for the textView will not solve your problem since it wont extend to the full length of tableView. Instead of this you can put a transparent view to the top of tableView. Add a temporary view with background transparent background color during editing and remove after the editing done 

self.overlayView.backgroundColor = [UIColor colorWithRed:1.0 green:1.0 blue:1.0 alpha:0.5];
Anil Varghese
  • 42,757
  • 9
  • 93
  • 110
  • Not a bad idea but then you don't get the shadow effect.. just a dark bar. – sudo May 26 '14 at 05:44
  • What you have done? You have add this overlayView as a sub view the tableView area – Anil Varghese May 26 '14 at 05:50
  • You can search for transparent view or blurred view in iOS. Anyway drop shadow will not serve you much iam sure – Anil Varghese May 26 '14 at 05:52
  • I created a transparent view and added it as a subview below the uitextview, although it is transparent.. you dont get the same look as a shadow.. – sudo May 26 '14 at 21:20
0

Just set 

postDetails.layer.borderColor = [[UIColor grayColor] CGColor]; // set color as you want
postDetails.layer.shadowOpacity = 0.3f; // set Opacity as you want
postDetails.layer.shadowOffset = CGSizeMake(0.0, -1.0); // set it as you want
iPatel
  • 46,010
  • 16
  • 115
  • 137
0

I used an UIImageView to provide the shadow. I created an image of 1 pixel wide, by 12 pixels high. The image was black, but the alpha was a gradient from 0.5 at the top to 0.0 at the bottom eg. RGBA 1.0,1.0,1.0,0.5 -> 1.0,1.0,1.0,0.0 - I then placed the UIImageView just below the view needing the shadow, and stretched it horizontally across the width of the view. I have also used this when I needed to change the intensity of the shadow when a scroll view below is scrolling, by changing the UIImageView.alpha value

K1w1Geek
  • 605
  • 5
  • 5