How to Clone A UIImageView - ios

I have a UIImageView and I want to make a copy of it and place it somewhere on the screen. How do I do this?
I currently only know how to copy and paste the image manually and make a separate IBOutlet for each one, but this is very inefficient because I want to make a game that generates obstacles (UIImageViews) forever so I can't do it the manual way.

You want to make sure you match all of the properties up as well, like size, clipping, image aspect, opacity, etc.
CGPoint locationOfCloneImageView = CGPointMake(0, 0);//x and y coordinates of where you want your image. (More specifically, the x and y coordinated of where you want the CENTER of your image to be)
UIImageView *cloneImageView = [[UIImageView alloc] initWithImage:originalImageView.image];
cloneImageView.frame = CGRectMake(0, 0, originalImageView.frame.size.width, originalImageView.frame.size.height);//same size as old image view
cloneImageView.alpha = originalImageView.alpha;//same view opacity
cloneImageView.layer.opacity = originalImageView.layer.opacity;//same layer opacity
cloneImageView.clipsToBounds = originalImageView.clipsToBounds;//same clipping settings
cloneImageView.backgroundColor = originalImageView.backgroundColor;//same BG color
cloneImageView.tintColor = originalImageView.tintColor;//matches tint color.
cloneImageView.contentMode = originalImageView.contentMode;//matches up things like aspectFill and stuff.
cloneImageView.highlighted = originalImageView.highlighted;//matches whether it's highlighted or not
cloneImageView.opaque = originalImageView.opaque;//matches can-be-opaque BOOL
cloneImageView.userInteractionEnabled = originalImageView.userInteractionEnabled;//touches are detected or not
cloneImageView.multipleTouchEnabled = originalImageView.multipleTouchEnabled;//multi-touches are detected or not
cloneImageView.autoresizesSubviews = originalImageView.autoresizesSubviews;//matches whether or not subviews resize upon bounds change of image view.
//cloneImageView.hidden = originalImageView.hidden;//commented out because you probably never need this one haha... But if the first one is hidden, so is this clone (if uncommented)
cloneImageView.layer.zPosition = originalImageView.layer.zPosition+1;//places it above other views in the parent view and above the original image. You can also just use `insertSubview: aboveSubview:` in code below to achieve this.
[originalImageView.superview addSubview:cloneImageView];//adds this image view to the same parent view that the other image view is in.
cloneImageView.center = locationOfCloneImageView;//set at start of code.

You will need to create one new UIImageView with its new frame where you want to place it. set its image property of your existing imageView's image, and after that add it to your view.
UIImageView *newImageView = [[UIImageView alloc] initWithFrame:CGRectMake(0,0,50,50)];
newImageView.image = oldImageView.image;
[self.view addSubView:newImageView]

Related

iOS Mapbox MGLMapView: fit an image to a MGLMapView

I used an UIImage to initialize an MGLImageSource. Then I use the MGLImageSource to initialize a MGLRasterStyleLayer and I add the layer to a MGLMapView. It turned out that the image is too big to fit entirely into the map view. How do I tell MGLMapview to scale an image automatically so that the image fits entirely into the view like the 'scale to fit' in iOS ? thanks !
Here is how I add the image into the map view:
UIImage *radarImage = [UIImage imageNamed:#"radar.png"];
MGLImageSource *source = [[MGLImageSource alloc] initWithIdentifier:#"radar" coordinateQuad:coordinates image:radarImage];
[style addSource:source];
MGLRasterStyleLayer *radarLayer = [[MGLRasterStyleLayer alloc] initWithIdentifier:#"radar-layer" source:source];
[style addLayer: radarLayer];
set a property of mapview called visibleCoordinates; it has two members SW and NE which stands for the top right corner and low left corner of the visible view. That will restrict the size of the image and automatically resize the image.

Make a white label visible on top of bright image view

Basic issue:
I believe the trick is with masking, but I am not able to get a good hold of how this is set.
Basically I have a bright image (set to a uiimageview object), and I have a label at very bottom (which is added on top of the image view) needs a well readable white text on it. Right now, the white text is hard to read (because of the bright background).
What I am doing:
I am setting a mask for the image view with something like
http://cl.ly/image/0i0N1p271d42
maskContainer = [CALayer layer];
UIImage *maskImg = [UIImage imageNamed:#"mask_profile"];
[maskContainer setContents:(id)[maskImg CGImage]];
CGRect frma = maskContainer.frame;
frma.size.width = self.frame.size.width;
frma.size.height = self.frame.size.height;
maskContainer.frame = frma;
[self.imageView.layer setMask:maskContainer];
Its messed up. The overall image starts fading on top.
Can anyone share their insight on the right way to mask?
You could set a drop shadow on your text to make is stand out even over a white background:
myLabel.layer.shadowOpacity = 0.8f;
myLabel.layer.shadowOffset = CGSizeMake(0, 0);
Easiest option is to adjust the alpha on the UILabel to the desired darkness in order to make the text stand out. If you do not want to hide the image and the image itself serves as a dark background, then set the alpha on the label to 0.
The best way to do this is to place the label in a uiview then create a gradient to apply as the background to the uiview. You can create the gradient as either an image with transparency or you can draw it in code. This will create a darkening effect on you bright image just behind the label so the text will pop.

iOS: understanding frame and views

I am working programmatically an application for iOS based on a ViewController. I am trying to do so programmatically as I want to understand the underlying concepts.
I have created a subclass of UIImageView and initialized this using an image. In the initialization method I added also a second UIImageView as I would like to handle the two differently but be part of the same object. Ultimately I would like to be able to scale the object (and hence the 2 UIImages) according to the device screen resolution (e.g. if resolution is low then I will scale the two images by 50%). I want to do this because I would like to be able to implement a zoom in and zoom out feature as well as supporting multiple resolutions and screen layouts.
Additional information:
The two images have different size (500x500 pixels) and (350x350
pixels).
My questions are:
how do I position the second image exactly in the center of the first? (I used the center property of the main UIImage but I think I got it wrong.. I thought that the center was the exact center of the square but either I am using it incorrectly or there is something I am missing)
are there any negative side effects for using this approach (UIView subclass class containing an additional UIView?) (E.g. Is it going to create confusion when applying transformation algorithms? Does it reduce the randering speed? Or more simply is it a bad design pattern?)
I find it difficult to understand the positioning of the second image. See code snipped below, this is what I use:
CGRect innerButtonFrame = CGRectMake(self.center.x/2, self.center.y/2,innerButtonSelectedImage.size.width,innerButtonSelectedImage.size.height);
Taken from:
-(id) initWithImage:(UIImage *)image
{
if(self = [super initWithImage:image]){
//
self.userInteractionEnabled = true;
// Initialize gesture recognizers
UITapGestureRecognizer *tapInView = [[UITapGestureRecognizer alloc] initWithTarget:self action:#selector(tapInImageView:)];
[self addGestureRecognizer:tapInView];
UILongPressGestureRecognizer *longPress = [[UILongPressGestureRecognizer alloc] initWithTarget:self action:#selector(longPressInView:)];
[self addGestureRecognizer:longPress];
// Initialize labels
..
// Inner circle image
innerButtonView = [[UIImageView alloc] init];
innerButtonSelectedImage = [UIImage imageNamed:#"inner circle.png"];
CGRect innerButtonFrame = CGRectMake(self.center.x/2, self.center.y/2,innerButtonSelectedImage.size.width,innerButtonSelectedImage.size.height);
innerButtonView.frame = innerButtonFrame;
[innerButtonView setImage:innerButtonSelectedImage];
// Add additional ui components to view
[self addSubview:innerButtonView];
..
[self addSubview:descriptionLabel];
}
return self;
}
EDIT: This is how it looks like if I change the positioning code to the following:
CGRect innerButtonFrame = CGRectMake(0, 0,innerButtonSelectedImage.size.width,innerButtonSelectedImage.size.height);
innerButtonView.frame = innerButtonFrame;
I also don't understand why the image is bigger than the screen.. as the blue one should be 500x500 pixel wide and the screen of the iPhone 6 should be 1334 x 750.
How about:
CGRect innerButtonFrame = CGRectMake(0, 0, innerButtonSelectedImage.size.width,innerButtonSelectedImage.size.height);
innerButtonFrame.center = self.center;
If you need 500*500 circle then add the circle half means Replace 500*500 with 250*250 . And small circle replace 350*350 with 175*175 And solve your problem.
I hope your problem will solve..Enjoy
Thanks..

Instantiate an image to appear at several different points on the screen?

I have an image called Empty.png, it is a small-ish square tile, how could I instantiate the image to appear at several different points on the screen?
Thank you for any help in advance :)
You can can place UIImageView's wherever you want the image to appear.And then set the image property of each image view as this image. (UIImage object).
If you are using interface builder then you just have to type in the name of the file in the attributes inspector of the imageview in the interface builder.
Or you could do this:
UIImage *img = [UIImage imageName:#"Empty.png"];
imageView.image = img; //Assuming this is your utlet to the image view.
It depends on how you want to use it.
If you just draw it with core graphics, let's say in drawInRect: or so, then you simply draw it several times.
If you want to display it within one or a number of image views, then instanciate your UIImageViews and assign the same object to all of them. Or let the Interface Builder do the instanciation for you. But you cannot add a single UIView object several times to one or a number of subview-hierarchies. If you add a UIView as subview to a view then it will disappear from the position where it was before.
10 UIImageView may use the same UIView but you need 10 UIImageViews to display all of them.
The same applies to UIButtons and every UI-thing that has an image or background image.
this will get you one image into some view
CGPoint position = CGPointMake(x,y);
UIImageView *img = [[UIImageView alloc] init];
img.image = [UIImage imageNamed:#"Empty.png"];
img.frame = CGRectMake(position.x, position.y, img.image.size.width, img.image.size.height);
[someUIView addSubview:img];
if you make an array for the positions (x,y) of all the images, then you can just run it in a for loop and it will place the images into the view at the positions you want
note: CGPoints cant be stored in an NSArray since its not an NSObject type, either use a C/C++ array or use something else that can fit into a NSArray

UIView subview placement

I have a UIView that I am placing UIImageView's into, with each UIImageView being 16 pixels wide.
The query is if I add say 5 of the UIImageViews using addSubView, and the UIView is spec'd at 16 tall by 300 wide, is there any way to have the images in the view 'stack up' so to speak, so that the images are not on top of each other? Like adding image tags to a web page.
The easiest way I see of doing this is to keep a running tally of where you last placed an image, then increment by width, something like this:
-(void) addImage:(UIImage*)img toView:(UIView*)view
{
static CGRect curFrame = CGRectMake (0,0,16,16);
UIImageView* imgView = [[UIImageView alloc] initWithFrame:curFrame];
imgView.image = img;
[view addSubview:imgView];
curFrame.origin.x += 16;
}
This will have the images appear within your view from left to right
I think I understand your question correctly. You want all the images to line up in a row correct? You would need to set the frame of the UIImageView's view. The orgin will be where the top left of your image is(x,y coordinates inside the UIView that contains it) - so you would move that over 16 each time you add another image.

Resources