How to hide NSCollectionView Scroll indicator

Question

I have an NSCollectionView and I would like to hide the horizontal scroll indicators.

I've tried

        collectionView.enclosingScrollView?.verticalScroller?.isHidden = true

But it is not working.

Thank you in advance.

try this line of code. collectionView.enclosingScrollView?.horizontalScroller?.isHidden = true — aBilal17, Apr 09 '18 at 07:56
Have you figured this out? I have the same problem but unchecking the "Show xyz Scroller" does not remove the scroll indicator. I think the NSCollectionViewFlowLayout might add the indicator again. — afi, May 08 '18 at 12:01

score 7 · Answer 1 · answered Nov 21 '18 at 22:45

hidden didn't work for me too.

The only way I found to hack this, is by changing inset:

(scrollViewCollectionView is of type NSScrollView, this example is while creating NSCollectionView programmatically)

scrollViewCollectionView.documentView?.enclosingScrollView?.scrollerInsets = NSEdgeInsets.init(top: 0, left: 0, bottom: 100, right: 0)

Please note: My NSCollectionView is horizontal, and less then 100 height, this is why this hack resolved in a hidden indicator.

This gets rid of the scroller button, but not the gutter for the scrollbar. — Z S, Apr 04 '19 at 20:24

score 3 · Answer 2 · edited Jun 28 '21 at 19:33

Override hasHorizontalScroller or horizontalScroller to false and nil will cause NSScroller not to be displayed, and NSScrollView will not respond to scroll events.

This means that you can't scroll through NSScrollView's many scrolling methods.

When hasHorizontalScroller = true, horizontalScroller != nil will cause a drawing error.

 class MyScrollView : NSScrollView {

    // !!! Don't use this !!!
    override var hasHorizontalScroller: Bool {
        get {
            // return false will cause NSScroller not to be displayed
            // and NSScrollView will not respond to scroll events,
            // this means that you can't scroll through NSScrollView's many scrolling methods.
            false
        }
        set {
            super.hasHorizontalScroller = newValue
        }
    }

    // !!! Don't use this !!!
    override var horizontalScroller: NSScroller? {
        get {
            // return nil will cause NSScroller not to be displayed,
            // but it still occupies the drawing area of the parent view.
            nil
        }
        set {
            super.horizontalScroller = newValue
        }
    }
}

wrong usage preview1

wrong usage preview2

This is the way to hide NSScroller and respond to scroll events correctly. Only useful in versions above 10.7:

class HiddenScroller: NSScroller {

    // @available(macOS 10.7, *)
    // let NSScroller tell NSScrollView that its own width is 0, so that it will not really occupy the drawing area.
    override class func scrollerWidth(for controlSize: ControlSize, scrollerStyle: Style) -> CGFloat {
        0
    }
}

score 2 · Answer 3 · answered Sep 10 '19 at 03:39

Create an outlet for the ScrollView which contains the CollectionView as seen here. I've named mine @IBOutlet weak var collectionViewScrollView: NSScrollView!
in viewDidAppear() function add:

collectionViewScrollView.scrollerStyle = .legacy collectionViewScrollView.verticalScroller?.isHidden = true - for vertical scroll collectionViewScrollView.horizontalScroller?.isHidden = true - for horizontal scroll

For some reason, in my case it only works if I set the collectionViewScrollView.scrollerStyle to .legacy. Not sure why, but it works.

It worked for me, Its easy to close indicators for `NSCollectionView` but it extends from `NSScrollView` so it makes closed of its indicators. — eemrah, Jun 09 '20 at 13:23

score 1 · Answer 4 · answered May 15 '18 at 21:28

1

Setting "Show Vertical Scroller" or "Show Horizontal Scroller" in storyboard doesn't remove the scrollers without setting constrains (height and width) of Bordered Scroll View of Collection View. After I did that and unchecked "Show Vertical Scroller" and "Show Horizontal Scroller" in Attributes Panel in storyboard they disappeared.

answered May 15 '18 at 21:28

Gypsie

78
6

Where exactly should I put the constraints?. The scrollView of the collection view already have leading, trailing, top, bottom constraints. – Jonathanff May 18 '18 at 17:57
do width and height on the scrollView – Gypsie May 21 '18 at 18:09

score 1 · Answer 5 · edited Mar 31 '20 at 02:38

I got same problem and just solve it. You can write your own custom NSScrollView and override 2 stored property: hasHorizontalScroller, horizontalScroller, and 1 function scrollWheel(with:). Here's my code:

class MyScrollView: NSScrollView {
    override var hasHorizontalScroller: Bool {
        get {
            return false
        }
        set {
            super.hasHorizontalScroller = newValue
        }
    }

    override var horizontalScroller: NSScroller? {
        get {
            return nil
        }
        set {
            super.horizontalScroller = newValue
        }
    }
    //comment it or use super for scrroling
    override func scrollWheel(with event: NSEvent) {}
}

And don't forget to set Border Scroll View class to MyScrollView in .xib or storyboard. Enjoy it!

tryKuldeepTanwar · Answer 6 · 2018-04-09T06:08:41.540

0

You can also achieve that via storyboard

edited Apr 09 '18 at 06:08

answered Apr 09 '18 at 04:50

tryKuldeepTanwar

3,490
2
19
49

Xcode throws "'hidden' has been renamed to 'isHidden'" – Jonathanff Apr 09 '18 at 05:35
1

On the storyboard those are already unchecked and scrolling indicator is still visible – Jonathanff Apr 09 '18 at 15:16

score 0 · Answer 7 · answered Jan 06 '19 at 15:12

0

I also meet the same problem. MCMatan is right. Please adjust the position of scroller to some place invisible.

scrollView.scrollerInsets = NSEdgeInsets.init(top: 0, left: 0, bottom: -10, right: 0)

answered Jan 06 '19 at 15:12

anergy7

1
5

gandhi Mena · Answer 8 · 2019-10-31T00:46:30.737

0

for Swift 4 & 5 in UIKit:

for Horizontal:

collectionView.showsHorizontalScrollIndicator = false

For Vertical:

collectionView.showsVerticalScrollIndicator = false

edited Oct 31 '19 at 00:46

answered Jun 18 '19 at 15:59

gandhi Mena

2,115
1
19
20

2

This is UIKit. The question was about AppKit – hnh Oct 26 '19 at 12:29
Thanks this is just what I was looking for! – Dave Dempsey Dec 09 '20 at 15:56

score 0 · Answer 9 · answered Sep 19 '20 at 06:05

In my case, the horizontal and vertical scroller of the collection scroll view are only hidden if do exactly as follow:

1. In Interface Builder.
1.a. Select Scroll View —> Attributes Inspector:
    + Uncheck Show Horizontal Scroller.
    + Uncheck Show Vertical Scroller.
    + Uncheck Automactically Hide Scroller.
1.b. Select Size Inspector:
    + Uncheck Automatically Adjust.
1.c. Select Clip View —> Size Inspector:
    + Uncheck Automatically Adjust.
2. In code do exactly as follow:

[self.scrollView setBackgroundColor:[NSColor clearColor]];
[self.scrollView setBorderType:NSNoBorder];
[self.scrollView setHasVerticalScroller:NO];
[self.scrollView setHasHorizontalScroller:NO];
[self.scrollView setAutomaticallyAdjustsContentInsets:NO];
[self.scrollView setContentInsets:NSEdgeInsetsMake(0.0, 0.0, -NSHeight([self.scrollView horizontalScroller].frame), -NSWidth([self.scrollView verticalScroller].frame))];
[self.scrollView setScrollerInsets:NSEdgeInsetsMake(0.0, 0.0, -NSHeight([self.scrollView horizontalScroller].frame), -NSWidth([self.scrollView verticalScroller].frame))];
[self.scrollView setScrollEnable:NO];

NSClipView *clipView = (NSClipView *)[self.scrollView documentView];

if ([clipView isKindOfClass:[NSClipView class]])
{
    [clipView setAutomaticallyAdjustsContentInsets:NO];
    [clipView setContentInsets:NSEdgeInsetsZero];
}

Then the NSCollectionView will fit to the Clip View as same width and height without the horizontal and vertical scrollers.

score 0 · Answer 10 · answered Feb 07 '21 at 20:42

0

If someone still needs it, this one trick should work

collectionView.enclosingScrollView?.horizontalScroller?.alphaValue = 0.0

answered Feb 07 '21 at 20:42

Alexander Dadukin

504
3
12

How to hide NSCollectionView Scroll indicator

10 Answers10