FC2ブログ

頭と尻尾はくれてやる!

パソコンおやじのiPhoneアプリ・サイト作成・運営日記


macOSでのスクロールビュー NSScrollView の最小実装

macOSアプリでのスクロールビューをstoryboardを使って実装する方法。
なお、scrollViewに表示するオブジェクトはコードで作成する。

プロジェクト作成でできるView Controllerのviewに

LibraryでScroll Viewを選択する画像

↑LibraryでScroll Viewをドラッグ&ドロップ。

Scroll View追加時のファイル構成

↑ファイル構成はこんな感じでScroll View / Clip View / View という構成になる。
コード側ではこのClip Viewの参照を得ておく。↓
IBOutlet NSClipView *clipView;

↓3つのNSTextFieldオブジェクトを表示するコード。
- (void)viewDidLoad
{
    [super viewDidLoad];

    // self.viewの原点に表示
    NSTextField *tf1 = [[NSTextField alloc] initWithFrame:NSMakeRect(0, 0, 100, 20)];
    tf1.stringValue = @"text1";
    [self.view addSubview:tf1];
    
    // clipViewの原点に表示
    NSTextField *tf2 = [[NSTextField alloc] initWithFrame:NSMakeRect(0, 0, 100, 20)];
    tf2.stringValue = @"text2";
    [clipView.documentView addSubview:tf2];
    
    // clipViewのx,y=0,500に表示
    NSTextField *tf3 = [[NSTextField alloc] initWithFrame:NSMakeRect(0, 500, 100, 20)];
    tf3.stringValue = @"text3";
    [clipView.documentView addSubview:tf3];

    clipView.documentView.frame = NSMakeRect(0, 0, clipView.documentView.frame.size.width, 500+20);
}
表示したいオブジェクトは clipView.documentView に addSubview: する。
デフォだとスクロールするビューが大きくないのでスクロールしないが、clipView.documentView の frame プロパティを設定してやればスクロールする。

Scroll View表示結果

↑最初はこのように表示される。macOSでは通常左下原点なので0,0だと左下に表示されている。

スクロール後Scroll View表示結果

↑スクロールすると(0,500)の位置に文字列がある。


以上が最低限の実装だけど、スクロールするビューの座標が左下原点というのはなんともやりにくい。
表示するオブジェクトの数なんかが決まっていない場合はなおさら。
ということで左上原点にする方法。

@property(getter=isFlipped, readonly) BOOL flipped;

↑NSViewにはflippedというプロパティがある。これを真に指定すればいいんだけどこのプロパティはreadonlyだしstoryboardで簡単に設定、というわけにもいかない。
面倒だけどNSViewのサブクラスのファイルを作成する。ここではContentViewとした。

関連クラスを指定

↑storyboardでClip Viewの一つ下のViewを選択して連携するクラスにContentViewを指定してやる。
-(BOOL)isFlipped
{
    return YES;
}
↑ContentViewクラスの実装ファイル部分でオーバーライドしてYESを返すようにする。

上下反転したScroll Viewの表示結果

↑実行結果。y軸が反転して左上が原点になっている。


関連記事
macOSのNSScrollView上のマウスカーソルの位置を得る

<< Create MLで学習させmlmodelファイルを得る  TopPage  macOSアプリからFFmpegを使い複数の動画ファイルをクロップする >>

コメント


管理者にだけ表示を許可する
 

トラックバック

トラックバックURL
http://ringsbell.blog117.fc2.com/tb.php/1236-121fe80e




Copyright ©頭と尻尾はくれてやる!. Powered by FC2 Blog. Template by eriraha.

FC2Ad