iTunes Song Title Scrolling in Cocoa - objective-c

Question

I have searched extensively and cannot for the life of me find any information about how to achieve a similar effect to that of the iTunes song title scrolling if the text is too large in Cocoa. I have tried setting the bounds on a NSTextField to no avail. I have tried using NSTextView as well as various attempts at using NSScrollView. I am sure I am missing something simple but any help would be greatly appreciated. I am also hoping to not have to use CoreGraphics if at all possible.
Example, notice the "Base.FM http://www." text has been scrolled. If you need a better example open iTunes with a song with a rather large title and watch it scroll back and forth.
I would think surely there is a simple way to just create a marquee type effect with an NSTextField and an NSTimer, but alas.

Answer 1

I can see how this would be difficult if you're trying to shoehorn the functionality into an exist control. However, if you just start with a plain NSView, it's not that bad. I whipped this up in about 10 minutes...
//ScrollingTextView.h:
#import <Cocoa/Cocoa.h>
#interface ScrollingTextView : NSView {
NSTimer * scroller;
NSPoint point;
NSString * text;
NSTimeInterval speed;
CGFloat stringWidth;
}
#property (nonatomic, copy) NSString * text;
#property (nonatomic) NSTimeInterval speed;
#end
//ScrollingTextView.m
#import "ScrollingTextView.h"
#implementation ScrollingTextView
#synthesize text;
#synthesize speed;
- (void) dealloc {
[text release];
[scroller invalidate];
[super dealloc];
}
- (void) setText:(NSString *)newText {
[text release];
text = [newText copy];
point = NSZeroPoint;
stringWidth = [newText sizeWithAttributes:nil].width;
if (scroller == nil && speed > 0 && text != nil) {
scroller = [NSTimer scheduledTimerWithTimeInterval:speed target:self selector:#selector(moveText:) userInfo:nil repeats:YES];
}
}
- (void) setSpeed:(NSTimeInterval)newSpeed {
if (newSpeed != speed) {
speed = newSpeed;
[scroller invalidate];
scroller == nil;
if (speed > 0 && text != nil) {
scroller = [NSTimer scheduledTimerWithTimeInterval:speed target:self selector:#selector(moveText:) userInfo:nil repeats:YES];
}
}
}
- (void) moveText:(NSTimer *)timer {
point.x = point.x - 1.0f;
[self setNeedsDisplay:YES];
}
- (void)drawRect:(NSRect)dirtyRect {
// Drawing code here.
if (point.x + stringWidth < 0) {
point.x += dirtyRect.size.width;
}
[text drawAtPoint:point withAttributes:nil];
if (point.x < 0) {
NSPoint otherPoint = point;
otherPoint.x += dirtyRect.size.width;
[text drawAtPoint:otherPoint withAttributes:nil];
}
}
#end
Just drag an NSView onto your window in Interface Builder and change its class to "ScrollingTextView". Then (in code), you do:
[myScrollingTextView setText:#"This is the text I want to scroll"];
[myScrollingTextView setSpeed:0.01]; //redraws every 1/100th of a second
This is obviously pretty rudimentary, but it does the wrap around stuff that you're looking for and is a decent place to start.

Answer 2

For anyone looking for this in Swift 4, I have converted Dave's answer and added some more functionality.
import Cocoa
open class ScrollingTextView: NSView {
/// Text to scroll
open var text: NSString?
/// Font for scrolling text
open var font: NSFont?
/// Scrolling text color
open var textColor: NSColor = .headerTextColor
/// Determines if the text should be delayed before starting scroll
open var isDelayed: Bool = true
/// Spacing between the tail and head of the scrolling text
open var spacing: CGFloat = 20
/// Amount of time the text is delayed before scrolling
open var delay: TimeInterval = 2 {
didSet {
updateTraits()
}
}
/// Length of the scrolling text view
open var length: CGFloat = 0 {
didSet {
updateTraits()
}
}
/// Speed at which the text scrolls. This number is divided by 100.
open var speed: Double = 4 {
didSet {
updateTraits()
}
}
private var timer: Timer?
private var point = NSPoint(x: 0, y: 0)
private var timeInterval: TimeInterval?
private(set) var stringSize = NSSize(width: 0, height: 0) {
didSet {
point.x = 0
}
}
private var timerSpeed: Double? {
return speed / 100
}
private lazy var textFontAttributes: [NSAttributedString.Key: Any] = {
return [NSAttributedString.Key.font: font ?? NSFont.systemFont(ofSize: 14)]
}()
/**
Sets up the scrolling text view
- Parameters:
- string: The string that will be used as the text in the view
*/
open func setup(string: String) {
text = string as NSString
stringSize = text?.size(withAttributes: textFontAttributes) ?? NSSize(width: 0, height: 0)
setNeedsDisplay(NSRect(x: 0, y: 0, width: frame.width, height: frame.height))
updateTraits()
}
}
private extension ScrollingTextView {
func setSpeed(newInterval: TimeInterval) {
clearTimer()
timeInterval = newInterval
guard let timeInterval = timeInterval else { return }
if timer == nil, timeInterval > 0.0, text != nil {
if #available(OSX 10.12, *) {
timer = Timer.scheduledTimer(timeInterval: newInterval, target: self, selector: #selector(update(_:)), userInfo: nil, repeats: true)
guard let timer = timer else { return }
RunLoop.main.add(timer, forMode: .commonModes)
} else {
// Fallback on earlier versions
}
} else {
clearTimer()
point.x = 0
}
}
func updateTraits() {
clearTimer()
if stringSize.width > length {
guard let speed = timerSpeed else { return }
if #available(OSX 10.12, *), isDelayed {
timer = Timer.scheduledTimer(withTimeInterval: delay, repeats: false, block: { [weak self] timer in
self?.setSpeed(newInterval: speed)
})
} else {
setSpeed(newInterval: speed)
}
} else {
setSpeed(newInterval: 0.0)
}
}
func clearTimer() {
timer?.invalidate()
timer = nil
}
#objc
func update(_ sender: Timer) {
point.x = point.x - 1
setNeedsDisplay(NSRect(x: 0, y: 0, width: frame.width, height: frame.height))
}
}
extension ScrollingTextView {
override open func draw(_ dirtyRect: NSRect) {
if point.x + stringSize.width < 0 {
point.x += stringSize.width + spacing
}
textFontAttributes[NSAttributedString.Key.foregroundColor] = textColor
text?.draw(at: point, withAttributes: textFontAttributes)
if point.x < 0 {
var otherPoint = point
otherPoint.x += stringSize.width + spacing
text?.draw(at: otherPoint, withAttributes: textFontAttributes)
}
}
override open func layout() {
super.layout()
point.y = (frame.height - stringSize.height) / 2
}
}
Reference gist:
https://gist.github.com/NicholasBellucci/b5e9d31c47f335c36aa043f5f39eedb2