UIImageView ignores UIViewContentModeScaleToFill - iphone

I have a UIImageView that I dynamically load with an Image using
myTableViewCell.myImageView.image = [UIImage imageNamed:myImageFileName];
myImageView is a UIImageView added to a myTableViewCell.nib and declared as IBOutlet. In IB I set the properties to set the content mode to "ScaleToFill".
The images are larger than the UIImageView and I want to auto-scale them down to the size of the view.
Strangely and whatever I try, this doesn't seem to work (XCode version is 3.2.3).
One Oberservation is that the myTableViewCell.myImageView seems to take it's size from the top cell in the tableview, since the cells below are displayed in equal size to the first cell, even though the image sizes are different.
Note that I use the same myTableViewCell in another tableView with different Icons and there it works. I can't spot the difference between the 2 except the jpg files have different dimensions and aspect ratios ...
Is it possible that the TableView-class has something to do with it?
Are the image properties that prevent the image from resizing?

I found th reason for this. In IB the 'Autosizing' parameters were set to strech the image according to the display size.
Changing these parameters to keep the image at constant size resolve the problem.

Related

Set size of UIImageView

I have a very simple question,
I am working in the storyboard and is dragging a uiimageview into the viewcontroller. I configure the imageview to be square (like 100*100). I now set the image to something that has another aspect ratio (like 100*150). When I build the app I expect the imageView to be square (100*100) as i have set in the constraints, but instead it shows the imageView with the image size. So in other words, what I am asking is: How can I set the imageView to the exact size I want so it overwrites the image size? Hope this makes sense, else I can try to explain it a bit better.
Did you set imageView.clipsToBounds = true :)

How do I blur (ios7 style) a section of an image in a UITableViewCell?

I've got a UIImageView that takes up the whole cell and shows an image. I'd like to blur the bottom third of the view in the iOS7 style (we're targeting iOS7). There will be a label over the blurred part.
The issue seems to be that I can't "screenshot" the UIImageView right as I am setting up the cell in tableView:cellForRowAtIndexPath: as it hasn't loaded yet. Although i've even tried setting up a timer for a 0.1 second delay and that also doesn't work.
I've tried the stuff on http://damir.me/posts/ios7-blurring-techniques
I've tried https://github.com/justinmfischer/7blur
I'd like to use the new screenshotting API drawViewHierarchyInRect:afterScreenUpdates:
I'd also like to use apple's sample code UIImage+ImageEffects
The only thing that has worked so far has been to just put a UIToolbar in but the performance is really slow. I don't need dynamic updates.
I've managed to get the following effect a few times but it has just tinted the view and hasn't actually blurred anything so I'm a bit confused.
Use UIImageEffects sample from apple
Make a Image View with a size of the lower portion you want to blur... and then set its image to a blurred one. also set its content mode to UIViewContentModeBottom for the proper clipping
Since your image isnt the size of the cell.. first get a temp image as it is being displayed in the cell by drawing a UIImage from it.. refer for the code here
How to capture UIView to UIImage without loss of quality on retina display
then blur that image
Load this image into a UIImage, blur the image, clip to fit the area that you want. Use UIImage+blur.h

UIImageView in my UITableViewCell changes size on click

I have a fairly vanilla UITableView in my app used to display an image and text in the default/standard way. The first time a UITableViewCell is requested I return it with a placeholder image and start an asynchronous download of the real image. When the download is complete I replace the placeholder image.
If a download fails, the placeholder image remains. Clicking on such a row acts normally. If the download is successful, clicking on a row with the intended image leads to the UIImageView expanding to the height of the row (and the width increases at scale). The UIImageView never returns to normal size. Crude attempts to set the frame of the UIImageView do not alleviate the issue of mysterious resizing.
// from my - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath; method
// after boilerplate cell dequeuing code
cell.textLabel.text = [selectedNoun title];
// add placeholder image
UIImage *placeholderImage = [UIImage imageNamed:#"placeholder.png"];
cell.imageView.image = placeholderImage;
[cell.imageView setContentMode:UIViewContentModeScaleAspectFit];
//...
// If the image has been downloaded I set it
cell.imageView.image = iconDownloader.image;
This is driving me nuts. It actually only happens in one of two tables in my app, but after comparing them line or line I can't see any difference. Hoping that someone has come across this before.
Thanks!
EDIT: I don't have a good explanation for my solution other than to say that images over a certain size appear to lead to this behavior and the use of actual thumbnails (even images somewhat bigger than the UIImageView's frame) do not exhibit this behavior.
If you have custom UITableViewCell then make sure that your UIImageView is not named with "imageView"
The only things that come to mind that effect the size & appearance of a view within its superview are:
Are you changing the frame/bounds/center properties anywhere? Where/how is the frame set initially?
imageView.autoResizingMask should be set to UIViewAutoResizingNone
imageView.clipsToBounds should be set to YES
EDIT: more suggestions
I'm shooting in the dark b/c your posted code looks fine and if you've set imageView.clipsToBounds that should constrain the drawn image to the imageView frame. Here are a couple more things to try:
Implement tableView:willDisplayCell:forRowAtIndexPath: and set the imageView properties there. If imageView.frame is the problem, this likely won't fix it.
Add your own UIImageView to the cell configured how you want it and don't use the built in imageView property. If the behavior of the default cell is causing the problem this should work.
EDIT: large image problems
I don't know exactly how big the "really big images" are that you are currently using but they are likely the issue. From the UIImage docs (emphasis is mine):
You should avoid creating UIImage objects that are greater than 1024 x
1024 in size. Besides the large amount of memory such an image would
consume, you may run into problems when using the image as a texture
in OpenGL ES or when drawing the image to a view or layer. This size
restriction does not apply if you are performing code-based
manipulations, such as resizing an image larger than 1024 x 1024
pixels by drawing it to a bitmap-backed graphics context. In fact, you
may need to resize an image in this manner (or break it into several
smaller images) in order to draw it to one of your views.
This answer helped me. But I had to make sure to call [cell layoutSubviews] in the method that actually does the setting, like this:
cell.imageView.image = image;
[cell layoutSubviews];
Hope this can be of use to you!
My issue was slightly different, I had a custom UITableViewCell with own UIImageView and when cell disappeared and reappeared, the image would be incorrect size. My problem was that I was setting cell.imageView in one place and cell.thumbnail (custom image) in another, so I changed all references to cell.thumbnail.
Hopefully it helps someone in the future with similar issue.
In these situations I use this Image loader framework. It includes a method to set a placeholder image of your choosing, while downloading images in the background, and as an added benefit it caches images guaranteeing the same image won't ever have to be downloaded twice. Its a great piece of work that I've found very useful for tableview image loading.
SDWebImage:
https://github.com/rs/SDWebImage
I had the same problem, and I didn't figure out the reason for that. Anyway, it's something related to the placeholder image: if you load an image of the same size that the placeholder, no resize will be performed, but if the sizes don't match, the loaded image will be resized to the placeholder dimensions, and resized again when clicked.
So, if you want to avoid the problem, use a placeholder that matches the row height.
follow these steps:
Select the ImageView on your custom cell
go to Show to Identity Inspector
Scroll all the way to the end and uncheck the "User Interaction Enabled" checkbox.
This is pretty unlikely, but you should try to look into what happens to the frames of the UITableViewCell's subviews when its isSelected property switches from NO to YES (I.e. what happens when you tap a cell). I doubt that will help much, but it's worth looking into (if you can find anything...that's all under the hood of UITableViewCell I would imagine).
You should also look into the imageview's clipsToBounds property. Maybe that has something to do with it?
doing something like
CGRect bounds = [self bounds];
[self setImage:image];
[self setBounds:bounds];
when setting image fixes the problem for me
If you reload the tableview when it finish loading, the image get the size that it was suppose to have
[self.tableview reloadData];
I fix the problem with:
cell.selectionStyle = .none
In my case, I faced this issue in iOS 12 however iOS 13 works fine.
I changed UIImageView to UIButton and set background image as like below which fixes my issue.
cell.imageButton.setBackgroundImage(UIImage(named: "name_of_the_image", for: UIControl.State.normal)
I know this is way too late to post but someone might find it helpful.

UIImageView is resizing

I have an issue with uiimageviews resizing at run time. On one view I have more than a dozen uiimageviews contained within a uiscrollview. The images are assigned at design time. The uiimageview's are all the same size. The mode is set to Aspect Fill for all uiimageviews. At run time the images appear correctly in the view.
On a second view I have only 9 uiimageviews. These uiimageviews will display up to nine of the images selected from the first view. There are three images across and three images down. The uiimageview at design time is the same size as on the first view. The uiimageview image is assigned an image that is loaded into an array. All the uiimageviews are sized the same and they also have the mode set to Aspect Fill. The images are assigned at run time using image1.image = xxx. Where xxx is an image stored in an array.
However, on this second view, the images are not all the same size. The height of the image changes dynamically. The same image displayed in a different uiimageview on the view will be different sizes. It is the height of the uiimageview that changes. In some cases the image will fill the uiimageview differently. It is like the mode changes dynamically.
I've tried using different modes and nothing changes.
Any ideas on what is happening?
try resetting the frame of UIImageview's object (of same size which you set at the design time) after setting its image property...

iOS SDK UIViewContentModeScaleAspectFit vs. UIViewContentModeScaleAspectFill

I have an image that I would like to display in a UITableViewCell using the UITableViewCellStyleSubtitle style that provides a UIImageView, and two lines of text, plus an optional accessory view.
However, when I set the content mode of the UIImageView to either of UIViewContentModeScaleAspectFit or UIViewContentModeScaleAspectFill, it appears to make no difference. Both of these content modes simply display the entire image, shifting the text to the right to make room for the image.
Does anyone have any examples of how these actually differ in practice? The docs say:
UIViewContentModeScaleAspectFit:
Scales the content to fit the size of the view by maintaining the aspect ratio. Any remaining area of the view’s bounds is transparent.
UIViewContentModeScaleAspectFill:
Scales the content to fill the size of the view. Some portion of the content may be clipped to fill the view’s bounds.
But these content modes don't appear to be behaving as advertised.
EDIT: I'm running SDK iOS 4.
I had the same problem.
Seems like the Apple documentation is a bit lacking.
I found the answer by searching around the internet.
http://www.iphonedevsdk.com/forum/iphone-sdk-development/2973-crop-image.html
Basically,
img1.contentMode = UIViewContentModeScaleAspectFill;
img1.clipsToBounds = YES;
If you want it to be a bit more fancy, check out this post:
UIImageView change Width and Height
The reason you don't see a difference between those modes is that the UITableViewCell automatically sizes its image view to fit the aspect ratio of the image. The content modes only come into play when the view's aspect ratio is different from the image's.
Either override layoutSubviews in your custom UITableViewCell class or create an image view yourself (don't use the one that the table view cell provides).