I did add round corner in UItableView but only in top corners.
The problem is that when I use mask in UItableView, the UItableView show only the first 4 cells.
When I comment the code from mask, the tableview works fine..
Here is my code:
UIBezierPath *maskPath;
maskPath = [UIBezierPath bezierPathWithRoundedRect:_tbFeeds.bounds byRoundingCorners:(UIRectCornerTopLeft | UIRectCornerTopRight) cornerRadii:CGSizeMake(9.0, 9.0)];
CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init];
maskLayer.frame = _tbFeeds.bounds;
maskLayer.path = maskPath.CGPath;
_tbFeeds.layer.mask = maskLayer; //tbfeeds is my tableview
[maskLayer release];
A way to do this would be to add a header to the tableview:
- (void)loadView {
UIView *headerView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, 10)]; // height of header (10)
[headerView setBackgroundColor:[UIColor whiteColor]]; // color of header (white)
UIBezierPath *maskPath;
maskPath = [UIBezierPath bezierPathWithRoundedRect:headerView.bounds byRoundingCorners:(UIRectCornerTopLeft | UIRectCornerTopRight) cornerRadii:CGSizeMake(5.0, 5.0)];
CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init];
maskLayer.frame = headerView.bounds;
maskLayer.path = maskPath.CGPath;
headerView.layer.mask = maskLayer;
self.tableView.tableHeaderView = headerView;
}
Related
I want to add some UILabels on top of my UIImagePickerController's custom OverlayView but can't seem to get it working.
Here is my code.
-(IBAction)getPhoto:(id)sender{
picker = [[UIImagePickerController alloc] init];
picker.allowsEditing = NO;
picker.sourceType = UIImagePickerControllerSourceTypeCamera ;
picker.showsCameraControls = NO;
self.picker.navigationBarHidden = YES;
self.picker.toolbarHidden = YES;
OverlayView = [[OverlayView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width,1024)];
UILabel *label = [[UILabel alloc]initWithFrame:CGRectMake(OverlayView.frame.size.height/2, OverlayView.frame.size.width/2, 30, 100)];
label.textColor = [UIColor whiteColor];
label.text = #"find Me";
[self.OverlayView addSubview:label];
[self.OverlayView bringSubviewToFront:label];
picker.cameraOverlayView = OverlayView;
CGSize screenSize = [[UIScreen mainScreen] bounds].size; // 320 x 568
float scale = screenSize.height / screenSize.width*3/4; // screen height divided by the pickerController height ... or: 568 / ( 320*4/3 )
CGAffineTransform translate=CGAffineTransformMakeTranslation(0,(screenSize.height - screenSize.width*4/3)*0.5);
CGAffineTransform fullScreen=CGAffineTransformMakeScale(scale, scale);
picker.cameraViewTransform =CGAffineTransformConcat(fullScreen, translate);
[self presentViewController: picker animated:YES completion:NULL];
}
the overview shows up and it is full screen but no label
any ideas
Your label is just offscreen, check its frame
You can place it for instance like that, at least it will be visible
self.overlayView = [[OverlayView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height)];
UILabel *label = [[UILabel alloc]initWithFrame:CGRectMake(self.overlayView.frame.size.width/2, self.overlayView.frame.size.height/2, 30, 100)];
UIButton corners only two sides i.e. top right and bottom right with following:
UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:_nearmeButton.bounds byRoundingCorners:(UIRectCornerTopLeft | UIRectCornerBottomLeft) cornerRadii:CGSizeMake(20.0, 20.0)];
CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init];
maskLayer.frame = self.view.bounds;
maskLayer.path = maskPath.CGPath;
_nearmeButton.layer.mask = maskLayer;
But how to give border colour to above UIButton same as given image .
You are on the right track. Instead of setting your path as a mask you can add it to the buttons layer. Basically (more or less) every UIView is backed by a CALayer. Just set the colors you want on the stroke and the fill and add it to the buttons layer, and you are done.
UIBezierPath *borderPath = [UIBezierPath bezierPathWithRoundedRect:_nearmeButton.bounds byRoundingCorners:(UIRectCornerTopRight | UIRectCornerBottomRight) cornerRadii:CGSizeMake(20.0, 20.0)];
CAShapeLayer *borderLayer = [[CAShapeLayer alloc] init];
borderLayer.frame = self.view.bounds;
borderLayer.path = borderPath.CGPath;
borderLayer.strokeColor = [UIColor redColor].CGColor;
borderLayer.fillColor = [UIColor clearColor].CGColor;
borderLayer.lineWidth = 1.0;
[_nearmeButton.layer addSublayer:borderLayer];
If your buttons size changes you need to update the layer size also.
I'm trying to crop an image to an irregular shape, but I need to make the area that was removed transparent.
Inside subclass of UIView
CALayer *myLayer = [CALayer layer];
CAShapeLayer *mask = [CAShapeLayer layer];
myLayer.frame = self.bounds;
myLayer.contents = (id)[self.picture CGImage];
mask.path = path;
myLayer.mask = mask;
[self.layer addSublayer:myLayer];
This will crop the image appropriately, but the background color of the view is white and therefore still visible. I've tried making the other layers transparent, but it has not worked.
(self and subview both refer to same view)
[self layer].backgroundColor = [UIColor clearColor].CGColor //no change
[self layer].opacity = 0; //makes entire view transparent
subView.backgroundColor = [UIColor clearColor]; // entire view becomes transparent
Is it possible to create the effect I'm trying to achieve?
I tried the same thing, here is the exact code:
// In KMViewController.m
- (void)viewDidLoad
{
[super viewDidLoad];
self.view.backgroundColor = [UIColor lightGrayColor];
CGRect frame = CGRectMake(0.0f, 0.0f, 100.0f, 100.0f);
KMView *view = [[KMView alloc] initWithFrame:frame];
view.center = self.view.center;
[self.view addSubview:view];
}
// In KMView.m
- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
// self.backgroundColor = [UIColor clearColor];
CALayer *layer = [CALayer layer];
CAShapeLayer *mask = [CAShapeLayer layer];
layer.frame = self.bounds;
UIImage *image = [UIImage imageNamed:#"orange"];
layer.contents = (id)image.CGImage;
CGPathRef path = CGPathCreateWithEllipseInRect(frame, NULL);
mask.path = path;
CGPathRelease(path);
layer.mask = mask;
[self.layer addSublayer:layer];
}
return self;
}
It worked for me as expected. The background was transparent. Then I tried adding
self.backgroundColor = [UIColor clearColor];
to the beginning of the code and nothing changed, the image was showing on a transparent background clipped to the path.
I think the problem might be somewhere else.
I draw a view . The views frame = (0,0,44,44) and the views background color is black.
I want add a mask to make the view looks like this : the mask is a small circle in the middle of the view . but I get a converse result , only the middle of the view is not masked. the wrong result like this
my code is :
aView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 44, 44)];
[aView.layer setBackgroundColor:[[UIColor blackColor] CGColor]];
CAShapeLayer *mask = [[CAShapeLayer alloc] init];
mask.frame = aView.bounds;
CGMutablePathRef p2 = CGPathCreateMutable();
CGPathAddEllipseInRect(p2, NULL, CGRectInset(mask.bounds, 10, 10));
mask.path = p2;
aView.layer.mask = mask;
CGPathRelease(p2);
[self addSubview:aView];
what is wrong with the code ? thanks.
First, add a rectangle to the masking path.
Second, set the fillRule property of shape layer to kCAFillRuleEvenOdd, so that the center part is left hollowed.
aView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 44, 44)];
[aView.layer setBackgroundColor:[[UIColor blackColor] CGColor]];
CAShapeLayer *mask = [[CAShapeLayer alloc] init];
mask.fillRule = kCAFillRuleEvenOdd;
mask.frame = aView.bounds;
CGMutablePathRef p2 = CGPathCreateMutable();
CGPathAddRect(p2, &CGAffineTransformIdentity, mask.bounds);
CGPathCloseSubpath(p2);
CGPathAddEllipseInRect(p2, NULL, CGRectInset(mask.bounds, 10, 10));
mask.path = p2;
aView.layer.mask = mask;
CGPathRelease(p2);
I have a tableview with only a few rows. So instead of displaying a bunch of blanks I added a blank UIView to the tableview.footer. However I would like the last cell to cast a dropshadow on the UIView. How would I achieve this? Here is my current code.
- (void)viewDidLoad
{
[super viewDidLoad];
UIView *emptyView = [[UIView alloc] initWithFrame:CGRectZero];
CALayer *layer = [emptyView layer];
[layer setShadowOffset:CGSizeMake(0, 1)];
[layer setShadowColor:[[UIColor darkGrayColor] CGColor]];
[layer setShadowRadius:8.0];
[layer setShadowOpacity:0.8];
self.tableView.tableFooterView = emptyView;
}
EDIT:
It is adding the UIView to the footer but not creating the dropshadow. I'm not sure the layer is the best approach for this or even correct for this type of thing.
It is probably because you set the frame to CGRectZero.
The zero rectangle is equivalent to CGRectMake(0,0,0,0).
A shadow of a zero rect (x=0, y=0, width=0, height=0) won't show at all.
Try giving it a proper frame size and you will see the difference.
Check out this for ref as well: https://developer.apple.com/library/mac/#documentation/graphicsimaging/reference/CGGeometry/Reference/reference.html
I ended up using
shadowBackgroundView.layer.shadowOpacity = 0.3;
shadowBackgroundView.layer.shadowRadius = 2;
shadowBackgroundView.layer.shadowColor = [[UIColor blackColor] CGColor];
shadowBackgroundView.layer.shadowOffset = CGSizeMake(0.0, 1.0);
CGPathRef shadowPath = [UIBezierPath bezierPathWithRoundedRect: shadowBackgroundView.bounds
byRoundingCorners: UIRectCornerAllCorners
cornerRadii: CGSizeMake(PageCellBackgroundRadius, PageCellBackgroundRadius)].CGPath;
shadowBackgroundView.layer.shadowPath = shadowPath;
shadowBackgroundView.layer.shouldRasterize = YES;
[self addSubview: shadowBackgroundView];
In cellForRowAtIndexPath: function:
// drop shadow
cell.layer.shadowOpacity = 1.0;
cell.layer.shadowRadius = 1.7;
cell.layer.shadowColor = [UIColor blackColor].CGColor;
cell.layer.shadowOffset = CGSizeMake(0.0, 0.0);