I have an animated CALayer which is dropping a shadow. That is what I intended to do but I am looking for way to have a solid shadow without blur. Changing the blur radius does not save my problem.
Any ideas?
Many thanks.
myLayer.shadowRadius = 3;
//shadowBlurRadius
myLayer.shadowColor = [[UIColor greenColor] CGColor];
//intended is to get a green solid shadow without blur
If you want no blurring, you can:
myLayer.shadowColor = [[UIColor greenColor] CGColor];
myLayer.shadowOffset = CGSizeMake(5.0, 5.0);
myLayer.shadowOpacity = 1.0;
myLayer.shadowRadius = 0.0;
The shadowRadius dictates the amount of blur. shadowOffset dictates where the shadow goes.
Related
I need to set the length size of a UIButton border. I tried using this
[[jb layer] setBorderLength:2.2f];
but got a error saying "setBorderLength is not a method".
Here's my code for my UIButton border:
[[jb layer] setBorderWidth:2.2f];
[[jb layer] setBorderColor:[UIColor blackColor].CGColor];
setting a layer border parameters :
jb.layer.borderColor = [UIColor blackColor].CGColor;
jb.layer.borderWidth = 1;
jb.layer.cornerRadius = jb.bounds.size.width * 0.1;
There is no border length. The border width determines how thick your border is.
The border is around your frame. If you mean your border to be appear wider around your button consider changing the frame.
You would have to create layers and add it to the button to handle this scenario
CALayer * layer = [CALayer layer];
layer.bounds = CGRectMake(0, 0, buttonWidth, 1.0);
layer.backgroundColor = [UIColor blackColor].CGColor;
layer.opacity = 0.1f;
[self.button.layer addSublayer:layer];
This will add border on only the top border of button.
Change the frame and add 3 more layers to cover left right and bottom
I need some help to get this thing working..
Basically on button click, I have to add a line of fixed width with circle end points on the ImageView. User can add upto 5 lines. If I click on any circle (red dot) end point of line, it should allow to resize the line. Point can be dragged to any position on screen and line has to be straight. At the end, i should be able to calculate the length of each line. I just spent a lot of time on this and referring other similar answers. But so far, no luck.. Any reference code or links is greatly appreciated.
Thanks!
WOW, where to even start. OK, first of all, you should not be doing your drawing in the "viewDidLoad" method of your ViewController. You should make a subclass of UIView (let's call it DrawView) and do all your drawing within the "drawRect" method. And within DrawView, you can then intercept touches.
So to get a little more precise:
create subclass of UIView called DrawView
Move your drawing into the drawRect method
Within DrawView, over-ride the various "touchesXXXX" methods (of UIResponder) to detect and respond to touches and figure out what shape has been touched
Within the storyboard, drag a UIView object onto your ViewController and make sure it's class is set to "DrawView".
This is for starters. Haven't even talked about how to record/store your various points and shapes.
To Draw line on image view the following code work for me even in view did load.
first int image view
second write following code
//line 1
CAShapeLayer *shapeLayerOne = [CAShapeLayer layer];
shapeLayerOne.path = [LineOne CGPath];
shapeLayerOne.strokeColor = [[UIColor blueColor] CGColor];
shapeLayerOne.lineWidth = 1.0;
shapeLayerOne.fillColor = [[UIColor clearColor] CGColor];
//line 2
CAShapeLayer *shapeLayerTwo = [CAShapeLayer layer];
shapeLayerTwo.path = [LineTwo CGPath];
shapeLayerTwo.strokeColor = [[UIColor blueColor] CGColor];
shapeLayerTwo.lineWidth = 1.0;
shapeLayerTwo.fillColor = [[UIColor clearColor] CGColor];
//line 3
CAShapeLayer *shapeLayerThree = [CAShapeLayer layer];
shapeLayerThree.path = [LineThree CGPath];
shapeLayerThree.strokeColor = [[UIColor blueColor] CGColor];
shapeLayerThree.lineWidth = 1.0;
shapeLayerThree.fillColor = [[UIColor clearColor] CGColor];
//line 4
CAShapeLayer *shapeLayerFour = [CAShapeLayer layer];
shapeLayerFour.path = [LineFour CGPath];
shapeLayerFour.strokeColor = [[UIColor blueColor] CGColor];
shapeLayerFour.lineWidth = 1.0;
shapeLayerFour.fillColor = [[UIColor clearColor] CGColor];
[self.view.layer addSublayer:shapeLayerOne];
[self.view.layer addSublayer:shapeLayerTwo];
[self.view.layer addSublayer:shapeLayerThree];
[self.view.layer addSublayer:shapeLayerFour];
your output is blue line
I am currently using CAShapeLayer for one of my requirement. I was successful in implementing the fillcolor, strokecolor, etc... but I wanted to change the color of outer part of that CAShapeLayer. I tried doing it with backgroundcolor, & followed many answers from SO, but was unable to do it. Could anyone guide me with the solution. Screenshot attached
Edit 1: Code for creating the layer
// create layer mask for map
CAShapeLayer *maskLayer = [CAShapeLayer layer];
mapView.layer.mask = maskLayer;
// maskLayer.backgroundColor = [[UIColor colorWithRed:0.0 green:0.0 blue:0.0 alpha:0.7] CGColor];
self.maskLayer = maskLayer;
// create shape layer for circle we'll draw on top of map (the boundary of the circle)
CAShapeLayer *circleLayer = [CAShapeLayer layer];
circleLayer.lineWidth = 3.0;
circleLayer.fillColor = [[UIColor clearColor] CGColor];
circleLayer.strokeColor = [[UIColor blackColor] CGColor];
// circleLayer.borderColor = [[UIColor blackColor] CGColor];
// circleLayer.backgroundColor = [[UIColor colorWithRed:0.0 green:0.0 blue:0.0 alpha:0.7] CGColor];
[mapView.layer addSublayer:circleLayer];
self.circleLayer = circleLayer;
Edit 2: Xcode's Viewer's Debugger
In the above image I can see that I have set the background color to self.view. But I want it to be over my map view & the the color should be semi transparent so that map data outside circle should also be visible.
Have you tried using XCode views's debugger to know where this white background belongs in your view hierarchy ?
You're using your view's maskLayer as a circle. So my guess is that this white background must be OUTSIDE your view - everything out your mask gets clipped - so you should probably try to change your viewController's view backgroundColor (or any other view that is just above your custom rounded view)
[self.view.layer setBackgroundColor:[UIColor grayColor].CGColor];
UIBezierPath *circle = [UIBezierPath bezierPathWithArcCenter:self.view.center
radius:45.0
startAngle:0
endAngle:2.0*M_PI
clockwise:YES];
CAShapeLayer *circleLayer = [CAShapeLayer layer];
circleLayer.bounds = CGRectMake(0, 0, 2.0*(45.0), 2.0*(45.0));
circleLayer.path = circle.CGPath;
circleLayer.strokeColor = [UIColor orangeColor].CGColor;
circleLayer.fillColor = [UIColor whiteColor].CGColor;
circleLayer.lineWidth = 3.0; // your line width
[self.view.layer addSublayer:circleLayer];
See if it helps you.
I want to achieve the text appearance like in the pictures below:
Now I'm working on shadow around the letters and I can't figure out how to do that.
What I've tried so far:
- The solution with:
label.shadowColor = [UIColor blackColor];
label.shadowOffset = CGSizeMake(1, 2);
gives a nice sharp shadow, but it doesn't fit my needs by two reasons:
It gives a shadow only from one side, set up by shadowOffset, whereas I need a "wrapping" shadow;
This solution doesn't give the soft part of the shadow (gradient) as there is in the pictures;
-The solution with:
label.layer.shadowOffset = CGSizeMake(0, 0);
label.layer.shadowRadius = 5.0;
label.layer.shouldRasterize = YES;
label.layer.shadowOpacity = 1;
label.layer.shadowColor = [UIColor blackColor].CGColor;
label.layer.masksToBounds = NO;
Works great, but it gives too soft shadow even though the shadowOpacity is set to 1 and the shadowColor is set to black:
Obviously it's not enough and I already think about drawing in labels' context. But it is not clear to me how would I achieve the goal even through context drawing.
Any idea would be much appreciated.
Try this
Create a Custom UILabel SubClass and Override the following method
- (void)drawTextInRect:(CGRect)rect {
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSaveGState(context);
CGContextSetShadow(context, CGSizeMake(0.0, 0.0), 10);
CGContextSetShadowWithColor(context, CGSizeMake(0.0, 0.0), 10, [UIColor blackColor].CGColor);
[super drawTextInRect:rect];
CGContextRestoreGState(context);
}
and this bottomColorLayer to the Label
CALayer *bottomColorLayer = [CALayer layer];
bottomColorLayer.frame = CGRectMake(0, labelRect.size.height/2, labelRect.size.width, labelRect.size.height/2);
bottomColorLayer.backgroundColor = [[UIColor colorWithWhite:0 alpha:.5] CGColor];
[label.layer insertSublayer:bottomColorLayer above:(CALayer *)label.layer];
or If you want Gradient
CAGradientLayer *bottomGradient = [CAGradientLayer layer];
bottomGradient.frame = CGRectMake(0, labelRect.size.height/2, labelRect.size.width, labelRect.size.height/2);
bottomGradient.cornerRadius = 0.0f;
bottomGradient.colors = #[(id)[[UIColor colorWithWhite:1 alpha:.5] CGColor], (id)[[UIColor colorWithWhite:0 alpha:.5] CGColor]];
[label.layer insertSublayer:bottomGradient above:(CALayer *)label.layer];
Use an explicit shadow path that's the shape you want. It sounds like you want a shadow the same shape as your text, but larger, with each shadow-letter centered on its corresponding letter. Once you have that, use the shadow radius to soften the edges of the shadow to whatever degree you want.
The code you have relies on the shadow radius alone to make the shadow larger than the text, which removes your ability to control the softness.
Try with the code below :-
[_testLable setText:#"TION ERRO"];
[_testLable setTextColor:[UIColor whiteColor]];
[_testLable setFont:[UIFont boldSystemFontOfSize:22] ];
_testLable.layer.shadowOffset = CGSizeMake(0, 0);
_testLable.layer.shadowRadius = 10.0;
_testLable.layer.shouldRasterize = YES;
_testLable.layer.shadowOpacity = 1;
_testLable.layer.shadowColor = [UIColor blackColor].CGColor;
_testLable.layer.masksToBounds = NO;
CGPathRef shadowPath = CGPathCreateWithRect(_testLable.bounds, NULL);
_testLable.layer.shadowPath = shadowPath;
CGPathRelease(shadowPath);
Its output is like this:-
I have a UIView. I need to make only it's top left and top right corners rounded and also to have a 1 point border width.
Any idea?
Thanks
Try this:
#import <QuartzCore/QuartzCore.h>
view.layer.cornerRadius = 8.0;
view.layer.borderWidth = 1.0;
view.layer.borderColor = [UIColor blueColor].CGColor;
however, it'll make all of your corners rounded. If you don't want this, there are two options:
Draw the rounded corner yourself using CoreGraphics (How to draw a rounded rectangle in Core Graphics / Quartz 2D?) or
Use a mask (CALayer's #property mask here: http://developer.apple.com/library/ios/#DOCUMENTATION/GraphicsImaging/Reference/CALayer_class/Introduction/Introduction.html)
UIView With top left,right rounded corners and shadow
#import <QuartzCore/QuartzCore.h>
backView.layer.shadowColor=[UIColor blackColor].CGColor;
backView.layer.masksToBounds = NO;
backView.layer.shadowOffset = CGSizeMake(0.0f, 1.0f);
backView.layer.shadowRadius = 3;
backView.layer.shadowOpacity = 0.8;
CGFloat radius = 20.0;
CGRect maskFrame = self.backView.bounds;
maskFrame.size.height += radius;
CALayer *maskLayer1 = [CALayer layer];
maskLayer1.cornerRadius = radius;
maskLayer1.backgroundColor = [UIColor blackColor].CGColor;
maskLayer1.frame = maskFrame;
self.backView.layer.mask = maskLayer1;
you can achieve this using beizer path like this -
UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:self.bounds byRoundingCorners:UIRectCornerTopLeft | UIRectCornerTopRight cornerRadii:CGSizeMake(5.0, 5.0)];
[maskPath setLineWidth:1.0];
//to give stroke color
[[UIColor colorWithRed:186.0/255.0 green:186.0/255.0 blue:186.0/255.0 alpha:1.0] setStroke];
//to color your border
[[UIColor colorWithRed:242.0/255.0 green:240.0/255.0 blue:240.0/255.0 alpha:1.0] setFill];
[maskPath fill];
[maskPath stroke];
Use CALayer's and try this tutorial more more information. http://nachbaur.com/blog/rendering-views-using-calayer-part-1
A very simple and quick solution:
set the corner radius so that it draws all four corners rounded in the normal way
for each corner that you don't want rounded:
create a small square UIView with side equal to the corner radius
add it as subview of the main view (the one with the rounded corners)
position it so that it sits exactly over the corner
set its background color to be the same as the main view's background
Not necessarily the most elegant solution, but only takes a minute to code it up!