WEBVTT

00:00:01.600 --> 00:00:03.720 align:middle
このビデオでは
インスペクタと

00:00:03.887 --> 00:00:04.750 align:middle
その使い方を示します。

00:00:05.230 --> 00:00:06.280 align:middle
インスペクタとは何でしょうか？

00:00:07.000 --> 00:00:09.840 align:middle
インスペクタはシステムのオブジェクトと

00:00:10.007 --> 00:00:10.920 align:middle
対話するためのツールです。

00:00:11.900 --> 00:00:15.210 align:middle
Pharo では全てのことが
オブジェクトによって書かれていて

00:00:15.377 --> 00:00:18.160 align:middle
Pharoを構成する全てのオブジェクトを
インスペクタで見ることができます。

00:00:18.810 --> 00:00:21.780 align:middle
インスペクタとは何かを
比喩で説明すると

00:00:21.947 --> 00:00:26.630 align:middle
インスペクタは顕微鏡です。
ただ、その顕微鏡は

00:00:26.797 --> 00:00:29.810 align:middle
観察する対象であるオブジェクトと

00:00:30.000 --> 00:00:32.300 align:middle
対話できる顕微鏡です。
あたかも生物学者が

00:00:32.467 --> 00:00:36.820 align:middle
細胞やバクテリアを研究するように

00:00:37.030 --> 00:00:39.080 align:middle
あなたも針の先で生きたバクテリアと

00:00:39.247 --> 00:00:42.780 align:middle
対話できるようなものです。

00:00:42.960 --> 00:00:45.290 align:middle
ちょっとした表現式を用意してあります。

00:00:47.080 --> 00:00:49.040 align:middle
実際には、日付や時刻や
「Morph」を1つの辞書に入れることは

00:00:49.207 --> 00:00:52.040 align:middle
あまりないでしょう。

00:00:52.350 --> 00:00:54.190 align:middle
しかし、これはあくまで
練習目的ということで。

00:00:54.630 --> 00:00:56.620 align:middle
これを見てください。

00:00:56.787 --> 00:01:01.450 align:middle
表現式を入力して
最初にすることは

00:01:01.617 --> 00:01:04.120 align:middle
インスペクタに乗せることです。
これでインスペクタを使えます。

00:01:05.240 --> 00:01:08.650 align:middle
見ての通り、
インスペクタは多態的なオブジェクトです。

00:01:08.817 --> 00:01:10.810 align:middle
インスペクタは何を表示しているでしょう？

00:01:11.080 --> 00:01:15.840 align:middle
ここには、オブジェクトの集まり(Collection)
の要素がいくつか表示されています。
several elements in my

00:01:16.007 --> 00:01:18.260 align:middle
要素の上でクリックする度に

00:01:18.427 --> 00:01:22.390 align:middle
別のインスペクタが開いて

00:01:22.557 --> 00:01:23.800 align:middle
選択された要素を表示します。

00:01:24.230 --> 00:01:28.060 align:middle
いいですか、GTインスペクタは

00:01:28.227 --> 00:01:32.800 align:middle
Pharo の新型のインスペクタで

00:01:33.000 --> 00:01:35.840 align:middle
ベルン大学の GT チームが
開発しました。

00:01:36.007 --> 00:01:36.640 align:middle
GTインスペクタは

00:01:36.807 --> 00:01:40.510 align:middle
見る対象とする個々の
オブジェクトに応じて

33 align:middle
00:01:40,677 --> 00:01:43,890
それぞれに適切な表示の仕方をします。

00:01:44.057 --> 00:01:46.840 align:middle
辞書をインスペクタで開いた時には

00:01:47.007 --> 00:01:50.440 align:middle
グラフィカルな要素を操作するのとは
同じ方法で表示されるべきではありません。

00:01:51.360 --> 00:01:54.440 align:middle
興味深い点はこれです。
これらの要素のそれぞれが

00:01:54.607 --> 00:01:56.640 align:middle
別の表示のビューを
ユーザーに提供するのです。

00:01:57.880 --> 00:01:59.760 align:middle
一番基本的なビューは
生(Raw)ビューと呼ばれるものです。

00:02:00.850 --> 00:02:03.800 align:middle
このビューは実装を表示します。

00:02:04.020 --> 00:02:07.350 align:middle
例えば、OrderedDictionary を
インスペクタで開くと

00:02:07.517 --> 00:02:12.400 align:middle
この OrderedDictionary クラスには

00:02:12.567 --> 00:02:16.060 align:middle
2つのインスタンス変数があります。
dictionary と orderedKeys です。

00:02:16.227 --> 00:02:19.780 align:middle
インスペクタは
これらのインスタンス変数の

00:02:19.947 --> 00:02:21.770 align:middle
生の値を表示します。

00:02:22.000 --> 00:02:25.640 align:middle
辞書をクリックすると
それが辞書だとわかります。

00:02:25.807 --> 00:02:29.360 align:middle
この辞書をクリックしたら
ほら、ここにあるように、これは辞書です。

00:02:30.550 --> 00:02:34.000 align:middle
そして開いた先では
同様にこのオブジェクトの生のビューが見えます。

00:02:34.760 --> 00:02:37.500 align:middle
orderedKeysは
見ての通り配列です。

00:02:38.760 --> 00:02:41.080 align:middle
この配列には
時刻、日付、そしてMorphが格納されています。

00:02:44.270 --> 00:02:47.170 align:middle
Items モードにすると

00:02:48.860 --> 00:02:53.220 align:middle
この OrderedDictionaryの要素を

00:02:53.387 --> 00:02:56.590 align:middle
キーと値として見せてくれます。
このほうがわかりやすいです。

00:02:56.757 --> 00:02:59.100 align:middle
これを見れば
そのオブジェクトの中身に入っていって

00:02:59.267 --> 00:03:01.950 align:middle
その感触を得ることができます。

00:03:02.117 --> 00:03:03.870 align:middle
さあどうしましょう。
これは何でしょう。

00:03:04.037 --> 00:03:07.040 align:middle
ああ、これは6番目に格納されていて

00:03:07.450 --> 00:03:11.430 align:middle
時刻と関連つけられていて
キーと値があって、などなど

00:03:11.597 --> 00:03:16.080 align:middle
インスペクタでブラウズしていく
ことができます。

00:03:16.410 --> 00:03:17.930 align:middle
この小さなブラウジング・バーで

00:03:18.220 --> 00:03:22.260 align:middle
小さな○印にカーソルを置いて

00:03:22.427 --> 00:03:24.270 align:middle
プレビューすることができます。
クリックすれば、そこに移動します。

00:03:25.130 --> 00:03:28.060 align:middle
また、ウィンドウのサイズや

00:03:28.510 --> 00:03:31.510 align:middle
フォーカスを変えることができます。

00:03:31.720 --> 00:03:35.220 align:middle
例えば3つ選択して
サイズを大きくすれば

00:03:35.387 --> 00:03:36.590 align:middle
ほら、見易くなります。

00:03:37.680 --> 00:03:42.460 align:middle
Itemsモードでは

00:03:42.627 --> 00:03:44.300 align:middle
対話できるのでこのほうが良いです。

00:03:44.467 --> 00:03:47.570 align:middle
ここで、日付のキーと値がありますね。
たとえば

00:03:47.737 --> 00:03:52.330 align:middle
選択すれば日付が見えます。
この場合、インスタンス変数が見える

00:03:52.620 --> 00:03:54.550 align:middle
生(raw)の表示です。

00:03:54.820 --> 00:03:58.260 align:middle
「self browse」としたらどうなるか
だいたい想像できるでしょう。

00:03:58.427 --> 00:04:03.220 align:middle
Timespan(時間帯)、Date（日付)を
ブラウズできます。

00:04:03.690 --> 00:04:05.000 align:middle
なので
start(開始)とduration(期間)があります。

00:04:06.810 --> 00:04:07.710 align:middle
確かに
startとdurationがありますね。

00:04:09.000 --> 00:04:11.730 align:middle
Details(詳細)タブを見れば

00:04:15.040 --> 00:04:19.390 align:middle
日付には

00:04:19.557 --> 00:04:24.280 align:middle
year(年)、month(月)などがあり

00:04:24.447 --> 00:04:25.420 align:middle
例えばISO形式で見ることができます。

00:04:27.150 --> 00:04:28.000 align:middle
どんな仕組みになっているのでしょう？

00:04:28.147 --> 00:04:29.730 align:middle
それは別のビデオで紹介します。
ただ、それぞれのオブジェクトが

00:04:30.370 --> 00:04:33.050 align:middle
インスペクタでどんな面を見せるのかを

00:04:33.760 --> 00:04:35.430 align:middle
決めています。

00:04:36.230 --> 00:04:37.640 align:middle
例えば、カレンダーがあります。

00:04:37.807 --> 00:04:42.330 align:middle
日付のグラフィカルな表示もできるのです。

00:04:44.400 --> 00:04:45.400 align:middle
戻ります。

00:04:48.570 --> 00:04:52.020 align:middle
同じように、時刻についても
同様のものを見ることができます。

00:04:52.560 --> 00:04:56.200 align:middle
生(raw)タブはもうお見せしました。

00:04:57.440 --> 00:04:58.540 align:middle
Metaタブというものもあります。

00:04:59.840 --> 00:05:03.480 align:middle
これは小さなコードブラウザで
メソッドを表示することができます。

00:05:03.647 --> 00:05:06.770 align:middle
例えばこうやってメソッドを見ることができます。

00:05:06.937 --> 00:05:11.410 align:middle
日付や時刻と対話をしたい場合に

00:05:11.840 --> 00:05:15.310 align:middle
どんなメッセージを送ることができるか
わからないという状況を想像してみましょう。

00:05:15.477 --> 00:05:17.000 align:middle
もしかしたら、「hours」を
送ることができるかもしれません。

00:05:17.137 --> 00:05:21.500 align:middle
18が返ってきました。18時です。

00:05:22.350 --> 00:05:25.780 align:middle
「hour」を探しているのであれば
普通はここにあるかどうかでわかります。

00:05:27.540 --> 00:05:30.900 align:middle
メソッドの定義を見ることができます。

00:05:31.067 --> 00:05:32.550 align:middle
インスペクタのフローについては
まだまだあります。

00:05:34.140 --> 00:05:36.000 align:middle
Morphを見てみましょう。

00:05:37.940 --> 00:05:39.130 align:middle
Morphはもっと複雑なオブジェクトです。

00:05:39.297 --> 00:05:42.300 align:middle
色々な側面があります。

00:05:43.000 --> 00:05:44.660 align:middle
何が良いかというと
例えば

00:05:44.827 --> 00:05:46.620 align:middle
Morphをクリックしたら
その描画を見ることができます。

00:05:48.190 --> 00:05:52.640 align:middle
ここで描画を見せているのは

00:05:52.900 --> 00:05:57.330 align:middle
HSVAColorSelectorMorphというMorphです。

00:06:02.720 --> 00:06:04.720 align:middle
このオブジェクトと対話できるということを

00:06:04.887 --> 00:06:06.560 align:middle
お見せしましょう。

00:06:07.100 --> 00:06:11.470 align:middle
このMorphにopenInWorldで
開くように言うことができます。

00:06:11.637 --> 00:06:13.270 align:middle
また、対話することができます。

00:06:16.870 --> 00:06:21.390 align:middle
その対話は
オブジェクトがどのような機能を

00:06:22.000 --> 00:06:26.560 align:middle
提供するかによります。

00:06:26.727 --> 00:06:29.090 align:middle
selectedColorすることができます。
ちゃんと動きます。

00:06:29.890 --> 00:06:30.590 align:middle
「self selectedColor」すれば

00:06:30.757 --> 00:06:35.590 align:middle
色が返ってきます。

00:06:36.000 --> 00:06:39.000 align:middle
面白いことに

00:06:39.700 --> 00:06:42.360 align:middle
インスペクタの中でprintさせれば

00:06:42.527 --> 00:06:44.260 align:middle
テキスト形式で表示されます。

00:06:44.940 --> 00:06:49.080 align:middle
inspectすれば

00:06:49.740 --> 00:06:51.760 align:middle
インスペクタが開きます。

00:06:51.927 --> 00:06:52.690 align:middle
それが今ここで私がやっている操作です。

00:06:52.857 --> 00:06:55.000 align:middle
この表現式の結果を

00:06:55.167 --> 00:07:00.080 align:middle
インスペクタのフローの中に
入れたいのであれば

00:07:00.247 --> 00:07:01.000 align:middle
どうすればいいでしょう？

00:07:01.137 --> 00:07:03.190 align:middle
「Do it and go」をします。

00:07:03.610 --> 00:07:08.360 align:middle
「Do it and go」をすると
対話のフローの中に

00:07:08.790 --> 00:07:11.010 align:middle
新しいオブジェクトと
そのインスペクタを追加します。

126 align:middle
00:07:11,530 --> 00:07:15,620
おわかりでしょうか。
ここに色のコードがあります。

00:07:16.580 --> 00:07:17.500 align:middle
別に特別なことではありません。

00:07:21.800 --> 00:07:24.250 align:middle
戻ります。

00:07:26.570 --> 00:07:31.110 align:middle
ここで興味深いのは

00:07:31.277 --> 00:07:33.820 align:middle
オブジェクトのビューがあります。
Submorph(Morphの部品)です。

00:07:36.000 --> 00:07:38.500 align:middle
同じビューが必要で

00:07:38.667 --> 00:07:42.180 align:middle
このグラフィカルなオブジェクトを構成する
部品を探したい時には

00:07:42.347 --> 00:07:47.030 align:middle
Rawモードでは
グラフィカルな部品のツリー構造の

00:07:47.200 --> 00:07:52.050 align:middle
内部を辿っていかなければなりません。

00:07:53.130 --> 00:07:54.280 align:middle
それは本当に面倒なことです。

00:07:55.080 --> 00:07:57.760 align:middle
そこでいい小技をお教えしましょう。

00:07:59.190 --> 00:08:03.660 align:middle
Morphのツリーがあったとして

00:08:05.550 --> 00:08:08.640 align:middle
同じオブジェクトの同じビューが2つ
あったとします。

00:08:11.160 --> 00:08:12.820 align:middle
ここで「Submorph」することができます。

00:08:13.530 --> 00:08:16.540 align:middle
こちらをSubmorphにして
もう一方はMorphにします。

00:08:16.830 --> 00:08:20.520 align:middle
ツリーの要素を選択すると

00:08:22.230 --> 00:08:25.610 align:middle
「あちら側ではこれだけを表示してくれ」

00:08:25.777 --> 00:08:30.590 align:middle
という意味になり

00:08:30.757 --> 00:08:35.290 align:middle
選択されたものと対応する部品が
表示されるようになります。

00:08:36.360 --> 00:08:38.900 align:middle
この小技はけっこう強力で
小さなインジケーターに対応する

00:08:39.100 --> 00:08:43.350 align:middle
部品を探さなければならないことが
よくあります。

00:08:43.517 --> 00:08:48.480 align:middle
この技を使えばけっこう簡単になります。
ほら、これです。

00:08:50.440 --> 00:08:54.850 align:middle
しかし、昔からあるモードでは

00:08:55.017 --> 00:08:58.130 align:middle
そう簡単には見つかりません。

00:08:58.297 --> 00:08:59.350 align:middle
実際、いい方法が見つかりません。

00:08:59.517 --> 00:09:02.270 align:middle
とりあえずツリーの中を探し回って

00:09:05.440 --> 00:09:06.960 align:middle
見つけることになります。

00:09:07.470 --> 00:09:12.060 align:middle
なぜかというと

00:09:12.227 --> 00:09:12.860 align:middle
単純なオブジェクトだからです。

00:09:14.500 --> 00:09:16.530 align:middle
別のビデオでお見せしますが

00:09:16.697 --> 00:09:20.680 align:middle
この種の操作は
システムのどのオブジェクトにも使えます。

00:09:21.370 --> 00:09:23.530 align:middle
そのビデオではこの操作を

00:09:23.697 --> 00:09:27.850 align:middle
ファイルシステムやクラス自体に
行います。

00:09:28.160 --> 00:09:30.040 align:middle
まとめると

00:09:30.207 --> 00:09:32.560 align:middle
インスペクタは

00:09:32.727 --> 00:09:37.230 align:middle
生きたオブジェクトに話しかけ対話し
そして変更するためのオブジェクトです。

00:09:37.397 --> 00:09:41.010 align:middle
それぞれのオブジェクトは

00:09:41.177 --> 00:09:45.730 align:middle
それぞれに異なる側面やビューを持っていて

00:09:45.897 --> 00:09:48.260 align:middle
シナリオに応じて

00:09:48.427 --> 00:09:51.640 align:middle
それぞれの対話をします。

00:09:51.807 --> 00:09:53.760 align:middle
とても強力なオブジェクトです。

00:09:54.190 --> 00:09:56.290 align:middle
実際に、GTインスペクタは
本当に素晴らしいツールなのです。

