» jp.Tutorial IOBoxes
This site relies heavily on Javascript. You should enable it if you want the full experience. Learn more.

jp.Tutorial IOBoxes

English | French | Russian | Italian | Korean | Mandarin

このチュートリアルは、既にチュートリアルIIIのSpread them Dataを読んでいるものとして進めます。

データ型ごとのIOBox

Hello Worldのチュートリアルでは、右ダブルクリックからデータ型が数値のIOBox (Value Advanced)を作りました。このIOBoxは、他の全てのデータ型にも用意されています:

名前から想像できると思いますが、IOBoxのIOとは入出力(Input/Output)を示しています。これらのノードは2つの場面で役に立ちます。1つは実行中のプログラムへユーザがデータを入力する手段として、もう1つは実行中のプログラムからデータを取り出す、または表示するかです。

共通の特徴

こちらをやってみましょう:全てのIOBoxを選択して、マウスカーソルが変化するまでどれか1つの下か右端まで移動します。これでウィンドウの大きさを変えるようにIOBoxの大きさを変更できます。全てのIOBoxの大きさが同時に変わります。CTRLキーを押しながらドラッグすると一方向の大きさだけが変化します。

IOBox (Node)(少しだけ特殊なIOBox)を除いて、全てのIOBoxはいくつかの共通項目があります。IOBox (Node)以外のIOBoxを選択し、inspektorを見てください。

ここでは表示するフォントの種類とサイズを変更できます。ただ、もっと興味を引くのは、Columns(列), Rows(行), Pages(ページ)のピンです。Rowsに3を入力して、3行にしてみましょう。おや、入力箇所(スライス)が2つ分増えたようですが、何も見えません。なぜなら、SliceCount ModeInputのままになっているからです。これはIOBox自身の入力データのスライス数に合わせることを指しています。何もつながっていない初期状態のIOBoxのスライス数は1です。

SliceCount ModeColsRowsPagesに変更すると、新たに2つのスライスが表示され、個別に編集できることがわかります。IOBoxの出力ピンにカーソルを重ねると、ツールチップの右端に(3)という表示が確認できます。これは、IOBoxから3つのスライスを持ったspreadが出力されていることを表します。

Inspektor上で、Show SliceIndexShow Gridを有効にし、列やページをいくつか追加してみましょう。

行と列は確認できますが、ページは見えないことに気づくでしょう。ただし、IOBoxの出力ピンにカーソルを重ねるとページの数もカウントされているように見えます。IOBoxにおいて、SliceCount ModeColsRowsPagesの場合のスライス数は常に行x列xページです。他のページの値を見るにはSliceOffsetを変更します。sliceindexを使えばspreadの見ている場所を知るのに役立ちます。

IOBoxでspreadの中身を表示する場合、SliceCount Modeは初期値のInputのままで大丈夫です。ColumnsRowsのピンを使って表示したいスライスの最大数をセットします。

このスクリーンショットでは、ランダムに生成した100色のスライスを4列25行のIOBox (Color)で表示しています。

ビデオチュートリアルには関連する2つのチュートリアル(Tutorial 10Tutorial 11)があります。

スライダー、ボタン、リスト、...

もしもスライダーやボタンといったインタフェースの要素を探しているなら、IOBoxがそれらの役割を果たしてくれます。

たとえば、IOBox (Value Advanced)だけを選んでInspektorを見ると、もっとたくさんのピンで構成されているのがわかります。これらの全てを説明するにはこのチュートリアルだけでは足りないので、IOBoxのヘルプパッチ(HelpPatch)を見ると良いでしょう。

ただし、スライダーやボタンで遊ぶよりも人生でもっと重要なことに集中すべきと考えるのであれば、Spread them Data IIに進みましょう。

anonymous user login

Shoutbox

~3d ago

skyliner: the vcard page is assembled by personal settings + user page

~3d ago

lasal: thank you guys but this is to edit the user data, i don't find how to edit the vcard

~3d ago

CeeYaa: @lasal - haha nice - I think it's funny - you should keep it ;) to change - HOME-SETTINGS - PERSONAL SETTINGS

~3d ago

skyliner: @lasal: here?

~3d ago

lasal: who knows how to edit the vcard?

~3d ago

joreg: get started with #vl with this first part of a series of "vl for vvvv users" tutorial: https://discourse.vvvv.org/t/vl-for-vvvv-users-key-differences-1-5/15919 #vvvv

~3d ago

joreg: speak japanese? this looks like a great resource for #vvvv tipsntricks: https://qiita.com/advent-calendar/2017/vvvv