How to use NSScrollview? - objective-c

I can't figure out how to actually use NSScrollview. I dragged the scroll view object onto an NSWindow in the interface builder. I then dragged some NSButtons onto the scroll view. My question is:
How do I actually make it scroll down, for example, 2x the original height?

Of course the user can scroll automatically using their UI. I assume what you want to do is to scroll programmatically.
A bit of background: An NSScrollView has a documentView, which is the underlying view that the scroll view shows a part of, and a clipView, which is the view that is shown on the screen. So the clip view is like a window into the document view. To scroll programmatically you tell the document view to scroll itself in the clip view.
You have two options on how to scroll programmatically:
- (void)scrollPoint:(NSPoint)aPoint –– This scrolls the document so the given point is at the origin of the clip view that encloses it.
- (BOOL)scrollRectToVisible:(NSRect)aRect –– This scrolls the document the minimum distance so the entire rectangle is visible. Note: This may not need to scroll at all in which case it returns NO.
So, for example, here is an example from Apple's Scroll View Programming Guide on how to scroll to the bottom of the document view. Assuming you have an IBOutlet called scrollView connected up to the NSScrollView in your nib file you can do the following:
- (void)scrollToBottom
{
NSPoint newScrollOrigin;
if ([[scrollview documentView] isFlipped]) {
newScrollOrigin = NSMakePoint(0.0,NSMaxY([[scrollview documentView] frame])
-NSHeight([[scrollview contentView] bounds]));
} else {
newScrollOrigin = NSMakePoint(0.0,0.0);
}
[[scrollview documentView] scrollPoint:newScrollOrigin];
}

Related

How to prevent certain object from scrolling in a UIScrollView

I don't know if this is possible and I highly doubt that it is but I'm wondering if there's a way where I can prevent a button for example from scrolling in a UIScrollView using Objective-C programming?
Sure. Simply update the button's origin as the scroll view scrolls.
In your view controller, implement the appropriate scroll view delegate method. If not done already, setup your view controller as the scroll view's delegate.
- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
CGPoint offset = scrollView.contentOffset;
CGRect frame = self.fixedButton.frame;
frame.origin.y = offset.y + 40;
self.fixedButton.frame = frame;
}
This will keep the self.fixedButton button 40 points below the top of the visible portion of the scroll view. Adjust as needed.
The above all assumes the button is a subview of the scroll view.
Of course it may be a lot easier if the button and the scroll view share a common parent view. Then the button isn't a subview of the scroll view and won't scroll at all.

Scrolling a NSScrollView not working

I'm trying to scroll an NSScrollView to the bottom of the view using this code:
NSPoint newScrollOrigin;
if ([[self.chatScreen documentView] isFlipped]) {
newScrollOrigin=NSMakePoint(0.0,NSMaxY([[self.chatScreen documentView] frame])-NSHeight([[self.chatScreen contentView] bounds]));
} else {
newScrollOrigin=NSMakePoint(0.0,0.0);
}
self.chatScreen.backgroundColor=[NSColor redColor];
[[self.chatScreen documentView] scrollPoint:newScrollOrigin];
which came from here: Apple doucmentation on scrolling
When I run my program, it partially scrolls to the bottom of the view, where the screen shows the top of the view (default starting position) but when I attempt to scroll, it jumps to the bottom of the page, where I can then scroll normally.
If I scroll around to any part of the view, the next time it receives an update (which triggers it to jump back to the bottom) it looks like nothing happened, until you try to scroll, which again causes it to jump back to the bottom of the page.
Thanks in advance.
You need to scroll the clip view and not the document view.
The document view fills out the entire scroll view and the clip view is kind of an overlay which scrolls around deciding which parts are visible.
[[self.chatScreen contentView] scrollToPoint:newScrollOrigin];
Notice the scrollToPoint instead of NSView's layer backed scrollPoint
After you scroll a NSClipView its always good practice to reflectScrolledClipView so that the scrollers update.
- (void)reflectScrolledClipView:(NSClipView *)aClipView;

UIScrollView within a UIScrollView, how to keep a smooth transition when scrolling between the two

I have the following layout (see below), which for most circumstances works just fine. The user is able to scroll within the blue UIScrollView (which for all intents and purposes is a UITableView, but this question generalises this), and then when they've reached the end of this scroll view, they can start scrolling again (they have to take their finger off, and on again, because the inner scroll view rubberbands otherwise), and the 'super' scroll view starts scrolling, revealing the rest of the image.
It's the whole (they have to take their finger off, and on again, because the inner scroll view rubberbands otherwise) that I don't want. Ideally, once the contained UIScrollView reaches the end of its content, I want the superview to take over scrolling straight away, so that the inner scroll view doesn't rubberband.
The same goes when the user is scrolling back up; when the red scrollview reaches the top of it's content, I want the inner blue scroll view to start scrolling up straight away, instead of the red scroll view rubberbanding at the top.
Any idea how? I am able to determine when the scroll views have reached the ends of their content, but I'm not sure how to apply this knowledge to achieve the effect I'm after. Thanks.
// Inner (blue) scroll view bounds checking
if (scrollView.contentOffset.y + scrollView.frame.size.height > scrollView.contentSize.height) { ... }
// Outer (red) scroll view bounds checking
if (scrollView.contentOffset.y < 0) { ... }
Yeah. Ive got a nifty trick for you.
Instead of having your red outlined view a scrollview make it a normal UIView that fills the screen. In that view lay out your scroll view (table view) and image view as they are in your illustration.
Place a scrollview that fills the bounds of the root view (i.e. also fills the screen) above all the other scrollview and image views. Set the content size of this view to be the total content height of all the views you want to scroll through. In otherwords there is an invisible scrollview sitting on top of all your other views and its content size height is inner scrollview (tableview) content size height + image view size height.
The heierarchy should look like this:
Then this scrollview on top that you have made with the really tall content size make its delegate be your view controller. Implement scrollViewDidScroll and we'll work some magic.
Scrollviews basically scroll by adjusting the bounds origin with funky formulas for momentum and stuff. So in our scrollviewDidScroll method we will simply adjust the bounds of the underlying views:
-(void)scrollViewDidScroll:(UIScrollView *)scrollView{
//the scroll view underneath (in the container view) will have a max content offset equal to the content height
//but minus the bounds height
CGFloat maxYOffsetForUnderScrollView = self.underScrollView.contentSize.height - self.underScrollView.bounds.size.height;
CGRect scrolledBoundsForContainerView = self.view.bounds;
if (scrollView.contentOffset.y <= maxYOffsetForUnderScrollView) {
//in this scenario we are still within the content for the underScrollView
//so we make sure the container view is scrolled to the top and set the offset for the contained scrollview
self.containerView.bounds = scrolledBoundsForContainerView;
self.underScrollview.contentOffset = scrollView.contentOffset;
return;
}
//in this scenario we have scrolled throug the entirety of the contained scrollview
//set its offset to the max and change the bounds of the container view to scroll everything else.
self.underScrollView.contentOffset = CGPointMake(0, maxYOffsetForUnderScrollView);
scrolledBoundsForContainerView.origin.y = scrollView.contentOffset.y - maxYOffsetForUnderScrollView;
self.containerView.bounds = scrolledBoundsForContainerView;
}
You will find that as scrollViewDidScroll is called every frame of animation that this faux scrolling of the contained views looks really natural.
But wait! I hear you say. That scroll view on top now intercepts ALL touches, and the views underneath it need to be touched as well. I have an interesting solution for that as well.
Set the scrollview on top to be off screen somewhere (i.e. set its frame off screen, but still the same size.) and then in your viewDidLoad method you add the scrollview's panGestureRecogniser to the main view. This will mean that you get all the iOS natural scrolling momentum and stuff without actually having the view on the screen. The contained scroll view will now probably go juddery as its pan gesture recognizer will get called as well (they work differently to UIEvent handling) so you will need to remove it.
- (void)viewDidLoad
{
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
[self.view addGestureRecognizer:self.scrollview.panGestureRecognizer];
[self.underScrollview removeGestureRecognizer:self.underScrollView.panGestureRecognizer];
//further code to set up content sizes and stuff
}
I had fun making this so heres a link to the sample project on github:
https://github.com/joelparsons/multipleScrollers
EDIT:
To show the scrollbar for the top scrollview when its off the screen no matter where you put it you can set the scrollIndicatorInsets to an inset created like this:
CGPoint scrollviewOrigin = self.scrollview.frame.origin;
self.scrollview.scrollIndicatorInsets = UIEdgeInsetsMake(-scrollviewOrigin.y,0,scrollviewOrigin.y,scrollviewOrigin.x);
*caveat that the scrollview still has to be the right height but I'm sure you get the idea.
And then to make the bar draw outside the scrollview's visible bounds you have to turn off clips to bounds
self.scrollview.clipsToBounds = NO;
OMG. jackslash, you saved my life.
In my case, I need to use three depth of scroll views.
Parent Scroll View
that has a scroll view as one of the children
Child Scroll View: shown as 'Explanation Scroll View / Review Table View / Information Scroll View' in the below image)
Hidden Scroll View
which is distribute own content offset to 'Parent Scroll View' and 'Child Scroll View'
which has content size of whole flatten contents
Screenshot of view hierarchy
After setting view hierarchy, I just need to sync whole flatten content size and distribute content offset properly.
Observable.combineLatest(
overviewStackView.rx.observe(CGRect.self, #keyPath(UIStackView.frame)).unwrap(),
explanationScrollView.rx.observe(CGSize.self, #keyPath(UIScrollView.contentSize)).unwrap()
)
.subscribe(onNext: { [weak self] overviewStackViewFrame, explanationScrollViewContentSize in
guard let self = self else { return }
let totalContentHeight = overviewStackViewFrame.height + self.segmentedControl.frame.height + explanationScrollViewContentSize.height
self.hiddenScrollView.contentSize.height = totalContentHeight
})
.disposed(by: disposeBag)
hiddenScrollView.rx.didScroll
.subscribe(onNext: { [weak self] _ in
guard let self = self else { return }
let currentHiddenScrollViewOffsetY = self.hiddenScrollView.contentOffset.y
let parentScrollViewMaxOffsetY = self.overviewStackView.frame.height
let expectedChildScrollViewOffsetY = max(currentHiddenScrollViewOffsetY - parentScrollViewMaxOffsetY, 0)
self.parentScrollView.contentOffset.y = min(parentScrollViewMaxOffsetY, currentHiddenScrollViewOffsetY)
self.explanationScrollView.contentOffset.y = expectedChildScrollViewOffsetY
})
.disposed(by: disposeBag)

Zoom a UIWebView like iOS Mail App

I'd like to recreate a view that you can zoom like the iPhone/iPad Mail app or Sparrow when viewing an email, where at the top there is block of information and then a UIWebView. I can obviously do this easily in interface builder or code, BUT I would like it behave like the Mail app.
By 'like the Mail App' I mean, when you pinch zoom (anywhere in the view), the UIWebView is the only view that actually zooms, and the top content stays the same size. When you zoom out too far and see the background the whole view zooms out (not just the UIWebview) and the whole view scrolls too.
I've done some experimenting and tried some of the suggestions already, like inserting the top view at the top of the UIWebView, extending the height of the UIWebView based on content size but this always ends up with either the top view zooming too, OR just the UIWebView.
I hope the makes some sense. It might be really simple but I've been trying to sort this for a while on and off that I can't see the wood for the trees any more.
This is for a MonoTouch app, but if anyone has Objective-C examples or anything I can convert and post back.
I have done just that for our application; it is not as simple as it sounds, but on iOS 5 it should be somewhat less complex than iOS 4.
Have a view of the top part you wish to have constant. When your web view finishes loading the HTML and renders it, get the scrollView of the web view, and add your view as a subview to that. Add the top view's frame height to the contentSize.height of the scroll view, and add the height to origin.y of the rest of subviews of the scroll view (those that are not your top view). Set your view controller as the delegate of the web view's scroll view. Whenever the user scrolls:
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
CGRect frame = contentView.frame;
if(scrollView.contentOffset.x < 0)
{
frame.origin.x = 0;
}
else if((scrollView.contentOffset.x + contentView.frame.size.width) > scrollView.contentSize.width)
{
frame.origin.x = scrollView.contentSize.width - contentView.frame.size.width;
}
else
{
frame.origin.x = scrollView.contentOffset.x;
}
[contentView setFrame:frame];
}
This should make it behave exactly like the mail.app view.

NSScrollView clipping overlaid UI elements

I have a button that sits on top of an NSScrollView, not within. When the scrollview scrolls, the button get's clipped with part of the button going along with the scrolling and the other part staying positioned.
To better describe the issue here's a video of the issue:
http://dl.dropbox.com/u/170068/ScrollTest.mov
The planned goal was to have a button sit in the top right corner of a text view but stay there when the text view scrolls. So if anyone has any thoughts on how to achieve this it would be greatly appreciated.
You should subclass NSScrollView and override "tile" method to position sub-controls of the scroll view.
- (void)tile
{
[super tile];
if (subControl)
{
NSRect subControlFrame = [subControl frame];
// adjust control position here in the scrollview coordinate space
// move controls
[subControl setFrame:subControlFrame];
}
}
I have used this way to implement a custom ScrollView with zoom control and background color selector embedded.
Overlapping views isn't recommended for non-layer-backed views. I think Interface Builder will even warn you about this. The easiest way to work around this would be to make your button layer-backed.