vvvv入門4

今回はvvvvで非常に重要なSpreadという複製を行うノードを使ってみます。

いつものようにQuadとTransformを置いておき、新しくLinearSpreadノードを出してください。

f:id:castlejou:20140913161224j:plain

Spread Countを3にしてTranslateXにつなげてみましょう。

f:id:castlejou:20140913161305j:plain

 

....微妙ですね。

ScaleXとScaleYをうまく調節してみてください。

f:id:castlejou:20140913161516j:plain

するとQuadがX方向に複製されていることがわかりますね。

あとはWidthを触ってみましょう。

同じものをTranslateYにもつなげてみると...

f:id:castlejou:20140913163651j:plain

こんな感じ。

え?これじゃないの!?

f:id:castlejou:20140913163833j:plain

と思った方、僕も初めは思いました。

 

タイルやルービックキューブみたいににするには少し頭を使わなければならないので次回解説します。

 

気を取り直して画面を初期に戻して、今度はまた新しいノードCircularSpreadを出してください。

f:id:castlejou:20140913164428j:plain

 

OutputX,YをTranslateX,Yに繋げ、Spread Countを上げます。

f:id:castlejou:20140913164611j:plain

自分でWidthとHeightを触ってみましょう。

ちなみにこのノードのFactorやPhase、TransformのRoll等の回転に関するピンは0~1で一周する物が多いです。LFOで扱いやすいですね。

 

最後にまた画面を初期化しRandomSpreadを出します。

f:id:castlejou:20140913170459j:plain

 

まずは以下のようにパラメータをいじってTranslateXに繋げます。Widthが2とは画面全体(-1~1)の事です。

f:id:castlejou:20140913170434j:plain

Randomに複製されているのがわかります。それでは選択し、Ctrl+Dで複製しTranslateYに繋げます。

f:id:castlejou:20140913170753j:plain

 

Randomじゃないですね。そうです、Seedを与えていませんもの。

f:id:castlejou:20140913170854j:plain

X,Yに異なるSeedに適当に値を入れてやることで、Randomに配置されました。

 

実際にはLFOのCyclesを使うことが多いです。

f:id:castlejou:20140913171210j:plain

アニメーションになりましたがまだあまり面白くないですね。

 

そこでDamperというこれも非常に重要なノードを使います。これは離散値(とびとびの値)を連続値(なめらかな値)にしてしまうノードです。

なにはともあれ使ってみましょう。

f:id:castlejou:20140913171653j:plain

少しそれっぽいですね(笑)

次回はLinearSpreadをもう少し突っ込んで解説していきます。

それでは今回はこの辺で。

 

vvvv入門3

今回は色やテクスチャをいじっていきたいと思います。

vvvvでの色の指定にはRGBHSV、HSL方式がありますが扱いやすいHSVを使っていきます。

・これらの違いはMicrosoftこちらで解説されています。

 

それでは画面にQuadを表示させて、新しいノードHSV(Color Join)を出してください。

f:id:castlejou:20140911134038j:plain

 

ピンをつなげ、HSVのピンを適当にいじって色が変わるのを確認してみましょう。

f:id:castlejou:20140911134438j:plain

ほう、汚い色ができました(笑)

 

もう少しわかりやすくするために右ダブルクリックから数値のIOBoxを三つ、同様に色のIOBoxを一つ出してつなげてみましょう。

f:id:castlejou:20140911134849j:plain f:id:castlejou:20140911135424j:plain

数値を適当にいじってみるとさらに汚い色ができました(笑)

 

一旦色を初期値にしましょう。vvvvではノードの初期化をAlt+右クリックで行うことができるので、三つの数値に試します。

 

ではHSVのSaturationピンを1にして(数値を1以上にすると勝手に1になる)LFOノードを出しHueピンに繋ぎます。

f:id:castlejou:20140911140250j:plain

少しきれいですね。変化が速いのでLFOの周期をPeriodピンを大きくして変えておきます。

f:id:castlejou:20140911140437j:plain

 

色はこの程度にしておき、テクスチャを張り付けたいと思います。

まずIOBox(Color)とQuadのリンクを切ってしまい、新しいノードFileTexture(EX9.Texture)を出しましょう。

そしてQuadを初期化(Alt+右クリック)しFileTextureとつなげてください。

f:id:castlejou:20140911141150j:plain

FileTextureの左上のピンFilenameを右クリックしてください。

するとファイルを開くことができるのでvvvvの中にあるサンプル画像を選択しましょう。

f:id:castlejou:20140911141607j:plain

 

するとQuadに画像が表示されましたね。

f:id:castlejou:20140911141731j:plain

 

FileTextureは画像だけではなく様々なメディアファイルを開くことができ今後も多用します。

それでは今回はこのへんで。

vvvv入門2

今回は前回作った四角を移動、変形させるTransformノードを触ってみます。

 

まずTransform(Transform 3d)ノードを作ってQuadの入力ピンにつなげてください。

f:id:castlejou:20140911013929j:plain

TransformノードのTranslateXピン(左から二番目)を右クリックし、値を0.5に変えてみます。

f:id:castlejou:20140911014440j:plain

次にTranslateYピンを上下に右ドラッグしてください。値が変化します。

f:id:castlejou:20140911014940j:plain

つぎはパッチの適当なところで右ダブルクリックをしてみてください。

するとIOBoxというノードを一発で出すことができます。(一応普通にやってもIOBoxを作れることも確認しましょう)

f:id:castlejou:20140911015106j:plain f:id:castlejou:20140911015704j:plain

 

初期値のままぽちぽちぽちとTranslateX、Y、Zとつなげておきしょう。

 

次は新しいノード、LFO(Animation)を作ってLFOのOutputピンを右クリックし、TransformのScaleX、ScaleYで左クリックしてください。

このつなぎ方は同じ出力を複数ピンに与えるときに便利なので覚えましょう。

f:id:castlejou:20140911020446j:plain

 

どうでしょう?少し面白いでしょうか?LFOは0~1の値をずっと繰り返して出力するノードです。

 

では今つないだ二つのリンクを消します。リンクを左クリックで選択し、右クリック(かBackSpaceかDeleteキー)で削除です。

f:id:castlejou:20140911020823j:plain f:id:castlejou:20140911020838j:plain

Transformの残りのピンは回転に関するものです。面白いので繋げて確かめてみましょう。

f:id:castlejou:20140911021231j:plain

 

 

今回はTransformノードの基本について学びました。

ちなみに、Renderer画面は以下の座標の通りです。

f:id:castlejou:20140911022029j:plain

vvvv入門

 

グラフィック描写やインタラクティブアート制作が簡単にできるらvvvvというVPL(Visual Programming Language)を始めました。

このVPLとはプログラミングをコードの記述ではなく、視覚的に行うので便利な言語です。他にもPure Data、Max/MSPなどがそうです。

 

vvvvは公式のこちらDownloads | vvvvからダウンロードでき、インストールして実行するだけなので導入は簡単ですね。f:id:castlejou:20140910234643j:plain

それではvvvvを実行しましょう。

 

 

初めはこの画面(パッチ)が表示されます。

画面のどこかでダブルクリックしてRendererと入力し、

f:id:castlejou:20140620083655j:plain f:id:castlejou:20140910235505j:plain

Renderer(EX9)を選択しクリックorEnter。

f:id:castlejou:20140910235846j:plain

今後はここに映像を表示させていきます。

とりあえずAlt+2で画面をパッチ内に入れてしまいます。

f:id:castlejou:20140911000108j:plain

 

それでは四角形を表示させてみます。

Quad(DX9)のノードを作成し、この小さな点をクリックしてつなげます。

f:id:castlejou:20140911000625j:plain f:id:castlejou:20140911000734j:plain

すると画面に四角が表示されました。

vvvvプログラミングはこのように進めていきます。

また、終了はCtrl+Wで画面を閉じます。

 

最後に用語の説明を。

f:id:castlejou:20140911002230j:plain

パッチ・・・画面全体の事

ノード・・・プログラミングのコードみたいなもの

ピン・・・・ノードの上下の黒い点

リンク・・・ピン同士をつなぐ線

 

android(2)

andoroidアプリでのファイルに関してこのサイトで分かりやすく解説されている。

http://shine32.blog.fc2.com/blog-entry-58.html

フォームはXMLファイルで定義し実行時に展開するのが一般である。res/layout/activity_main.xmlで定義する。

フォームの表示方法

LinearLayout:画面に行状または列状に配置を行うレイアウト。
RelativeLayout:相対的に配置していくレイアウト。一つ基準となるものを決め、そこからの位置を座標表示する。

 

ウィンドウの属性や特徴はテーマとウィンドウズマネージャを使ってカスタマイズする。

 

テーマはアプリ全体またはアクティビティに対して適応できる外観のスタイルである。テーマにはシステムテーマかカスタムテーマかのいずれかがあり、どちらでもAndroidManifest.xmlファイルに設定される。

システムテーマ

androidフレームワークのパッケージに含まれるstyle.xmlにはテーマのためのオプションとカスタムプロパティ集合が含まれる。Theme.NoTitleBar.FullScreenなどとすることでテーマが変更できる

android

コンポーネント

androidアプリケーションは”コンポーネント”と呼ばれるオブジェクトから構築されます。これはアクティビティのUIコンポーネント(Widget)とは異なります。

通常コンポーネントとはボタンなどの部品という意味ですがここでいうコンポーネントとはアプリケーションのプログラムを構成する要素としての意味です。

システムの要求に応じて呼び出すことができ、アプリケーションはコンポーネント単位で呼び出すことができる。

アクティビティ、サービス、コンテントプロバイダ、ブロードキャストレシーバーの4種類がある。

アクティビティ

唯一GUIをもつコンポーネントで、アプリはアクティビティを基本一つ以上ふくむ。

サービス

バックグラウンドで実行されるUIを持たないコンポーネントである。

例えばユーザーが選択した曲を流す音楽サービスを考えると、選択された楽曲を別スレッドで再生する。これは音楽の再生を始めたアクティビティがスクリーンから消えた後も再生が続くことをユーザーが期待したからである。

ブロードキャストレシーバ

ブロードキャスト(配信)の名の通り同報通信を受信してそれに反応するコンポーネントである。例えば”タイムゾーンが変更された”、”バッテリーの電圧が低い”など多くの事象を示すブロードキャストがシステムコードから発せられる。アプリから他アプリにブロードキャストを発することもでき、”ダウンロードが終わった”、”リツイートされた”と教えてあげることもできる。

コンテントプロバイダ

あるアプリの特定のデータ集合を他のアプリから利用できるようにすること。データの管理をしている。

 

AndroidのJava備忘録

実装 関数の本体。{}で囲まれた部分。

インターフェイス 実装のないclass。

サブクラス 継承関係のクラスにおいて継承先となるクラス。extendsの左に書かれたほう。2世代以上継承されたものも同じ。(派生クラス、継承先クラス、子クラスに同じ)

スーパークラス 上の逆。継承元。extendsの右。

オーバーライド サブクラスでメソッドを上書きする機能。サブクラスでスーパークラスと同じメソッド名、引数、引数のメソッドを定義することでスーパークラスのメソッドでは無くサブクラスのメソッドが呼び出される。

参照 クラスのインスタンスを指し示す番号。もしくはその番号を格納するための変数。クラスはnewを用いてインスタンスを作成しないと使用できないがそのインスタンスは直接操作することができない。インスタンスを操作するには作成時に振られる参照と呼ばれる番号を用いてインスタンスを参照し操作しなければならない。

int型 32bitの基本データ型。-2の31乗から2の31乗-1まで表現できる。