This has probably been asked a bunch, so I'm more looking for direction to somewhere I can research this, unless it is an easy straight-forward answer. I can't think of the propper terminology to search for it; I just keep getting the same standard UIScrollView info.
I understand how to make a scrollable view, but I can't find anything on making say a 310 x 310 pixel part in the center of my view to be scrollable, like a scrollable div in the center of a webpage so it can have a nice image border around the content that would scroll in the center.
Just create a UIScrollView and set its frame to the size and location that you want and then add it to another view.
You can accomplish this with the addSubview method of UIView.
Create a UIImageView that spans the size of the screen (or whatever space you would like it to take up). This will contain the 'image border' you refer to. Let's say that view is named backgroundImageView.
Then create your UIScrollView; let's say it's called myScrollView. Now for this line:
[backgroundImageView addSubview:myScrollView];
That will add myScrollView inside backgroundImageView in the view hierarchy. Now you set myScrollView's position in the coordinate system of backgroundImageView. So to center it, do this:
[myScrollView setFrame:CGRectMake((backgroundImageView.frame.size.width - myScrollView.frame.size.width) / 2, (backgroundImageView.frame.size.height - myScrollView.frame.size.height) / 2, myScrollView.frame.size.width, myScrollView.frame.size.height)];
And voila, you're done :)
Related
I have a viewcontroller. On my storyboard I have dragged a TextField onto it.
In my code, I define a rect, that needs to be positioned relative to the text field, as follows:
CGRect autocompleteRect = CGRectMake(schoolField.frame.origin.x, schoolField.frame.origin.y + 70, schoolField.frame.size.width,autocompleteTableView.contentSize.height);
That works fine, until I embed my TextField in a UIView.
The UIView itself is managed by auto layout to be positioned in the center of the Controllers .view.
I would say, that this should not be of any influence to the relative postion of my rect. However, it is:
Since the embedding of the TextField in a UIView, my rect is positioned differently, also depending on the screen size of the device I'm running it on.
So, I guess it's got something to do with AutoLayout,but I wouldn't know what I should tell my app to behave the way I want it to.
Thanks for your insights.
autocompleteRect is a rect inside CredentialsContainer, but you use it for a view which has been contained by UIViewController's view. That's why your autocompleteRect has wrong position when you use.
To solve issue, you need to add the view which will use autocompleteRect to CredentialsContainer.
Hope this can make you more clearly.
I'm trying to do a custom layout like the Chanel app you can find the app in the Appstore.
https://itunes.apple.com/us/app/chanel-fashion/id409934435?mt=8
I know they are using an UICollectionView, but no clue how to start.
The interaction feels like a tableview mixed with a paginated scroll. When you scroll the elements grow, and the first element position itself at the top.
Start with dragging & positioning just one UIView. See UIGestureRecognizer docs and look for existing examples of movable views. You'll need an UIPanGestureRecognizer to move the view.
Resize the view depending on its Y position.
Create & position an image inside that view depending on the view size using a couple autolayout constraints.
Note that Chanel app has different constants for these constraints. With a minimum view height, one image's top is 80% height, for another image it's 90% height. Make sure you can manipulate constraints from code (I think it's a good idea to create everything from code there, XIBs are not very flexible).
Make the view "anchoring" to certain points (e.g. top = -75%, 0%, 75%, 90% from what I see in the Chanel app) when you stop moving it. Just find the nearest one and animate the view to it.
Once you did it with 1 view, move all your work to an NSView subclass (if it's not yet there) and create a collection of these views.
You can create UICollectionView, but I'd rather do it with a simple NSArray: I actually don't see a reason to use UICollectionView here; it's a very simple structure. Anyway, you write your own gesture recognizer (don't you? I can't see another way) - so what's the point to use UICollectionView? If you want to expand the app functionality some day, UICollectionView will unlikely help you with that. Well, it's my hypothetical approach, you can find another one while working on that.
Position other views while you're moving an "active" view. Do it by hand, without any UIScrollViews.
Write a function that reflects the Y position of the "neighbor" views while you moving one. It should "slow down" to the bottom of screen.
In my iOS app I want my users to be able to zoom in on the screen. My main uiview contains several subviews which contain images. I want my uipinchgesturerecognizer to either change the scale, or ideally use some "zoom" rather than scaling each subview.
Please and thank you.
This can be accomplished with UIScrollView. First create a scroll view as the base of your view hierarchy, putting your previous container view as a subview of the scroll view. Set the delegate of the scroll view to self and implement the delegate method viewForZoomingInScrollView, in which you should return the view that will be zoomed in (your original container view). This will allow the user to pinch and zoom your original UIView.
It's hard to provide advice on this without having a clearer view of what exactly you want to achieve.
Can you include a link to a sketch? For example, do you want the individual subviews to remain the same size but the layout to change ? Do you want the individual subviews to resize but their contents to be upscaled?
If you simple want to treat the subview as (basically) a single image which just happens to have other images in it, then maybe it would be better to render it as one and then scale that?
I have a requirement in my app to display a bunch of information that includes both text and images. It will be quite long, so it will need to be scrollable to access all the content.
I know that I can achive this by programmatically adding different UILabels, UIImages etc to a UIScrollView. But this is a proof of concept, so I'm looking for something a little quicker than having to work out all the positioning and code required. The information is static anyway, and does not need to interact with code.
Is there a way to do this using the interface builder (storyboard or xib is fine)?
you definitely can do that if you simply want a quick interface
1.> you might need to know how long is your scroll view, for example in my case, i set it to 1568
2.> Then i drag all the controls that will fit for the first 568 pixel view onto the scroll view and position them.
3.> Then change the Y value for that scroll view to something like - 500, so you can see the rest of the scroll view, and put everything you need there.
4.> After you have all your controls, and remember to set the frame back to 0,0,320,568
5.> last step, in your code, set SCROLLVIEW.contentSize = CGSizeMake(320, 1568);
I would still suggestion don't hard code all those values, but if you are looking for a quick way to do your interface, hope that gives you some ideas.
Just start a new project with a single view, it will come with a xib or storyboard for its single ViewController.
Create a UIView by dragging it into the workspace and place as many Labels, Images and UI Elements as you want.
Open the xib / storyboard and drag a UIScrollView in as your root VC's root view. Drag the view containing your layout into the scrollview, making it the scrollviews only subview.
Done (almost)!
If you launch your app at this point, you'll notice you can't scroll. That is because the scrollview is "too stupid" to adjust the size of its contentSize property on its own.
You'll need some code here, but it is only a tiny snippet and you won't need to touch it again:
Create a new Category on UIScrollView.
In your category's implementation, do:
#implementation UIScrollView (MyHandyCategory)
-(void)awakeFromNib {
NSArray *subViews = [self subviews];
UIView *contentView = [subViews objectAtIndex:0];
[self setContentSize:contentView.frame.size];
}
#end
Done (for real this time)! This will check the size of the view your scrollview contains and ajust the contentSize after it has been initialized. You can change the size of your content view as you like, no need to play around with hardcoded values or even Interface Builder values!
If it’s just proof of concept I’d have a WebView and a local HTML page you load. Easy-peasy.
I would suggest UICollectionView. It's fairly straightforward. There's a good tutorial here:
http://www.raywenderlich.com/22324/beginning-uicollectionview-in-ios-6-part-12
How do I build a freely scrollable view on iOS 5? I mean, I need to build a view which can scroll from left-right and top-down (any direction) and it will stay there. Inside this view, I need to place different kinds of objects.
(Imagine scrolling like a map. - I am using Storyboard.)
Yeah, UIScrollView.
And don't forget to set the content size !! (every noobs - including me - are always asking the same question, why my scrollView does not work?)
=> [scrollView setContentSize:CGSizeMake(1000, 2000)], for example.
EDIT :
I just saw your comment. I don't understand what you call "on top".
I made an app with custom maps, and I used an UIScrollView to make the job: it was pretty good at it.
You just have to add each scrollable element as subviews of your UIScrollView. And set the contentSize to fit to the subviews' frames, of course.