PPMElasticTabView

ダウンロード:PPMElasticTabView.zip(44KB)

昨日の「Kaku 1.2 予告」で、「ブログ設定パネルが、内容に応じて伸縮するようになった」というようなことを書きましたが、それに使っているのがコレです。

要は、Pages などのインスペクタにみられるような、アニメーションしながら(内包されているウィンドウもろとも)伸縮するタブビュー を実現します。詳しい使い方は以下。

これを実現するために、様々なアプローチを考えましたが、結局「タブビューアイテムの(コンテント)ビューと、その中に配置しているコントロール(ボタンやテキストフィールドなど)の間に、もう1個ビューを挟む」という、作る側(おい)にとっても、使う側にとっても平易(安易?)な方法に落ち着きました。その代わり、増えたビューの分、余計なメモリを使います。

使い方

(そういえば、これまでご説明していませんでしたが、こうしたカスタムクラスを自分のプロジェクトで使う方法から知りたい方は、僕の説明でよければ、ご一報を。)

  1. Interface Builder で、お好みのタブビューのクラスを PPMElasticTabView に変更してください(Command + 5)。
  2. もしタブの中に、すでにコントロールを設置している場合は、それらを 何らかのビューに内包 させてください。具体的には、すべてのコントロールを選択して、「Layout」→「Make subviews of」→「Custom View」してください。(この時点で、タブ直下には、このビュー1つだけ、という状態にしておいてください。PPMElasticTabView は、このビューを基準に動作するからです)
  3. その Custom View を、実行時に表示したいサイズに調整 します。位置は強制的に動かされるので、気にしなくてもいいです。
  4. 「ユーザーが自由にリサイズできるインスペクタパネル」は、個人的にはお勧めしません(他でもあまり使われていないと思う)が、PPMElasticTabView では、それにも対応しています。もし PPMElasticTabView を内包しているパネルがリサイズ可能な設定にしてあるなら、タブの中のコントロールも、それに対応できるよう、オートリサイズの設定をしてあげてください。
  5. あとはアプリをビルドし直して起動すれば、パネルがにょきにょき動くようになっているはずです。

※ 僕は試していませんが、Aqua Tabsを併用すれば、本当に Pages などのインスペクタ風にできるかもしれません。ただし、PPMElasticTabView はコーディング不要ですが、Aqua Tabs は自分でコードを調整する必要があります。

ご注意

  • ご利用は、自己責任にて、お願いします。

再配布等について

  • いつも通り、僕と他の方に迷惑がかからない限り、なんでもご自由にどうぞ。
  • 改善されたら、できれば教えてください。

これまで公開してきたコード

ちょっと増えてきたので、サイトに新しいセクションを作った方がいいかもしれませんが、他にもこんなコードを公開しています。よろしければどうぞ:

  • PPMTabView(名前紛らわしいな)— スライドアニメーションするタブビュー。
  • PPMDateCell — Mail.app の「受信日時」欄と同様の動作をする、(ちょっと)スマートな日付表示用セル。

Leave a Reply

Your email address will not be published. Required fields are marked *