The UIActionSheet, when it has lots of items, is presented as a table with a border around it.
I'm trying to get a similar effect because I have a UIView with multiple UITableViews and I'd like to visually separate them. I'd like to use a border graphic that I specify.
Notice that with the UIActionSheet, the table actually sits inside the border and you see the table scroll underneath the rounded corners. You can see this in the Photos app if you view an image in landscape mode and hit the bottom-left hand corner button.
How do I get this same effect?
Edit: the "On This Day" by Sophiestication Software does something similar to what I want. The app uses a custom graphic that sits on top of a scrolling view so that the scrolling content appears to be underneath the image.
The simplest way is probably to add a border on the CALayer of the UITableView:
CALayer *layer = tableview.layer;
layer.borderWidth = 2;
layer.borderColor = [[UIColor redColor] CGColor];
layer.cornerRadius = 10;
layer.masksToBounds = YES;
Note that you need to include <QuartzCore/QuartzCore.h> and link with the QuartzCore framework.
layer.borderSize did not work for me layer.borderWidth did the trick.
Related
I'm having an issue when I attempt to add a drop shadow to an MKMapView's layer, in order for the shadow to be visible I have to set the view's clipsToBounds property to false. However, doing so causes the map tiles to draw outside the view's boundaries, overlapping the shadow and cutting of parts of my view. The result looks something like this:
I'm wondering if there's a way to draw a drop shadow without disabling bounds clipping or otherwise get the drop shadow to appear without this ugly visual bug. My code for setting the drop shadow looks like this:
self.mapView.layer.borderWidth = 5.0;
self.mapView.layer.borderColor = [[UIColor whiteColor] CGColor];
self.mapView.layer.shadowOffset = CGSizeMake(0.0, 0.0);
self.mapView.layer.shadowColor = [[UIColor blackColor] CGColor];
self.mapView.layer.shadowRadius = 5.0;
self.mapView.layer.shadowOpacity = 0.2;
self.mapView.clipsToBounds = NO;
Since the layer is owned by the MKMapView, it’s generally not a great idea to be touching it yourself. (This is the kind of thing that’s likely to break in weird ways in later OS versions, and behave in unpredictable ways (it’d be interesting to see if that even works at all with the new iOS 6 3D maps). With layer-backed views on OS X, you’re not supposed to touch the layer directly at all (unless it’s layer-hosting view, but that’s a different discussion))
To get a shadow underneath, just make your own new CALayer with a shadow positioned underneath the map. Alternatively nest the MKMapView as a subview of your own UIView, and add the shadow to your view (that has no need for clipping) instead.
You have to create two views, one for the shadow and an other for the rounded corners.
More info here : UIView Round Corners with Shadow
I'm trying to make a UITableView look as though it's on top of a stack of papers. I did a similar version of this using UIView by overriding drawRect, but with UITableView's complexity, I believe it will be more involved than it was with a standard UIView. If I use a stretchable image, the stretched bits won't line up. What would be the best way of achieving something like this?
For Shadow, you can use the CALayer, as in the example below.
tableView.layer.shadowRadius = 3.f;
tableView.layer.shadowColor = [UIColor blackColor].CGColor;
tableView.layer.shadowOffset = CGSizeMake(2, 2);
tableView.layer.shadowOpacity = .6f;
For the stack impression, i would add some views with same shadow borders beneath the table view.
I have a UIView set as "shadow", and I put this view behind a UIImageView to create a shadow effect. The only problem is, if you decrease the alpha of the image, you can see the white part of the UIView. How do I hide the whole UIView except for the shadow? Setting the backgroundColor to clearColor hides both the view and the shadow, which doesn't help. Thanks.
shadow.alpha = 0.95;
shadow.layer.cornerRadius = 10;
shadow.layer.shadowColor = [UIColor blackColor].CGColor;
shadow.layer.shadowOpacity = 1.0;
shadow.layer.shadowRadius = 10.0;
shadow.layer.shadowOffset = CGSizeMake(0, 4);
Have you tried modifying the UIImageView's layer to have the shadow, rather than having two views?
If that doesn't give the desired output, does a black UIView work? If you post a screenshot and the desired effect, maybe I can be of more assistance.
I don't think it's possible to do what you're attempting using the built-in shadow facilities. As you've discovered, there has to be something drawn in order for Quartz to have an outline to automatically shadow. (In this case, it's the background roundrect of the view.)
If you specify an explicit roundrect shadowPath for the shadow view's layer, that will do away with the need for the view to actually draw anything. However, the shadow itself appears to be constructed by filling the shadow path and then blurring and translating the resulting image, so you'll end up with essentially the same effect of a black background for the view.
I agree with Ryan Oksenhorn that you'd be better off working with the image view itself. If you add a shadow there, its opacity will drop with the view's, but that's probably all for the better. Do you really want to fade the image and leave a disembodied shadow behind?
How about you set
shadow.backgroundColor = [UIColor blackColor];
shadow.alpha = 1.0;
I have an app that I a writing that have 3 buttons with a background image for each button.
When the user touch one of the buttons I want that a green frame will appear around the the button for a 2 seconds and then disappear.
I know the I can build 2 separate images with and without the frame around the image but this will cause double the amount of files.
Is there any other way to do it?
Yes, you can add a border to any UIView (UIButton is a subclass of UIView) by accessing properties of the CALayer in the view:
button.layer.cornerRadius = 6; // if you want rounded corners
button.layer.borderWidth = 2;
button.layer.borderColor = [UIColor greenColor].CGColor;
You will need to import QuartzCore.h in the file to be able to reference the layer declarations:
#import <QuartzCore/QuartzCore.h>
You can turn on the border in response to the button's touch down (or up) event and then turn it off (borderWidth=0) with a timer.
i don't think there is a way to make it the way you want.
you have to make just two image, one when the button is not selected and the other when it's selected.
I have a UIView to which i add a background image. Then to that view i add a scroll view. To the scroll view i add some UIButtons.
I would like to be able to set the scroll view to be transparent (still being able to see the UIButtons) so that i can see the background image underneath it, so that it shows between the buttons.
I have tried setting the scrollview background to [UIColor clearColor] but this doesnt work.
Thanks.
In addition to setting the backgroundColor to [UIColor clearColor], you also have to set
scrollView.opaque = NO;
Change the UIScrollView.alpha level to 0.0f