I have a UIImageView and this is my code to show image :
callRecImage = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"call_accept.png"]];
[callRecImage setFrame:CGRectMake(133,top, 36, 40)];
[self.view addSubview: callRecImage];
To add circle around image I did this :
callRecImage.layer.cornerRadius = callRecImage.frame.size.width /2; callRecImage.layer.borderWidth = 2.0f;
callRecImage.layer.borderColor = [UIColor grayColor].CGColor; callRecImage.clipsToBounds = YES;
my image view is :
my output is :
I want to add a circle to my UIImageView, I have followed this link image in circle frame iOS but it's working as I expected
I want a big circle around the phone image. any kind of help will be appreciated.
Thanks in advance
[callRecImage setFrame:CGRectMake(133,top, 36, 40)];
//Set Height and width equal
//Like
[callRecImage setFrame:CGRectMake(133,top, 40, 40)];
use the following code
#import <QuartzCore/QuartzCore.h>
callRecImage.layer.masksToBounds = YES;
callRecImage.layer.cornerRadius = callRecImage.bounds.size.width/2;
callRecImage.layer.borderWidth = 2.0f;
callRecImage.layer.borderColor = [UIColor grayColor].CGColor;
Add the below line to fill you image in ImageView only
callRecImage.contentMode = UIViewContentModeScaleAspectFill;
Try this code
callRecImage.layer.backgroundColor=[[UIColor clearColor] CGColor];
callRecImage.layer.cornerRadius=20;
callRecImage.layer.borderWidth=2.0;
callRecImage.layer.masksToBounds = YES;
callRecImage.layer.borderColor=[[UIColor grayColor] CGColor]
Whenever you go for layer.cornerRadius for the same view then circle will be always smaller then the view rectangle so use one of these two solution.
I have tested and both the solutions are in working condition
Use following code to change UIViewContentMode of your image and increase your UIImageView frame size (height and width, both should be in equal)
callRecImage.contentMode = UIViewContentModeCenter;
So that if you increase the UIImageView frame size, It will keep your image in center and won't stretch your image inside UIImageView
UIImageView *callRecImage = [[UIImageView alloc] initWithFrame:CGRectMake(133, top, 60, 60)];
callRecImage.contentMode = UIViewContentModeCenter;
[callRecImage setImage:[UIImage imageNamed:#"call_accept.png"]];
callRecImage.layer.cornerRadius = callRecImage.frame.size.width /2;
callRecImage.layer.borderWidth = 2.0f;
callRecImage.layer.borderColor = [UIColor grayColor].CGColor;
callRecImage.clipsToBounds = YES;
[self.view addSubview: callRecImage];
or
Add one UIView as superview of your UIImageView and add layer.cornerRadius to that UIView
UIView *view = [[UIView alloc] initWithFrame:CGRectMake(133, top, 60, 60)];
UIImageView *callRecImage = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"call_accept.png"]];
[callRecImage setFrame:CGRectMake(view.frame.size.width/2 - 36/2, view.frame.size.height/2 - 40/2, 36, 40)];
view.layer.cornerRadius = view.frame.size.width /2;
view.layer.borderWidth = 2.0f;
view.layer.borderColor = [UIColor grayColor].CGColor;
view.clipsToBounds = YES;
[view addSubview: callRecImage];
[self.view addSubview: view];
Related
I am trying to add an image on navigation bar but the dimensions are wrong.
UIImageView* menuButton=[[UIImageView alloc]initWithFrame:CGRectMake(4, 7, 20, 20)];
menuButton.image=[UIImage imageNamed: Model.icon.MapList];
UIBarButtonItem *accountBarItem = [[UIBarButtonItem alloc] initWithCustomView:menuButton];
self.navigationItem.leftBarButtonItem = accountBarItem;
It seams that I don't have any control on the dimensions of the image, because when I change the values of initWithFrame nothing changes.
Also this problem appears only on iPhones greater than iPhone 5 model.
What am I missing?
You can just use simple button and set image for it.
UIButton *b = [UIButton buttonWithType:UIButtonTypeCustom];
[b setFrame:CGRectMake(0.0f, 0.0f, 25.0f, 25.0f)];
[b addTarget:self action:#selector(randomMsg) forControlEvents:UIControlEventTouchUpInside];
[b setImage:[UIImage imageNamed: Model.icon.MapList] forState:UIControlStateNormal];
UIBarButtonItem *item = [[UIBarButtonItem alloc] initWithCustomView:b];
self.navigationItem.leftBarButtonItem = item;
If you have wrong aspect ratio , you can use
[[b imageView] setContentMode: UIViewContentModeScaleAspectFit];
I'd recommend adding a border to your image view so you can see what's going on.
Here's what you're currently experiencing (using the imageView directly as the custom view of the bar button item):
- (void)_addImageViewToLeftButtonItemWithoutOuterView {
UIImageView *profileImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"Homer.jpg"]];
[profileImageView setFrame:CGRectMake(0, 0, 40, 40)];
profileImageView.layer.cornerRadius = 20.0f;
profileImageView.layer.masksToBounds = YES;
profileImageView.clipsToBounds = YES;
profileImageView.layer.borderColor = [UIColor blackColor].CGColor;
profileImageView.layer.borderWidth = 1.0f;
UIBarButtonItem *rbi = [[UIBarButtonItem alloc] initWithCustomView:profileImageView];
self.navigationItem.leftBarButtonItem = rbi;
}
This is what it looks like without aspect fit:
And with aspect fit set:
And this is what I believe you want:
- (void)_addImageViewToLeftButtonItemWithOuterView {
UIView *profileView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 40, 40)];
profileView.layer.borderColor = [[UIColor redColor] CGColor];
profileView.layer.borderWidth = 2.0f;
UIImageView *profileImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"Homer.jpg"]];
profileImageView.contentMode = UIViewContentModeScaleAspectFit;
[profileImageView setFrame:CGRectMake(0, 0, 40, 40)];
profileImageView.layer.cornerRadius = 20.0f;
profileImageView.layer.masksToBounds = YES;
profileImageView.clipsToBounds = YES;
profileImageView.layer.borderColor = [UIColor blackColor].CGColor;
profileImageView.layer.borderWidth = 1.0f;
[profileView addSubview:profileImageView];
UIBarButtonItem *lbi = [[UIBarButtonItem alloc] initWithCustomView:profileView];
self.navigationItem.leftBarButtonItem = lbi;
}
Which results in this:
As you probably noticed, the sorta trick here is that you don't want to add the image view directly as the custom view within initWithCustomView of the UIBarButtonItem. Instead you want to use an outer view to hold the imageView, then you can adjust the frame of your subview to move it around.
Here's one more example if you wanted the image further to the right (obviously you won't want the border for the outer image view, but I've just left it there for demonstration purposes):
- (void)_addImageViewToLeftButtonItemWithOuterView {
// adjust this to 80 width (it always starts at the origin of the bar button item
UIView *profileView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 80, 40)];
profileView.layer.borderColor = [[UIColor redColor] CGColor];
profileView.layer.borderWidth = 2.0f;
UIImageView *profileImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"Homer.jpg"]];
profileImageView.contentMode = UIViewContentModeScaleAspectFit;
// and adjust this to be offset by 40 (move it to the right some)
[profileImageView setFrame:CGRectMake(40, 0, 40, 40)];
profileImageView.layer.cornerRadius = 20.0f;
profileImageView.layer.masksToBounds = YES;
profileImageView.clipsToBounds = YES;
profileImageView.layer.borderColor = [UIColor blackColor].CGColor;
profileImageView.layer.borderWidth = 1.0f;
[profileView addSubview:profileImageView];
UIBarButtonItem *lbi = [[UIBarButtonItem alloc] initWithCustomView:profileView];
self.navigationItem.leftBarButtonItem = lbi;
}
I need a border to my textfield like the following image.how can i do that?
try these..
i hope it helps...
UITextField *txt=[[UITextField alloc]initWithFrame:CGRectMake(10, 100, 150, 30)];
[txt setBackgroundColor:[UIColor clearColor]];
[txt setPlaceholder:#"Hello my friend"];
[self.view addSubview:txt];
CALayer *border = [CALayer layer];
CGFloat borderWidth = 2;
border.borderColor = [UIColor redColor].CGColor;
border.frame = CGRectMake(0, -2, txt.frame.size.width, txt.frame.size.height);
border.borderWidth = borderWidth;
[txt.layer addSublayer:border];
txt.layer.masksToBounds = YES;
I found the answer my own.
just pass the textfield name to the following function
-(void)setBorderView:(UITextField*)textField
{
UIView *borderView = [[UIView alloc]init];
borderView.backgroundColor = [UIColor clearColor];
CGRect frameRectEmail=textField.frame;
NSLogVariable(textField);
borderView.layer.borderWidth=1;
borderView.layer.borderColor=[customColor colorWithHexString:#"8c8b90"].CGColor;
borderView.layer.cornerRadius=5;
borderView.layer.masksToBounds=YES;
UIView *topBorder = [[UIView alloc]init];
topBorder.backgroundColor = [customColor colorWithHexString:#"1e1a36"];
CGRect frameRect=textField.frame;
frameRect.size.height=CGRectGetHeight(textField.frame)/1.5;
topBorder.frame = frameRect;
frameRectEmail.size.width=frameRect.size.width;
[borderView setFrame:frameRectEmail];
[_textFieldBackGroundView addSubview:borderView];
[_textFieldBackGroundView addSubview:topBorder];
[_textFieldBackGroundView addSubview:textField];
}
I am creating a view below the textfield and setting the border to this view.Now i am creating another view with the same baground color and masking the top portion od the borderView.It is not practical in all situations.But for me,it works great.Thanks.
I'm trying to size an MKMapView in the following way:
Elements should be able to appear behind the arc at the top, so it appears that the view is not square. I know this should be possible with CALayer, but perhaps someone has done it before?
This should be quite possible if you put your MKMapView within a UIView, then apply a mask to that.
Here's a very (!) basic example:
All I've done is put my map in a UIView called "mapContainer" and added a mask to it using this:
-(void)viewDidAppear:(BOOL)animated
{
[super viewDidAppear:animated];
CGRect rect = CGRectInset(self.view.frame, 70, 70);
UIView* newView = [[UIView alloc] initWithFrame:rect];
newView.layer.cornerRadius = 55.0;
newView.backgroundColor = [UIColor redColor];
self.mapContainer.layer.mask = newView.layer;
}
And you could add a border to it...
..with a few more lines...
-(void)viewDidAppear:(BOOL)animated
{
[super viewDidAppear:animated];
CGRect rect = CGRectInset(self.view.frame, 70, 70);
UIView* newView = [[UIView alloc] initWithFrame:rect];
newView.layer.cornerRadius = 55.0;
newView.backgroundColor = [UIColor redColor];
UIView* borderView = [[UIView alloc] initWithFrame:rect];
borderView.backgroundColor = [UIColor clearColor];
borderView.layer.cornerRadius = 55.0;
borderView.layer.borderWidth = 3.0;
borderView.layer.borderColor = [[UIColor redColor] CGColor];
[self.mapContainer addSubview:borderView];
[self.mapContainer bringSubviewToFront:borderView];
self.mapContainer.layer.mask = newView.layer;
}
I hope this points you in the right direction.
Unlike Apple Maps.
;-)
I have a UIView and two subviews in it. The subviews have rounded corners and a border value. The issue I have is that the outer edges of the rounded border contain a thin line of the subview background color. I must be missing something??
UIView *outerView = [[UIView alloc] initWithFrame:CGRectMake(0, 50, 320, 320)];
[self.view addSubview:outerView];
outerView.backgroundColor = [UIColor whiteColor];
UIView *innerView1 = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 160, 320)];
[outerView addSubview:innerView1];
innerView1.backgroundColor = [UIColor blackColor];
innerView1.layer.borderWidth = 20;
innerView1.layer.borderColor = [UIColor whiteColor].CGColor;
innerView1.layer.cornerRadius = 20;
//innerView1.layer.masksToBounds = YES;
UIView *innerView2 = [[UIView alloc] initWithFrame:CGRectMake(160, 0, 160, 320)];
[outerView addSubview:innerView2];
innerView2.backgroundColor = [UIColor blackColor];
innerView2.layer.borderWidth = 20;
innerView2.layer.borderColor = [UIColor whiteColor].CGColor;
innerView2.layer.cornerRadius = 20;
//innerView2.layer.masksToBounds = NO;
//innerView2.clipsToBounds = YES;
//innerView2.layer.shouldRasterize = YES;
To work around the problem, set the background color of the subviews to clearColor and then draw the background color using the drawRect method of a custom view class. Here's the code for the view class.
#interface WorkAroundView : UIView
#end
#implementation WorkAroundView
- (void)drawRect:(CGRect)rect
{
CGFloat margin = self.layer.borderWidth;
CGRect background;
background.origin.x = margin;
background.origin.y = margin;
background.size.width = self.bounds.size.width - 2 * margin;
background.size.height = self.bounds.size.height - 2 * margin;
CGContextRef context = UIGraphicsGetCurrentContext();
[[UIColor blackColor] set];
CGContextFillRect( context, background );
}
#end
And here's how you would use the custom view class. The only real change here from what you posted is that the background color for the subviews is set to clearColor.
UIView *outerView = [[UIView alloc] initWithFrame:CGRectMake(360, 200, 320, 320)];
[self.view addSubview:outerView];
outerView.backgroundColor = [UIColor whiteColor];
WorkAroundView *innerView1 = [[WorkAroundView alloc] initWithFrame:CGRectMake(0, 0, 160, 320)];
innerView1.backgroundColor = [UIColor clearColor];
innerView1.layer.borderWidth = 20;
innerView1.layer.borderColor = [UIColor whiteColor].CGColor;
innerView1.layer.cornerRadius = 20;
[outerView addSubview:innerView1];
WorkAroundView *innerView2 = [[WorkAroundView alloc] initWithFrame:CGRectMake(160, 0, 160, 320)];
innerView2.backgroundColor = [UIColor clearColor];
innerView2.layer.borderWidth = 20;
innerView2.layer.borderColor = [UIColor whiteColor].CGColor;
innerView2.layer.cornerRadius = 20;
[outerView addSubview:innerView2];
add a bezier path around the corner
CAShapeLayer *subLayer = [[CAShapeLayer alloc] init];
[subLayer setFillColor:[UIColor clearColor].CGColor];
[subLayer setStrokeColor:[UIColor whiteColor].CGColor];
[subLayer setLineWidth:1.0];
[subLayer setPath:[UIBezierPath bezierPathWithRoundedRect:imageView.bounds cornerRadius:imageView.layer.cornerRadius].CGPath];
[imageView.layer addSublayer:subLayer];
I want to build a totally transparent view, the backgroundColor maybe clearColor. Inside this view I want to put a small image. And in the four sides of this transparent view, I want to see the effect of shadow. The shadow must be totally outside the view. I know that I must override the drawRect method in UIView, but don't know how to do this.
try this....
UIView *shadowView = [[UIView alloc] initWithFrame:CGRectMake(50.0, 100.0, 100.0, 100.0)];
shadowView.layer.cornerRadius = 15.0;
CALayer *layer = shadowView.layer;
layer.shadowOpacity = 1.0;
layer.shadowColor = [[UIColor blackColor] CGColor];
layer.shadowOffset = CGSizeMake(0,0);
layer.shadowRadius = 15;
[self.view addSubview:shadowView];
UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0.0, 0.0, 50.0, 50.0)];
[imageView setImage:[UIImage imageNamed:#"icon.png"]];
[shadowView addSubview:imageView];
What is the problem with doing something like this?
#import <QuartzCore/QuartzCore.h> // at the top of the file
UIView *transparentView = [[UIView alloc] initWithFrame:CGRectMake(50,50,200,200)];
transparentView.backgroundColor = [UIColor greenColor];
transparentView.alpha = 0.5f;
transparentView.clipsToBounds = NO;
transparentView.layer.shadowColor = [UIColor blackColor].CGColor;
transparentView.layer.shadowOpacity = 1;
transparentView.layer.shadowRadius = 1;
UIImageView *imageView = [[]UIImageView alloc] initWithFrame:CGRectMake(50, 50, 50, 50)];
imageView.image = [UIImage imageNamed:#"IMAGE NAME"];
[transparentView addSubview:imageView];
As you can see, based on your description, no drawRect: required, unless for some reason you want to draw the shadow manually, but there isn't a reason to.