I have UIScrollView in which UIImageView is held like on the screenshot:
My problem appears when I zoom and instead of being able to scroll only in the area of my image (subview of scroll view) I'm able to scroll around the original size so I get a lot of white space around my image which isn't what I want. You can see what happens on the screenshot below:
I wonder what should I update to keep my scrolling area only the size of the image?
After some research, some trials and errors I've finally achieved what I was planning to do.
First of all, I wanted to use only autolayout with IB which sure can be done but with some effort. After some digging I've found this technical note which by "Pure Auto Layout Approach" understands adding contraints in code but I was aiming at only IB which led me to this simple but beautiful solution called ios-imagescroll. After investigating this code with joy that I've finally found solution I came with some error but only on iOS 8 devices... iOS 7 worked like charm out of the box.
I assume that due to big changes in iOS 8 autolayout is more strict and you must be 100% sure what you want to accomplish. It turned out that this slight change MATTERS on iOS 8:
Of course, this bug, fix (call it whatever you like) was fixed by experimenting with everything but I guess that UIScrollView's content view (in that case UIImageView) must be the first item in constraint.
[yourScrollView setContentSize:CGSizeMake(yourScrollView.size.width, yourImage.frame.origin.y + yourImage.frame.size.height+35 )]; //let's say just 35 ...
yourImage may have x,y origins like (0,0) [I see a lot of space above it, so I assume you have set other values for x,y]
Related
This issue is really frustrating and getting me crazy.
I've read everything about AutoLayout and so on, but it happens all the time.
My interface has a view with an image view as background and a smaller subview on top of it (corresponding to a field in my image). I've tried everything but it looks like the subview does not scale accordingly with my image when switching through devices.
By the way, the IB preview does not show what i real get when running the iOS Simulator, is that normal?
Why? What do i do wrong? I'm not sure what else to try!
http://i58.tinypic.com/34xqtc6.png
EDIT: i cannot post images :(
I have setup a githubrepo regarding your case, kindly have a look
https://github.com/usamaiqbal83/TestingProject
Constraints for Background Image View:
Constraints for Front View
the most important thing to remember is ofcourse the constraint equation
FirstItem.Attribute1 = (SecondItem.Attribute2 * Multiplier) + Constant
Instead of subview use Container View.
"It just works", or does it?
So I was going nuts trying to fit one ScrollView into another.
I get to the point when I actually made two separate xib files, did a scrollable label in one, and a scrollable image in another. Both are works perfectly in separate xib's.
After that I manage to open xib files as simple text(looks like they are formatted as XML or something similar) and simply cut scrollable image view(with all of superviews that I needed) into my main.(containing scrollable label)
So the idea was simple yet beautiful, I was like 90 percent sure it is going to work, because I inserted all the necessary view-scrollView-contentView stuff. And it is not. As you can see guys, image is big enough, views setted to be large and you can barely see tiny bit of it. So it SHOULD be scrollable, right?
Label with text keeps scrolling just fine, but the image wont move.
I was also trying to get scroll enabled via code, setting property to YES, but it wont help.
I also tried disabling auto-layout, thinking that it could be easier, but it was not much luck on the first attempt. Will be great to hear you guys thoughts, maybe I should disable auto-layout and try it out the old-way? Or is there a way to solve this puzzle as is?
Maybe my question was a bit long and not much of a readable, sorry for that guys, anyway I found my answer and will post a solution for any of you guys wondering about the same thing.
Just a reminder, I was trying to achive scrollable text+ scrollable image. Text should be scrolled up/down and the image should be scrolled in all directions.
So I find my previous attempt almost completely broken and started fresh(couple of times) and in the end I find the configuration that suits my needs.
Matter of fact, this particular configuration works almost exactly out of the box, most of the trick is get the right views in position. After that you just have to add missing constraints from the "Editor"->"Resolve layout issues" menu and get rid of few nonsense constraints that IB add god know why.(like those ones that adds 200pt blank space at the bottom or so)
After that you'll be pretty much set. If not, refer to the picture link, or github repo. Hope that will help someone.
So I have a UITextView, and in viewDidLoad I rotate its layer so it appears to be slanted back into the screen (sort of like the Star Wars opening crawl).
The problem is that scrolling is all messed up. Dragging up will scroll for a bit, then jump backward or similar; on the simulator it will even crash sometimes with an error about a coordinate containing NaN.
Similarly, when I try to automatically scroll the UITextView via [UIView animateWithDuration:...] I also get unexpected skips, jerks, etc.
I assume this has something to do with the fact that I've manipulated the layer, but the touch events as well as the animations are registered on the view... Or something like that?
Anyway, I'm pretty stumped.
Are you using constraints to position the text view? There seem to be issues with using transformations and constraints together. A common workaround seems to be to wrap the offending item in another view. The big issues are on iOS7, but some applies to iOS8 as well. This link discusses the issues which may be your issue:
How do I adjust the anchor point of a CALayer, when Auto Layout is being used?
I'm trying to use Auto Layout for a custom Table View Cell in my app.
I can't seem to get the constraints quite right.
I layed the labels out in the custom Table View Cell, but the labels are still getting cut off. Any ideas?
Thanks! Will post anything else needed. Tried to show needed info in picture below:
Debugging in Xcode. Somehow what shows in Simulator looks different than in Xcode debug.
Here's the width of my TableView shown:
UPDATE:
The problem here was related to what user matt said in the accepted answer, but I wanted to make the Q&A a bit clearer now that I have it figured out for anyone else that comes across this.
In his initial comment, he mentioned the Xcode View debugging, which was great and I was able to dig into a little bit more. Its called the Assistant Editor: Device Preview, where you are able to see the layout and layers of what is onscreen to see if maybe you have labels overlapping or going offscreen based on the device it is running on. If you want to check multiple device sized, just hit the plus icon in the lower left hand corner of this picture.
This helped me find overlapping layers and sizing issues with the TableView. I was able to see how it looked on each device size.
What also helps here sometimes to use the Pin menu. Sometimes the labels can run off screen because it doesn't know where the constraints of the cell are based on the device size. So your label can run offscreen if the label is based off of a landscape layout but the device is an iPhone 5 and is in Portrait for example. This is the Pin menu:
Hope that makes sense and gives some more color to the problem. Let me know if you have any questions at all, thanks for the help everyone!
The problem is that you are using auto layout but you have not done anything about sizing the table view. The table view here is not your view controller's view; it is a subview. Your view controller's view is automatically sized to the size of the device / window, but its subviews are not automatically resized. So you are ending up with the table view much too wide for the device; the whole table is sticking off into space on the right side.
Use a trailing space from the right side of your labels to the edge of their superview, and set it to greater than instead of equals with a value of ~ 5
Review the constraints of your tableview with the View. Draw cell border, label border and tableview border with different colors to know which elements do not display correctly.
Ex:
#import <QuartzCore/QuartzCore.h>
...
cell.layer.border.width = 1;
cell.layer.border.color = [UIColor blackColor].CGColor;
The thing that worked for me to solve views being clipped was to uncheck "Constrain to margins" in Auto Layout.
Perhaps it's something with Xcode 4.5+ or iOS 6 that makes my research fruitless so far, but...
Apple's own advice hasn't worked for me. I set the contentSize to something different, and it causes no changes.
I found this wasn't unique to me, but the answer in that question 1.) does not inform me about the problem and 2.) I'm left wondering if it's really impossible to create a simple, non-inheriting example of UIScrollView. Thus, this question.
A better answer's code was tried within viewDidLoad and viewDidAppear, but to no avail.
So what gives? Is it possible to create a simple, image-filled view that allows scrolling? Say... something as easy as this basic project I set up on github -- but working?
Create and initialize a UIScrollView
Add it as subview to the view of viewcontroller
Make an array of image names
In a loop create UIImageView and add the images and add imageviews into scrollview considering the width of images, set the frame of imageviews
Number of images is known and the width it consumes can be calulated from the loop itself use it to set the contentSize of the scrollview