カスタムビューをドラッグしてウィンドウにドロップ
Interface Builderのライブラリパレットの中からカスタムビューを探し出して、ウィンドウにドロップして下さい。Layout Viewsグループの中に入っています。
最終的にこんな配置にしました。テーブルビューの横幅を少し縮めて、そこにカスタムビューを配置しています。またテキストフィールドを縮めて空けたスペースにスライダーを配置しています。Fetchボタンは不要なので削除しました。

カスタムビューの設定
カスタムビューの設定について説明します。まずクラスを指定します。クラス名は発振器出力を表示するOscillatorViewです。
これを設定すると、上の図の様にウィンドウ上の表示がCustomViewからOscillatorViewに変わります。
次にアウトレットを接続します。controllerアウトレットをOscillatorエンティティを管理するNSArrayControllerに接続します。
controller行の右端にある丸をクリックし、マウスボタンを押したままドラッグすると線がのびていきます。nibウィンドウのOscillatorsアイコンの上でマウスボタンを離すと、アウトレットが接続されます。
右の図はアウトレットが接続された状態です。間違って接続してしまった場合は、Oscillatorsの左にあるバツ印をクリックすれば切り離せます。
サイズは120×120としました。またここではAutosizingの設定もしておきます。これは自分を包むビューのサイズが変化した時に、それに連動して自分のサイズをどう変化させるのかという設定です。
Autosizing欄の左側にある赤い部分をクリックして設定します。その右のアニメーションは設定の結果を反映していますので、どこがどういった意味を持っているのかは実際にいじってみればすぐわかります。
OscillatorViewはウィンドウの上下左右に対する距離を固定、幅とサイズを可変とする設定にしました。ウィンドウのリサイズに応じて伸び縮みする設定です。
テーブルビューの設定
テーブルビューの設定はそれほど大きく変えていません。Alternating Rowsをチェックして、一行ごとに色がつく様にした事と、SelectionのMultipleのチェックを外して複数選択ができない様にした程度です。
なお、ウィンドウ上のテーブルビューを一回クリックした時点で選択されるのはスクロールビューなので、もう一回クリックしてテーブルビューを選択して下さい。右の図の一番上に"Table View Attributes"と表示されるので、何が選択されているかわかります。
更にクリックするとヘッダやカラムを選択する事ができます。
Autosizingの設定は、テーブルビューではなく、そのスーパービューであるスクロールビューに対して行ないます。
OscillatorViewの横幅を可変にしたので、こちらの横幅は固定にします。それ以外はOscillatorViewと同じ設定です。
スライダーの設定
スライダーのバインディング設定はテキストフィールドと同じにしておけばOKです。
右はAmplitudeスライダーの設定です。Frequency, Phase Lagスライダーの設定はModel Key Pathの部分をそれぞれfrequencyとphaseLagにします。
これはキーパスですから、アクセサメソッド名に対応させるという事です。
スライダーのAutosizingは横幅可変、ウィンドウの上下左右に対する距離を固定とする設定にします。

ホーム
前へ