IOS - Adding Image to UIImageView Causes Issues with Image Mode - ios

Recently I have observed some strange behaviour with the UIImageView and am wondering if anyone can provide some insite. I have two UIImageViews with the images inside them being loaded from a database. Inside the Xcode inspector I set the clip subview property and change the image mode to aspect fill. This works fine, when the images are loaded they appear correctly in their views and are clipped as they should be. However, I wanted to add a place holder image incase the user hadn't uploaded one yet. When I did this it the image was not resized and and stretched passed its view. I tried to reset the properties programatically as can be seen below, but nothing changed.
//code used to try to reset the image mode and clipping of the sub-views
//set up user profile picture
_profilePic.contentMode = UIViewContentModeScaleAspectFit;
_profilePic.layer.masksToBounds = YES;
_profilePic.layer.borderColor = [UIColor whiteColor].CGColor;
_profilePic.layer.borderWidth = 3.0f;
//set up users cover photo
_coverPhoto.contentMode = UIViewContentModeScaleAspectFit;
_coverPhoto.clipsToBounds = YES;
_coverPhoto.layer.masksToBounds = YES;
Why is this happening when I add an image to the view through the Xcode inspector but not when the image is left empty?

You should use UIViewContentModeScaleAspectFill instead of UIViewContentModeScaleAspectFit.

When I add them with the following line of code at the beginning of ViewDidLoad I get the same effect and have none of the unwanted image overflow.
_coverPhoto.image = [UIImage imageNamed:#"stockCoverPhoto.png"];
_profilePic.image = [UIImage imageNamed:#"stockProfilePhoto.png"];
Not the most informative solution, as it provides no insight into this issue but it is a solution. Anyone have any other input on how to fix this issue, why it even happens I would love to hear it as im still scratching my head.

Same on here.. No way to change contentMode after setImage to UIImageView..

Related

UITableViewRowAction with image instead of title

I'd like to make a cell swipe action like mail app.
I set UIImage to backgroundColor of row action.
action.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:#"remove"]];
But i get my image repeated side-by-side on the background. like this.
Is the image size problem?
Could tell me how to fix it,or an other way to do it ?
Yes, this is an image size problem.
Even I had a similar requirement and faced the same problem. In this case when you use,
action.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:#"remove"]];
Even if you set the imageView.contentMode to:
UIViewContentModeScaleAspectFit
UIViewContentModeScaleToFill
UIViewContentModeScaleAspectFill
If the size of the image you are using and and the size of the button on the cell do not match, the image will not stretch to fill the entire button, rather the image pattern will just repeat itself until the entire area of the button is utilised.
This is because you are setting the 'backgroundColor' and not the actual 'backgroundImage'. 'backgroundColor' unlike 'backgroundImage' does not adhere to UIContentMode of the button.
Hence, what you will have to do is, create a image which is exactly equal to the size of the button. Doing this is not possible if your cell has a dynamic height (height determined at runtime according to your content).

Make background image fixed

I am working on a swift app right now, that uses a table view to display news. For the background I set an image using the following line of code in the viewDidLoad method.
self.view.backgroundColor = UIColor(patternImage: UIImage(named: "backgroundImage.jpg")!)
however this makes the background repeat itself when scrolling down, which makes it look very ugly (see attached image).
So what I desire is to have a fixed (non-repetitive) background image that always looks the same while scrolling and does not move at all.
How can I achieve that?
Thank you for your help!
So I did some more digging and finally came across this post: https://stackoverflow.com/a/27684597/2204207
There it suggested to use
self.tableView.backgroundView = UIImageView(image: UIImage(named: "backgroundImage.png"))
instead of
self.view.backgroundColor = UIColor(patternImage: UIImage(named: "backgroundImage.png")!)
Therefore, when you want a fixed and non-repetitive background image use .tableView.backgroundView. This fixes the background images even when scrolling down.
You can make a view hierarchy like this.
Make ImageView and TableView as same size and place table view below the ImageView in view navigator.
Then add your background image to the ImageView and make TableView's background to clear color.

Resize edit rect in image picker iOS

Is there any way to change the cropRect size for UIImagePickerController when using:
imagePickerController.allowsEditing = YES;
I want to set my own width and height depending on the image.
I was faced with that issue a while back and at the time there was no way of changing it (I'm pretty sure there still isn't).
I ended up creating my own cropping library. If I'm not mistaken I made use of SSPhotoCropper as a reference.

How to correctly set background for retina?

May be the question is elementary, but I have a bug with setBackgroundColor.
I have the UIView which contain UITableView. UITableView is clearColored. I'm trying to set background on UIView:
[self.viewForTable setBackgroundColor: [UIColor colorWithPatternImage:[UIImage imageNamed:#"bgIngrList.png"]]];
On normal iPad it's looks like:
But on retina iPad (like the second image began showing):
I have two images "bgIngrList.png" and "bgIngrList#2x.png" with 290x260 and 580x520.
Where can be the bug?
EDIT
I have solved the problem by using UIImageView instead of UIView.
Thanks to everybody!!!
colorWithPatternImage: (as the name suggests) thinks your image as pattern to fill. so if the image you give is smaller than the size of the view, its gonna draw the pattern image again rather than stretching it. that is what happening here. your image's size is smaller than view's size hence its drawing the image again at the bottom. You can avoid this by adding a UIImageView and setting the image property rather than setting the backgroundColor of UIView.

iOS app folders

I'm looking for an idea in order to reproduce the look of the iOS app folders (menu on iPhone/iPad).
I'm wondering how is it possible to separate the background image in order to make appear the content of the folder.
Does someone already do this ? Or have an idea on how we can do ?
EDIT : I'm trying to reproduce this effect.
http://img4.hostingpics.net/pics/873912photo.png
I actually looked at this a while back.
This is how i approached the problem:
You have a background view (the image) and a layer on top (the icons).
Calculate the split line.
Split the view and layer into tow along the split line
Add the content of the folder under the image.
Add you folder icon on top of everything.
Animate the bottom part down while changing opacity of the layer icon.( so you can see the content underneath)
While animating you should probably mask the triangle under the icon to it gives that bubble effect.
To close, just reverse the animation.
I didn't manage to make it work 100% but i can tell you it works (at least some parts of it).
And before you ask, no, i cannot give you the code because i didn't keep it.
Try make screenshot like this:
UIGraphicsBeginImageContext(CGSizeMake(screenWidth, screenHeight));
[self.view.layer renderInContext: UIGraphicsGetCurrentContext()];
UIImageView* imageView = [[UIImageView alloc] initWithImage: UIGraphicsGetImageFromCurrentImageContext()];
UIGraphicsEndImageContext();
[self.view addSubview: imageView];
You can make two screenshots and add with different frames as subviews.
I hope it helps you.

Resources