Image and button in NSImageView are in wrong positions - objective-c

I am assigning a button and an image to the same position (0, 0), but they are drawn in different locations. Why does this happen?
Here is my code:
- (void)applicationDidFinishLaunching:(NSNotification *)aNotification
{
// Insert code here to initialize your application
[window makeKeyWindow];
[window setFrame:NSMakeRect(0, 0, 500, 468) display:YES];
//[window setFrame:[[NSScreen mainScreen]frame] display:YES];
[window setBackgroundColor:[NSColor clearColor]];
[window center];
[[window contentView] setAutoresizesSubviews:YES];
NSImageView *subView = [[NSImageView alloc]initWithFrame:NSMakeRect(0, 0, 500, 468)];
[subView setImage:[NSImage imageNamed:#"Flowers.jpg"]];
[subView setAutoresizingMask:NSViewWidthSizable|NSViewHeightSizable];
[subView setAutoresizesSubviews:YES];
NSButton *subButton = [[NSButton alloc]initWithFrame:NSMakeRect(0, 0, 100, 40)];
[subButton setTitle:#"testing"];
[subButton setAutoresizingMask:NSViewWidthSizable|NSViewHeightSizable|NSViewMaxXMargin|NSViewMaxYMargin|NSViewMinXMargin|NSViewMinYMargin];
[subView addSubview:subButton];
[window setContentView:subView];
}
and here is the result after building:

The code is working exactly as you told it to; the button and the image view are in the correct position, both in the lower-left corner of the window.
The image does not fill the entire height of the image view because it has a different aspect ratio: It is significantly wider than it is tall, while the image view is nearly square.
There is no way to change the image view to work differently—to fill the image view even if it must crop the image to do so. The only options are to scale proportionally (preserving aspect ratio), scale regardless of ratio (fill the image view but possibly distort the image), and don't scale ever. If you want to scale proportionally to fill and crop, you will have to do it yourself. Alternatively, you may want to change the window's size to match the size—or at least the aspect ratio—of the image.
As an aside, it is unusual at best to put buttons inside image views in Cocoa. Most views—those that do something specific—should not contain other views. The button and the image view should each be inside a plain NSView.

Related

MKMapView panning causes parent UIScrollView to scroll

I have a MKMapView added to a UIScrollView. I thought that the expected functionality would be that panning the map would cause the map to move, but it's parent UIScrollView would not scroll. i.e. if you were panning the map, the scrollview would stay in it's current position.
This is my code:
scrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, self.width, self.height)];
[scrollView setAutoresizingMask:UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth];
[self.view addSubview:scrollView];
double mapHeight = 200;
if([AppDelegate isRunningOniPad])
mapHeight = 400;
map = [[MKMapView alloc] initWithFrame:CGRectMake(0, 200, self.width, mapHeight)];
[map setExclusiveTouch:NO];
[scrollView map];
I've tried setting exclusive touch to YES and to NO, but it doesn't seem to have any effect.
Is there a way to get the behaviour working so that panning the map will stop the UIScrollView from moving? I've tried changing map to a UIScrollView instead of an MKMapView too, but that had the same behaviour - so I doubt that this is MKMapView specific.
The expected outcome is correct, the scroll view should remain stationary when the Map View is touched, as this should receive the touch events before they are passed up the responder chain to the scroll view.
I have quickly tested the above code in an empty project, and this is working as expected with a couple of alterations to the creating of frame & sizes, iPad size detection, and adding the map as a sub-view of the scroll view.
UIScrollView *scrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, self.view.bounds.size.width, self.view.bounds.size.height)];
[scrollView setAutoresizingMask:UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth];
// Make the content size large to allow scroll view to move
[scrollView setContentSize:CGSizeMake(1000, 2000)];
[self.view addSubview:scrollView];
double mapHeight = 200;
if(UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad) {
mapHeight = 400;
}
MKMapView *map = [[MKMapView alloc] initWithFrame:CGRectMake(0, 200, self.view.bounds.size.width, mapHeight)];
[map setExclusiveTouch:NO];
[scrollView addSubview:map];
In case it helps anyone,
Adding a MKMapView to a UIScrollView should work as expected. In my situation, it wasn't working because my view hierarchy was setup incorrectly.
If you're having problems look at how you are adding sub views (ie [self.view addSubview:mapView]. Make sure the MKMapView is properly in the UIScrollView's hierarchy.
Also, I really like revealapp.com to inspecting the view hierarchy (and no I'm not associated with them ;)

set background image dimensions IOS

I have an image bigger then a normal iPhone screen that I want to set as my background image but when I load the simulator I just see part of the image. Here is how I assigned the image:
UIImage *background = [UIImage imageNamed:#"background.png"];
[self.view setBackgroundColor:[UIColor colorWithPatternImage:background]];
how can I set the background image to something like self.view.bounds? If I was to use a UIImageView how do I ensure that it is in the background!!!
Make a UIImageView, give the UIImage to the UIImageView and add the UIImageView as a child to the view. Like so:
UIImageView *backgroundView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"name.png"]];
[backgroundView setFrame:CGRectMake(0, 0, 320, 480)];
[self.view insertSubView:backgroundView atIndex:0];
[backgroundView release];
Set uiimageview frame - this is limitations for display.
Use
background.frame = CGRectMake (0,0, 320, 480); // as example - full screen,
also like in post above add addSubview and release code.
If you used frame - coordinates calculate from your superview - in that case - from self.view (simulator display). If you used bounds, coordinates calculate relatively to yours uiimageview (not self.view)

setting view boundaries

I have a scrollview with an image as a subview. I would like to set the boundaries of the scrollview to be the size of the image view, so that you wouldn't be able to see any of the background.
I don't want this happening anymore.
The weird part is, that after you zoom in or out on the image, then the boundaries seem to fix themselves, and you can no longer move the image out of the way and see the background.
This is what I have going for code:
-(UIView *) viewForZoomingInScrollView:(UIScrollView *)scrollView
{
// return which subview we want to zoom
return self.imageView;
}
-(void)viewDidLoad{
[super viewDidLoad];
[self sendLogMessage:#"Second View Controller Loaded"];
//sets the initial view to scale to fit the screen
self.imageView.frame = CGRectMake(0, 0, CGRectGetWidth(self.view.bounds), CGRectGetHeight(self.view.bounds));
//sets the content size to be the size our our whole frame
self.scrollView.contentSize = self.imageView.image.size;
//setes the scrollview's delegate to itself
self.scrollView.delegate = self;
//sets the maximum zoom to 2.0, meaning that the picture can only become a maximum of twice as big
[self.scrollView setMaximumZoomScale : 2.5];
//sets the minimum zoom to 1.0 so that the scrollview can never be smaller than the image (no matter how far in/out we're zoomed)
[self.scrollView setMinimumZoomScale : 1.0];
[imageView addSubview:button];
}
I thought that this line would solve my problem
//sets the content size to be the size our our whole frame
self.scrollView.contentSize = self.imageView.image.size;
But like I said, it only works after I zoom in or out.
EDIT: When I switch
self.scrollView.contentSize = self.imageView.image.size;
to
self.scrollView.frame = self.imageView.frame;
It works like I want it to (you can't see the background), except the toolbar on the top is covered by the image.
imageView.image.size isn't necessarily the frame of the imageView itself, try setting the
scrollview.frame = imageView.frame
and then
scrollView.contentSize = imageView.image.size
Then you won't see any border. If you want the image to be the maximum size to start with,
do
imageView.frame = image.size;
[imageView setImage:image];
scrollView.frame = self.view.frame; //or desired size
[scrollView addSubView:imageView];
[scrollView setContentSize:image.size]; //or imageView.frame.size
To fix this, I ended up declaring a new CGRect , setting its origin to my scrollView's origin, setting its size with the bounds of my view, and then assigning this CGRect back to my scrollview frame
CGRect scrollFrame;
scrollFrame.origin = self.scrollView.frame.origin;
scrollFrame.size = CGSizeMake(CGRectGetWidth(self.view.bounds), CGRectGetHeight(self.view.bounds));
self.scrollView.frame = scrollFrame;

Why after rotating UIImageView size is getting changed?

I'm new in using transformations. And still confusted how they are working.
What I'm trying to do, is to rotate my UIImageView with given angle. But after rotating, it's changing the size of image, getting smaller. I'm also doing scaling for ImageView so it won't be upside down.How to rotate and keep the size, that was given in CGRectMake, when ImageView was allocated ?
UIImageView *myImageView = [[UIImageView alloc]initWithFrame:CGRectMake(x,y,width,height)];
myImageView.contentMode = UIViewContentModeScaleAspectFit;
[myImageView setImage:[UIImage imageNamed:#"image.png"]];
myImageView.layer.anchorPoint = CGPointMake(0.5,0.5);
CGAffineTransform newTransform;
myImageView.transform = CGAffineTransformMakeScale(1,-1);
newTransform = CGAffineTransformRotate(newTransform, 30*M_PI/180);
[self.window addSubview:myImageView];
Thanks a lot!
Ok I promised I'd look into it, so here's my answer:
I create a scene which should be somewhat equivalent to yours, code as follows:
UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(self.view.bounds.size.width/2-100,
self.view.bounds.size.height/2-125,
200,
250)];
imageView.image = [UIImage imageNamed:#"testimage.jpg"];
imageView.contentMode = UIViewContentModeScaleAspectFill;
/*
* I added clipsToBounds, because my test image didn't have a size of 200x250px
*/
imageView.clipsToBounds = YES;
[self.view addSubview:imageView];
NSLog(#"frame: %#",[NSValue valueWithCGRect:imageView.frame]);
NSLog(#"bounds: %#",[NSValue valueWithCGRect:imageView.bounds]);
imageView.layer.anchorPoint = CGPointMake(0.5, 0.5);
imageView.transform = CGAffineTransformMakeRotation(30*M_PI/180);
NSLog(#"frame after rotation: %#",[NSValue valueWithCGRect:imageView.frame]);
NSLog(#"bounds after rotation: %#",[NSValue valueWithCGRect:imageView.bounds]);
This code assumes that you are using ARC. If not add
[imageView release];
at the end.
Using this code the logs look like this:
[16221:207] frame: NSRect: {{60, 105}, {200, 250}}
[16221:207] bounds: NSRect: {{0, 0}, {200, 250}}
[16221:207] frame after rotation: NSRect: {{10.897461, 71.746826}, {298.20508, 316.50635}}
[16221:207] bounds after rotation: NSRect: {{0, 0}, {200, 250}}
As you can see the bounds always stay the same. What actually changes due to the rotation is the frame, because an image which has been rotated by 30°C is of course wider than if it handn't been rotated. And since the center point has been set to the actual center of the view the origin of the frame also changes (being pushed to the left and the top). Notice that the size of the image itself does not change. I didn't use the scale transformation, since the result can be achieved without scaling.
But to make it clearer here are some pictures for you (0°, 30° 90° rotation):
They already look pretty similar, right? I drew the actual frames to make it clear what's the difference between bounds and frame is. The next one really makes it clear. I overlayed all images, rotating them by the negative degrees with which the UIImageView was rotated, giving the following result:
So you see it's pretty straight forward how to rotate images. Now to your problem that you actually want the frame to stay the same. If you want the final frame to have the size of your original frame (in this example with a width of 200 and a height of 250) then you will have to scale the resulting frame. But this will of course result in scaling of the image, which you do not want. I actually think a larger frame will not be a problem for you - you just need to know that you have to take it into account because of the rotation.
In short: it is not possible to have an UIImageView which will have the same frame after rotation. This isn't possible for any UIView. Just think of a rectangle. If you rotate it, it won't be a rectangle after the rotation, will it?
Of course you could put your UIImageView inside another UIView which will have a non-rotated frame with a width of 200 and a height of 250 but that would just be superficial, since it won't really change the fact that a rotated rectangle has a different width and height than the original.
I hope this helps. :)
Do not set the contentMode which UIImageView inherits from UIView and leads to the changes in frame according to scaling,transformation,device rotation in accordance to the UIViewContentMode you select.
Also if you just want to rotate you can just change the frame using :-
[UIView beginAnimations:#"Rotate" context:nil];
[UIView setAnimationDuration:1.0];
[UIView setAnimationDelegate:self];
CGRect frame=yourView.frame;
frame.origin.y+=distance you want to rotate;
yourview.frame=frame;
[UIView commitAnimations];
}
if you dont want the animation just change the frame
Try Using This :-
CABasicAnimation* animation = [CABasicAnimation animationWithKeyPath:#"transform.rotation.z"];
animation.fromValue = [NSNumber numberWithFloat:0.0f];
animation.toValue = [NSNumber numberWithFloat: 2*M_PI];
animation.duration = 0.5f;
animation.repeatCount = HUGE_VALF; // HUGE_VALF is defined in math.h so import it
[self.reloadButton.imageView.layer addAnimation:animation forKey:#"rotation"];

UITableViewCell: Accessory View going away when selected

I might be going about this all wrong, so hopefully someone will tell me what I should be doing.
I have constructed a table view to act as a legend and color picker. In the AccessoryView slot, I places a custom view that is just a colored box. User will show the legend, so they know what colors mean what, and they can pick on a color to then 'colorize' a drawing by assigning that color to objects. All of that works just fine.
What I'm having a problem with is the selected row style. When I select a row from the legend, the cell goes blue, like it should, but my AccessoryView has now disappeared. I don't want this to happen. However, I don't know what to set to make it not disappear. Keep in mind, I still want a row to show up as 'selected'. But any way that I do that, my accessory view disappears (most likely is hidden by the selected color).
Here's how I'm setting the accessory view right now.
CGRect colorBox = CGRectMake(0, 0, 30, 30);
UIView *colorView = [[UIView alloc] initWithFrame:colorBox];
colorView.backgroundColor = [self colorWithHexString:[selOption valueForKey:#"qoColor"]];
cell.accessoryView = colorView;
You can use a UIImageView instead of a UIView, which won't disappear when the cell is selected. You can either make tiny .png thumbnails for each color (if there aren't a lot) or you can create them dynamically in your cellForRowAtIndexPath delegate method, ala:
UIImageView *colorView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 30, 30)];
CGRect rect = CGRectMake(0.0f, 0.0f, 30.0f, 30.0f);
UIGraphicsBeginImageContext(rect.size);
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSetFillColorWithColor(context, [[self colorWithHexString:[selOption valueForKey:#"qoColor"]]; CGColor]);
CGContextFillRect(context, rect);
UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
[colorView setImage:image];
[cell setAccessoryView:colorView];
[colorView release];