I manually add an UIImageView to my UIView and center it, this works fine, but after rotating the device, the UIImageView isn't centered anymore (it's moved to the lower left). How can I fix this?
logoView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"wi-fi-sticker.png"]];
logoView.center = self.view.center;
[self.view addSubview:logoView];
Regards,
Sascha
I was able to center mine correctly every time using something like this
-(void)willAnimateRotationToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration:{
CGRect screen = [[UIScreen mainScreen] bounds];
float pos_y, pos_x;
pos_y = UIDeviceOrientationIsLandscape(toInterfaceOrientation) ? screen.size.width/2 : screen.size.height/2;
pos_x = UIDeviceOrientationIsLandscape(toInterfaceOrientation) ? screen.size.height/2 : screen.size.width/2;
myImageView.center = CGPointMake(pos_x, pos_y);
}
Related
I have a table that contains the path to the picture, saved on user's library. Then, I pass this path to a View that contains just a imageView. I want to fills this ImageView with the picture. Like WhatsApp (when you click on a profile's picture). But, my picture it's always cropped or distorted. I tryed different ways to do this, but I didn't find the best way:
- (void)viewDidLoad
{
[super viewDidLoad];
self.navigationController.navigationBar.translucent = NO;
UIImage *picture = [UIImage imageWithContentsOfFile: self.picturePath]; //I passed this path from the previous View
UIImageView* imageView = [[UIImageView alloc] initWithImage:picture];
CGRect screenRect = [[UIScreen mainScreen] bounds];
imageView.frame = CGRectMake(0, 0, screenRect.size.width, screenRect.size.height);
imageView.contentMode = UIViewContentModeScaleAspectFill;
[self.view addSubview:imageView];
}
Original (I want something like it)
My app
If your image is cut , the reason is you are using a higher resolution image in a smaller container and instructed your imageview to fill , using this line imageView.contentMode = UIViewContentModeScaleAspectFill;
Change it to imageView.contentMode = UIViewContentModeScaleAspectFit;
I think #whitewolf09 is right and his method will solve your problem. But i suggest you to look into MGImageUtilities that will be very useful for different cases where you can crop images maintaining aspect ratio to fit inside your image view's frame.
Just #import "UIImage+ProportionalFill.h"
UIImage *image = [[UIImage imageWithContentsOfFile:filePath] imageScaledToFitSize:imageView.frame.size];
That's the very useful category for image resizing and may help you in future.
I think the reason it is being clipped is that you are creating the image view with a picture THEN setting the frame and probably the picture is bigger than the frame so it is clipping it. Also try changing the aspect to: 'UIViewContentModeScaleAspectFit' Try this:
- (void)viewDidLoad
{
[super viewDidLoad];
self.navigationController.navigationBar.translucent = NO;
UIImage *picture = [UIImage imageWithContentsOfFile:self.picturePath]; //I passed this path from the previous View
UIImageView* imageView = [[UIImageView alloc] initWithRect:CGRectMake(0, 0, screenRect.size.width, screenRect.size.height);];
CGRect screenRect = [[UIScreen mainScreen] bounds];
imageView.image = picture;
imageView.contentMode = UIViewContentModeCenter;
[self.view addSubview:imageView];
}
I want to add rounded corners image on my UIView, so I made two of my images 12x12px rounded corners.
I want to know how best to add my view taking into account that he must align automatically in portrait and landscape mode in the bottom of the total screen!
This is what I did now, but that does not work:
CGSize result = [[UIScreen mainScreen] bounds].size;
self.brcLeft = [[UIImageView alloc] initWithFrame:CGRectMake(0.0, result.height-12.0, 12.0, 12.0)];
self.brcLeft.image = [UIImage imageNamed:#"brc-left"];
[self.view addSubview:brcLeft];
self.brcRight = [[UIImageView alloc] initWithFrame:CGRectMake(result.width-12.0, result.height-12, 12.0, 12.0)];
self.brcRight.image = [UIImage imageNamed:#"brc-right"];
[self.view addSubview:brcRight];
For setting your views to both orientation at the bottom of the screen do this:
- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation
{
CGRect screenFrame = [[UIScreen mainScreen] bounds];
[self.brcLeft setFrame:CGRectMake(0.0, screenFrame.size.height - self.brcLeft.frame.size.height , 12.0, 12.0)];
[self.brcRight setFrame:CGRectMake(result.width-12.0, screenFrame.size.height - self.brcRight.frame.size.height , 12.0, 12.0)];
return YES;
}
and for rounded Corners:
#import <QuartzCore/QuartzCore.h>
write this in your viewDidLoad
self.brcLeft.layer.cornerRadius = 2;
self.brcLeft.layer.masksToBounds = YES;
self.brcRight.layer.cornerRadius = 2;
self.brcRight.layer.masksToBounds = YES;
I have the following code to create a scroll view with additional area at the beginning and the end of the images (50 points).
UIScrollView* scroll = [[UIScrollView alloc] initWithFrame: CGRectMake(0,0,200,100)];
scroll.contentSize = CGSizeMake(400,100);
UIImageView* img1 = [[UIImageView alloc] initWithFrame: CGRectMake(50,0,100,100);
UIImageView* img2 = [[UIImageView alloc] initWithFrame: CGRectMake(150,0,100,100);
UIImageView* img3 = [[UIImageView alloc] initWithFrame: CGRectMake(250,0,100,100);
//Adding images to ImageViews
scroll.pagingEnabled = YES;
[scroll addSubView:img1];
[scroll addSubView:img2];
[scroll addSubView:img3];
The first time I see the view, I will see the additional area on the left (0-50), then the first image (50-150) and then half of the second image (150-200).
When I swipe left, I want to see half of the first image on the right, the second image at the center, and half of the third image on the right.
When I swipe left again, I want to see the third image at center, with half of the second image on the left, and the additional area on the right.
Can it be possible?
It's possible as long as you define everything correctly. Make sure that the assigned content size is equal to the overall size that you wish to scroll through. Make sure that each page size is equal to the scroll view's frame. You can set the clipsToBounds to NO if the frame clips your subviews.
You can do this by adjusting the contentSize of UIScrollView
- (void)addImagesToScrollView{
//An offset from where imageViewStarts
CGFloat xOffset = 50.0f;
CGRect imageViewFrame = CGRectMake(xOffset, 0.0f, 100.0f, 100.0f);
for (NSString *imageName in #[#"image1.jpg",#"image2.jpg",#"image3.jpg"])
{
UIImageView *imageView = [[UIImageView alloc]initWithFrame:imageViewFrame];
UIImage *image = [UIImage imageNamed:imageName];
imageView.image = image;
[self.scrollView addSubview:imageView];
imageViewFrame.origin.x+=imageViewFrame.size.width;
}
CGSize contentSize = self.scrollView.frame.size;
//Content size is calculate from the imageViewFrame and an offset is added to it
contentSize.width = imageViewFrame.origin.x+xOffset;
[self.scrollView setContentSize:contentSize];
}
Source Code
You can scroll to a particular place in the scrollview using the following code
[YOURSCROLLVIEW setContentOffset:CGPointMake(x, y) animated:YES];
I have an application which has a fullscreen UIScrollView, and within it there are seven images. The images are also meant to be full screen, and the scroll view is set to enable pagination.
I have a method which either creates or moves the image views:
-(void)rebuildImageView{
// set up images
float screenW = self.view.bounds.size.width;
float screenH = self.view.bounds.size.height;
int numImgs = self.soundNames.count;
self.mainScrollView.contentSize = CGSizeMake(screenW * numImgs, screenH);
for(int i=0; i<numImgs; i++){
UIImageView* imageView = (UIImageView*)[self.mainScrollView viewWithTag:i+100];
if(imageView == nil){
imageView = [[UIImageView alloc] init];
imageView.tag = i+100;
[self.mainScrollView addSubview:imageView];
imageView.image = [UIImage imageNamed:[NSString stringWithFormat:#"image%d.jpg",i]];
imageView.contentMode = UIViewContentModeScaleAspectFill;
imageView.clipsToBounds = YES;
[imageView release];
}
imageView.frame = CGRectMake(i * screenW, 0, screenW, screenH);
}
// scroll to the current one
[self.mainScrollView scrollRectToVisible:CGRectMake(self.currentSound*screenW, 0, screenW, screenH) animated:YES];
}
I also have this on the view controller:
-(void)willAnimateRotationToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration{
[UIView animateWithDuration:duration animations:^{
[self rebuildImageView];
}];
}
This code works fine when I autorotate while image 0 is being shown, but when I'm on image 7, you can briefly see most of image 6 when rotating. This video shows what's happening:
http://www.youtube.com/watch?v=1O3jOcTgVP8
Is there a better method I should use to reconfigure the scroll view and images when rotating the device?
Any frame changes put in the willAnimateRotationToInterfaceOrientation:duration method should automatically animate. So you could try removing it from the block?
Personally, I've had a lot more luck with this type of thing subclassing UIScrollView and putting the equivalent layout subview frame code in an override of the layoutSubviews method (don't forget to call super or you might end up with misplaced scroll bars).
I am using the code from http://www.cocos2d-iphone.org/forum/topic/6889 to add a UIView to the screen in a Cocos2d game. It works great in non-retina resolution (everything is positioned correctly), but in retina resolution the UIView is placed in a different location. The code I am using to add the view to the game is basically the same as the code from the website:
UIView *myView = [[[UIView alloc] init] autorelease];
myView.backgroundColor = [UIColor redColor];
CCUIViewWrapper *wrapper = [CCUIViewWrapper wrapperForUIView:myView];
wrapper.contentSize = CGSizeMake(100, 100);
wrapper.position = ccp(50,50);
[self addChild:wrapper];
The view appears 50px from the bottom and left corner in non retina and 0px from left and 100px up in retina.
The positioning for the wrapper in retina mode is ccp(320,0). No idea why, but it works.
if ([[UIScreen mainScreen] respondsToSelector:#selector(scale)] == YES && [[UIScreen mainScreen] scale] == 2.00) {
wrapper.position = ccp(320,0); //Retina
} else {
wrapper.position = ccp(160,240); //Normal
}
The CCUIViewWrapper (at least in the form from the forum thread) does not use CC_CONTENT_SCALE_FACTOR(). That means it's not compatible with Retina displays.
You may be able to get around this by supplying properly scaled size and position, this may or may not work:
wrapper.contentSize = CGSizeMake(100 * CC_CONTENT_SCALE_FACTOR(),
100 * CC_CONTENT_SCALE_FACTOR());
wrapper.position = ccp(50 * CC_CONTENT_SCALE_FACTOR(),
50 * CC_CONTENT_SCALE_FACTOR());