<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" media="screen" href="/~d/styles/rss2full.xsl"?><?xml-stylesheet type="text/css" media="screen" href="http://feeds.feedburner.com/~d/styles/itemcontent.css"?><rss xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:wfw="http://wellformedweb.org/CommentAPI/" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:sy="http://purl.org/rss/1.0/modules/syndication/" xmlns:slash="http://purl.org/rss/1.0/modules/slash/" xmlns:feedburner="http://rssnamespace.org/feedburner/ext/1.0" version="2.0">

<channel>
	<title>awk2</title>
	
	<link>http://blog.awk2.net</link>
	<description>Experience And Experiment</description>
	<lastBuildDate>Tue, 12 Jul 2011 14:36:29 +0000</lastBuildDate>
	<language>ja</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0.3</generator>
		<atom10:link xmlns:atom10="http://www.w3.org/2005/Atom" rel="self" type="application/rss+xml" href="http://feeds.feedburner.com/awk2blog" /><feedburner:info uri="awk2blog" /><atom10:link xmlns:atom10="http://www.w3.org/2005/Atom" rel="hub" href="http://pubsubhubbub.appspot.com/" /><feedburner:browserFriendly></feedburner:browserFriendly><item>
		<title>switch文内のコメントからimportの整理バグを発動</title>
		<link>http://blog.awk2.net/article/201107122331/475</link>
		<comments>http://blog.awk2.net/article/201107122331/475#comments</comments>
		<pubDate>Tue, 12 Jul 2011 14:31:07 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[ActionScript]]></category>
		<category><![CDATA[Flash Builder 4]]></category>

		<guid isPermaLink="false">http://blog.awk2.net/?p=475</guid>
		<description><![CDATA[とあるソースを改修することになった際に import文がなぜかメソッドの中にあったり、それを削るとエラーになったりで 意味不明のままずっと謎だった記述の発生原因がわかりました。 簡単に説明するとswitch文の中に/** [...]]]></description>
			<content:encoded><![CDATA[<p>とあるソースを改修することになった際に<br />
import文がなぜかメソッドの中にあったり、それを削るとエラーになったりで<br />
意味不明のままずっと謎だった記述の発生原因がわかりました。</p>
<p>簡単に説明するとswitch文の中に/** */ 形式でコメントを記述し<br />
その状態でimport の整理をすると一部のimportが削除される現象が発生します。</p>
<p>実際にサンプルソースで説明します。</p>
<p>まずはswitch文とimportを必要とするクラスを入れたソースを記述<br />
（サンプルは、条件によって描画の色を変更する簡単なクラス）</p>
<pre class="brush: as3; title: ; wrap-lines: true;">
package
{
  import flash.display.Graphics;
  import flash.display.Sprite;

  public class SwitchTest extends Sprite
  {
    public function SwitchTest()
    {
      var hoge:uint = 0;

      switch (hoge)
      {
        case 0:
          draw(this.graphics, 0xff0000);
          break;
        case 1:
          draw(this.graphics, 0xffff00);
          break;
      }
    }

    private function draw(g:Graphics, color:uint):void
    {
      g.clear();
      g.beginFill(color);
      g.drawRect(0, 0, 100, 100);
      g.endFill();
    }
  }
}
</pre>
<p>次に上記のswitch文の中に/** */の形式でコメントを記述します。</p>
<pre class="brush: as3; title: ; wrap-lines: true;">
      switch (hoge)
      {
        /**
         * このコメントは危険です。
         */
        case 0:
          draw(this.graphics, 0xff0000);
          break;
</pre>
<p>この状態でimportの整理(Ctrl+Shit+O)をすると、、</p>
<pre class="brush: as3; title: ; wrap-lines: true;">
package
{
  import flash.display.Sprite;

  public class SwitchTest extends Sprite
  {
    public function SwitchTest()
    {
      var hoge:uint = 0;

      switch (hoge)
      {
        /**
         * このコメントは危険です。
         */
        case 0:
          draw(this.graphics, 0xff0000);
          break;
        case 1:
          draw(this.graphics, 0xffff00);
          break;
      }
    }

    private function draw(g:Graphics, color:uint):void
    {
      g.clear();
      g.beginFill(color);
      g.drawRect(0, 0, 100, 100);
      g.endFill();
    }
  }
}
</pre>
<p>ソースからGraphicsクラスのimportが消えます！</p>
<p>そして、仕方なくこの状態でGraphicsクラスを定義している箇所（g:Graphics）で<br />
コンテンツアシスト（Ctrl+Space）からGraphicsクラスを選択してimportしようとすると</p>
<pre class="brush: as3; title: ; wrap-lines: true;">
package
{
  import flash.display.Sprite;

  public class SwitchTest extends Sprite
  {
    public function SwitchTest()
    {
      var hoge:uint = 0;

      switch (hoge)
      {
        /**
         * このコメントは危険です。
         */
        case 0:
          draw(this.graphics, 0xff0000);
          break;
        case 1:
          draw(this.graphics, 0xffff00);
          break;
      }
import flash.display.Graphics;

    }

    private function draw(g:Graphics, color:uint):void
    {
      g.clear();
      g.beginFill(color);
      g.drawRect(0, 0, 100, 100);
      g.endFill();
    }
  }
}
</pre>
<p>今度はGraphicsクラスのimportがメソッドの中に記述されます！！</p>
<p>これを発見したときはかなりの衝撃でした。</p>
<p>今回のサンプルでコンパイルするとエラーになってしまいますが、<br />
エラーにならないこともあるようです。。<br />
（実際自分が触ったソースはコンパイルとおってました。。。）</p>
<p>FlashBuilderのバグと言っていいとは思いますが、<br />
メソッド内ではswitch文に限らず、クラスの説明などで使用する/** */形式での<br />
コメントは避けるべきだと思われます。</p>
<p>ちなみに、<br />
// 形式のコメントや、 /* */ 形式のコメントは問題ありませんでした。</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.awk2.net/article/201107122331/475/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Google Apps Scriptの勉強初めでつまづかないために、、</title>
		<link>http://blog.awk2.net/article/201103021302/465</link>
		<comments>http://blog.awk2.net/article/201103021302/465#comments</comments>
		<pubDate>Wed, 02 Mar 2011 04:02:50 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Google Apps Script]]></category>

		<guid isPermaLink="false">http://blog.awk2.net/?p=465</guid>
		<description><![CDATA[Google Apps では、JavaScriptをベースにしたGoogle Apps Script というスクリプト言語が使用できます。 とある案件用に、Google Sites でどんなものか試そうかとして いきなり [...]]]></description>
			<content:encoded><![CDATA[<p>Google Apps では、JavaScriptをベースにしたGoogle Apps Script<br />
というスクリプト言語が使用できます。</p>
<p>とある案件用に、Google Sites でどんなものか試そうかとして<br />
いきなりつまづきましたのでシェアしておきます。</p>
<p>プログラミング経験者なら真っ先に試したくなるのは簡単な文字列&#8221;HelloWorld&#8221;を表示しようと<br />
することが多いかと思いますが、、</p>
<p>そこで、Google SitesのApps Script エディタに次のようなシンプルなソースを記述し実行</p>
<pre class="brush: jscript; title: ;">
function testFunc(){
  Browser.msgBox(&quot;Hello World&quot;);
}
</pre>
<p>アラートボックスにHello Worldと表示されることを期待していたのですが、<br />
次のエラーがでて全く動きません。なんど実行してもエラーです。</p>
<pre class="brush: plain; title: ; wrap-lines: true;">
Cannot call Browser.msgBox() from this context; have you tried Logger.log() instead? (line 2)
</pre>
<p>実は、Browser.msgBoxはGoogle Sitesではまだ利用できないようなのです。<br />
（リファレンスには、特に書かれておらず、ユーザーガイドにこっそり書かれていました。）</p>
<blockquote><p>
Since Browser.msgBox() isn&#8217;t currently available in a Google Site, you can instead send an email notification<br/><br />
<a href="http://code.google.com/googleapps/appsscript/guide_writing_scripts.html<br />
">Google Apps Script より抜粋</a>
</p></blockquote>
<p>流石に単純なコードすら動かないと一気にモチベーションが下がります。</p>
<p>Google Apps Scriptは、実行対象のアプリによって動かないことがあることを<br />
知っておいた方が良いと思います。</p>
<p>ちなみに、同じコードをGoogle Spreadsheetsで試したところ、問題なく実行できました。</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.awk2.net/article/201103021302/465/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>KINECT+Mac+Processingを連携する</title>
		<link>http://blog.awk2.net/article/201101111344/455</link>
		<comments>http://blog.awk2.net/article/201101111344/455#comments</comments>
		<pubDate>Tue, 11 Jan 2011 04:44:03 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[KINECT]]></category>
		<category><![CDATA[Processing]]></category>

		<guid isPermaLink="false">http://blog.awk2.net/?p=455</guid>
		<description><![CDATA[巷で流行の兆しを見せているKINECTハックですが、自分も試してみることにしました。 自分のマシン環境は、Mac OS X（10.6.6）です。 次の偉大な先人方々の記事を参考にさせていただき、 Kinect Hack  [...]]]></description>
			<content:encoded><![CDATA[<p>巷で流行の兆しを見せているKINECTハックですが、自分も試してみることにしました。</p>
<p>自分のマシン環境は、Mac OS X（10.6.6）です。</p>
<p>次の偉大な先人方々の記事を参考にさせていただき、</p>
<p><a href="http://yoppa.org/blog/2156.html" target="_blank">Kinect Hack 現状まとめ</a><br />
<a href="http://www.m-tea.info/2010/12/kinectpc1.html" target="_blank">KinectをPCで使う1 &#8211; M-Tea</a><br />
<a href="http://www.in-vitro.jp/blog/index.cgi/Kinect/20101130_01.htm" target="_blank">試験管のなかのコード :: MacOS X で Kinect にチャレンジ</a><br />
<a href="http://fairground-mag.com/kinect_openframeworks/" target="_blank">KinectをopenFrameworksで動かしてみた</a><br />
<a href="http://d.hatena.ne.jp/popeyee/20101120/1290242500" target="_blank">Kinect使ってみました(mac, openframeworks, ofxKinect) &#8211; Dr popeyeブログ：研究、メディアアート、ダンス</a></p>
<p>どうやらそのまま繋げただけではドライバを認識してくれないとのことだったので<br />
OpenKinectを入れることにしました。</p>
<p>当初、次のURLの手順で試してみたのですが、<br />
<a href="http://www.spoofscript.com/blog/?p=402" target="_blank">Install libfreenect on linux or OSX</a></p>
<p>githubでlibfreenectを取得する際にusernameとpasswordの<br />
入力を求められ、どうしたらいいかわかりませんでした。<br />
（記事のUPDATEだったりコメント欄をよく読むとOpenKinectの公式ページに移管した模様。）</p>
<p>結局のところ、基本的には次のURLの手順に従っていくだけでOK。<br />
<a href="http://openkinect.org/wiki/Getting_Started#OS_X" target="_blank">Getting Started &#8211; OpenKinect</a></p>
<p>Macを常に触っている人ならたぶん簡単にできると思いますが<br />
自分はWindowsメインなのでかなり苦労しました。。</p>
<p>git-core、libtool、libusb-devel<br />
をインストールする際に、db46に関してのエラーがでて<br />
ちょっとこのまま進めていいか迷いましたが<br />
とりあえず、進めることにしました。</p>
<p>若干のトラブルもありつつ、一通り手順どおりにインストール作業を終えたので<br />
Processingと連携することにしてみました。</p>
<p>Shiffmanさんの次の記事にリンクされているopenkinect.zipをダウンロードして<br />
<a href="http://www.shiffman.net/2010/11/14/kinect-and-processing/" target="_blank">Kinect and Processing  at  daniel shiffman</a></p>
<p>サンプルのProcessingファイル（PointCloud.pde、RGBDepthTest.pde）を起動。</p>
<p>外部ライブラリ（libKinect.jnilib、openkinect.jar）を使用しているので<br />
設定を確認してから実行。</p>
<p><img src="http://blog.awk2.net/control/wp-content/uploads/2011/01/kinect_processing-300x284.jpg" /><br />
RGBDepthTest.pde のスクリーンキャプチャ（一部抜粋）</p>
<p>結果、上手く動くことができました！</p>
<p>まだ連携しただけなので色々実験して行きたいと思います。</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.awk2.net/article/201101111344/455/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>ローカル環境でSWFを動かす時の注意点</title>
		<link>http://blog.awk2.net/article/201012100000/449</link>
		<comments>http://blog.awk2.net/article/201012100000/449#comments</comments>
		<pubDate>Thu, 09 Dec 2010 15:00:28 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[ActionScript]]></category>
		<category><![CDATA[FlashPlayer]]></category>

		<guid isPermaLink="false">http://blog.awk2.net/?p=449</guid>
		<description><![CDATA[なかなか珍しい案件ですが、 ローカル環境でHTMLを開き、そこにFlashコンテンツを表示させる 案件でハマりました。 まず、navigationURLがデフォルトでは動かないです。 セキュリティサンドボックス侵害エラー [...]]]></description>
			<content:encoded><![CDATA[<p>なかなか珍しい案件ですが、<br />
ローカル環境でHTMLを開き、そこにFlashコンテンツを表示させる<br />
案件でハマりました。</p>
<p>まず、navigationURLがデフォルトでは動かないです。<br />
セキュリティサンドボックス侵害エラーがでます。</p>
<p>プロジェクタ形式では問題ないのですが、SWFだと動きません。<br />
納品近くでそのことが判明しかなり冷や汗ものでした。<br />
（事前検証は必須ですね。。）</p>
<p>過去に見聞きした事例をなんとか思い出し、<br />
運よく外部サイトへの遷移がなかったので<br />
コンパイル時に引数で-use-network=falseで回避することができました。</p>
<p>そして、アンカーリンク、クエリーストリングが渡せません。<br />
これは、もうどうしようもなかったです。<br />
実態参照でもダメでしたね。</p>
<p>最後に、FlashからJavaScriptが実行＆呼び出しができません。</p>
<p>ローカル環境は、ネットワーク環境に比べて<br />
ものすごくセキュリティが厳しいです。</p>
<p>気持ちは、わからないでもないですが、、もうちょっとなんとかしてほしいです。。</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.awk2.net/article/201012100000/449/feed</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>スパムコメント発生中</title>
		<link>http://blog.awk2.net/article/201008171718/441</link>
		<comments>http://blog.awk2.net/article/201008171718/441#comments</comments>
		<pubDate>Tue, 17 Aug 2010 08:18:44 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Undefined]]></category>

		<guid isPermaLink="false">http://blog.awk2.net/?p=441</guid>
		<description><![CDATA[コメント欄を解放したら早速スパムの嵐です。。 試しにSI CAPTCHA Anti-Spamというプラグインをいれてみましたが、 上手く動かない、、 どうやら自分はWordPressと相性が良くないようです。]]></description>
			<content:encoded><![CDATA[<p>コメント欄を解放したら早速スパムの嵐です。。</p>
<p>試しにSI CAPTCHA Anti-Spamというプラグインをいれてみましたが、<br />
上手く動かない、、</p>
<p>どうやら自分はWordPressと相性が良くないようです。</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.awk2.net/article/201008171718/441/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>ブログ改装中</title>
		<link>http://blog.awk2.net/article/201007162307/437</link>
		<comments>http://blog.awk2.net/article/201007162307/437#comments</comments>
		<pubDate>Fri, 16 Jul 2010 14:07:15 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Undefined]]></category>

		<guid isPermaLink="false">http://blog.awk2.net/?p=437</guid>
		<description><![CDATA[コメント欄がずいぶん前から入力できない現象がおきていたけど、 どうやらこのブログを開設したときから起きていたようだ。 （プレビューではコメント欄が出るのできづかなかったみたい、、） フォーラムをみるとどうやら仕様のようす [...]]]></description>
			<content:encoded><![CDATA[<p>コメント欄がずいぶん前から入力できない現象がおきていたけど、<br />
どうやらこのブログを開設したときから起きていたようだ。<br />
（プレビューではコメント欄が出るのできづかなかったみたい、、）</p>
<p>フォーラムをみるとどうやら仕様のようす。<br />
<a href="http://ja.forums.wordpress.org/topic/3811" target="_blank">http://ja.forums.wordpress.org/topic/3811</a></p>
<p>つまり、パーマリンク設定でURLをカスタム構造にした場合<br />
ユニークIDと完全にわかるタグを入れないとコメント欄が表示されない現象が発生するとのこと。</p>
<p>まさに、自分は日付（年月日時間）だったので、ユニークとはいえないタグでした。</p>
<p>正直、ずいぶんたってからこの致命的な問題に直面したのは悲しい。</p>
<p>まー、アクセス数が全くないのが不幸中の幸いで<br />
ここで思い切って全パーマリンクの構造を切り替えることにしました。</p>
<p>記事にリンクを張ってくれていた方には申し訳ないですがご了承ください。</p>
<p>しかし、このデフォルトテーマはより悲しい。</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.awk2.net/article/201007162307/437/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>オートコンプリートが機能していないように見せかける</title>
		<link>http://blog.awk2.net/article/201004081937/428</link>
		<comments>http://blog.awk2.net/article/201004081937/428#comments</comments>
		<pubDate>Thu, 08 Apr 2010 10:37:23 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[JavaScript]]></category>

		<guid isPermaLink="false">http://blog.awk2.net/?p=428</guid>
		<description><![CDATA[今やっている案件で、 違うユーザーが同一PC、同一ブラウザで認証が必要なシステムにアクセスしたい といった要望がありました。 オートコンプリート機能を使うと入力情報は保存されるので 違うユーザーがなりすまして入ることがで [...]]]></description>
			<content:encoded><![CDATA[<p>今やっている案件で、<br />
違うユーザーが同一PC、同一ブラウザで認証が必要なシステムにアクセスしたい<br />
といった要望がありました。</p>
<p>オートコンプリート機能を使うと入力情報は保存されるので<br />
違うユーザーがなりすまして入ることができてしまいます。</p>
<p>しかし、そもそも<br />
オートコンプリート機能自体は、ブラウザに依存するので<br />
システムからでは根本的に回避する方法はないのですが、<br />
大人の事情があり、見かけ上だけでも見せなくする手段を<br />
作ることになりました。</p>
<p>そして、できたのがこちらです。<br />
<a href="http://awk2.net/auto_complete/autocomp_ok.html" target="_blank">回避策対応版</a></p>
<p>検証方法は、<br />
１．上記のページにアクセスします。<br />
２．適当に、文字を入力しsubmitボタンを押します。<br />
３．ブラウザで記憶するか聞かれるので記憶します。<br />
４．一度閉じるか、リロードするなどして、再度上記のページを開きます。<br />
再度ページを開いた際に、入力フォームに値が入っていないと思います。<br />
ブラウザによっては、inputタイプがpasswordではない場合に、<br />
フォーカスを合わせて下キーを押すと候補がでるようですが、<br />
選択してもpasswordは表示されないと思います。</p>
<p>実装方法は、<br />
ソースを見ていただければわかると思いますが、<br />
bodyタグのonloadイベントで、<br />
フォームのinputboxを作成しているだけです。</p>
<p>この方法を使えば、どうやらオートコンプリート機能は動かないようです。</p>
<p>こちらは、何も実装していないオートコンプリートが働くフォームです。<br />
<a href="http://awk2.net/auto_complete/autocomp_ng.html" target="_blank">回避策非対応版</a></p>
<p>改めて書きますが、<br />
この方法は、根本的な解決にはなりません。</p>
<p>以上、苦肉の策でした。</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.awk2.net/article/201004081937/428/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>HYPEでFlashコンテンツを透過PNG保存する</title>
		<link>http://blog.awk2.net/article/201001282308/415</link>
		<comments>http://blog.awk2.net/article/201001282308/415#comments</comments>
		<pubDate>Thu, 28 Jan 2010 14:08:50 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[ActionScript]]></category>
		<category><![CDATA[Flex Builder 3]]></category>
		<category><![CDATA[the HYPE framework]]></category>

		<guid isPermaLink="false">http://blog.awk2.net/?p=415</guid>
		<description><![CDATA[HYPE frameworkの中で最も興味深い機能の一つが Flashコンテンツを透過PNG形式保存できることではないでしょうか。 JoshaDavisさんが、Flashコンテンツを印刷媒体に使っているのを見て Flas [...]]]></description>
			<content:encoded><![CDATA[<p>HYPE frameworkの中で最も興味深い機能の一つが<br />
Flashコンテンツを透過PNG形式保存できることではないでしょうか。</p>
<p>JoshaDavisさんが、Flashコンテンツを印刷媒体に使っているのを見て<br />
Flashコンテンツをどうやってベクターデータをキープしてイラレやフォトショにエクスポートするかを<br />
1、2年ぐらい前に、<a href="http://l00oo.oo00l.com/" target="_blank">l00oo.oo00l</a>さんと何度か議論したことがあり<br />
結局、<a href="http://fladdict.net/" target="_blank">fladdict</a>さんがやっているような<a href="http://fladdict.net/blog/2007/05/svg.html" target="_blank">SVGエクスポート</a>しかないのかなぁと<br />
その時は思っていました。</p>
<p>しかし、このHYPE frameworkではPNG保存ができるということをアナウンスしていたので<br />
早速試してみました。</p>
<p>チュートリアルで一通りチェックをした感じだとすごい簡単に出来そうでした。</p>
<p><object width="400" height="300"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id=8809042&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=1&amp;show_portrait=0&amp;color=&amp;fullscreen=1" /><embed src="http://vimeo.com/moogaloop.swf?clip_id=8809042&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=1&amp;show_portrait=0&amp;color=&amp;fullscreen=1" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="400" height="300"></embed></object>
<p><a href="http://vimeo.com/8809042">ContextSavePNG</a> from <a href="http://vimeo.com/joshuadavis">Joshua Davis</a> on <a href="http://vimeo.com">Vimeo</a>.</p>
<p>サンプルコードをHYPEのサイトから適当にもってきて試します。<br />
（自分は<a href="http://hype.joshuadavis.com/02_examples/objectpool/01_objectpool/" target="_blank">01_objectpool</a>を少し改造して試します。）</p>
<p>まずは、ContextSavePNGクラスをインポートします。</p>
<pre class="brush: as3; title: ;">
	import hype.extended.util.ContextSavePNG;
</pre>
<p>後は、BitmapCanvasクラスのインスタンスをつくり、<br />
setupLargeCanvas()メソッドに保存倍率を指定し、<br />
ContextSavePNGをインスタンス化するだけで準備は完了です。</p>
<pre class="brush: as3; title: ;">
			// PNGエンコードの際の倍率を指定
			clipCanvas.setupLargeCanvas(10);
			// PNG保存のコンテキストを登録
			var savePNG:ContextSavePNG = new ContextSavePNG(clipCanvas);
</pre>
<p>ものすごくシンプルです！！</p>
<p>では実際に、Flashコンテンツをキャプチャしてみます。</p>
<p>※ 描画用の背景は透明で、描画領域は縦横300pxです。</p>
<div id="Hype08_1"></div>
<p><script type="text/javascript">
swfobject.embedSWF("http://blog.awk2.net/swf/Hype08_1.swf", "Hype08_1", "300", "300", "10.0.0", "http://blog.awk2.net/expressInstall.swf", {}, {wmode:"opaque"});
</script></p>
<p>まずはFlashコンテンツを実行し、感性に任せて程好いところで右クリック。<br />
すると、コンテキストメニューに[ Encode PNG ] と表示されるのでそこでクリック。<br />
プログレスバーが表示されPNGへのエンコードを行います。<br />
プログレスバーが消えたら再度右クリック。<br />
すると、今度はコンテキストメニューに[ Save PNG... ] と表示されるのでそこでクリック。<br />
ダイアログが表示されるのでお好みの場所に保存で完了です。</p>
<p>早速、フォトショで確認してみます。</p>
<p><img src="http://blog.awk2.net/swf/hype08_1_sc.jpg" title="フォトショのキャプチャ" /></p>
<p>ちゃんと、透過できて取り込めています。<br />
そして、気になる解像度も、300px * 300px の10倍でPNG保存したので<br />
3000px * 3000px になっています。</p>
<p><img src="http://blog.awk2.net/swf/hype08_1_sc2.jpg" title="フォトショのキャプチャ" /></p>
<p>これであれば、たとえば解像度300にしても<br />
254mm サイズの印刷に劣化せず対応できるということになります。</p>
<p><img src="http://blog.awk2.net/swf/hype08_1_sc3.jpg" title="フォトショのキャプチャ" /></p>
<p>これは、とても便利です！<br />
間単に自作のジェネレーティブアートが印刷できるようになりました！！</p>
<p>ベクターデータではないので、<br />
Joshuaさんの実際の作品用エクスポートだったり、fladdictさんがやっているようなアプローチとは<br />
ちょっと違うとは思いますが、これでも、十分可能性を秘めていると思います。<br />
検証の価値ありです。</p>
<p>ますます、Flashが楽くなりますね。</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.awk2.net/article/201001282308/415/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>HYPE frameworkの勉強(4)</title>
		<link>http://blog.awk2.net/article/201001270001/394</link>
		<comments>http://blog.awk2.net/article/201001270001/394#comments</comments>
		<pubDate>Tue, 26 Jan 2010 15:01:49 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[ActionScript]]></category>
		<category><![CDATA[Flex Builder 3]]></category>
		<category><![CDATA[the HYPE framework]]></category>

		<guid isPermaLink="false">http://blog.awk2.net/?p=394</guid>
		<description><![CDATA[初回はこちら 第2回はこちら 第3回はこちら 前回までのソースはこちら ※ 注意 ※ 自分はFlexBuilder3を使用して試していますので CS4を使ったやり方は実際のチュートリアルを参照ください。 オブジェクトをビ [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://blog.awk2.net/article/201001241623.html">初回はこちら</a><br />
<a href="http://blog.awk2.net/article/201001260059.html">第2回はこちら</a><br />
<a href="http://blog.awk2.net/article/201001260931.html">第3回はこちら</a><br />
<a href="http://blog.awk2.net/swf/Hype05_4.txt" target="_blank">前回までのソースはこちら</a></p>
<p>※ 注意 ※<br />
自分はFlexBuilder3を使用して試していますので<br />
CS4を使ったやり方は実際のチュートリアルを参照ください。</p>
<p><strong>オブジェクトをビットマップでキャプチャする</strong></p>
<p>今までは、オブジェクトを移動させていただけですが、<br />
今度は動きをビットマップでキャプチャをしていきます。</p>
<p>まずは、BitmapCanvasクラスをインポートします。</p>
<pre lang="actionscript3">
	import hype.framework.display.BitmapCanvas;
</pre>
<p>ビットマップキャプチャ用のキャンバスを作成します。</p>
<pre lang="actionscript3">
		// ビットマップキャプチャ用キャンバス
		private var clipCanvas:BitmapCanvas;
</pre>
<p>コンストラクタにステージの領域でインスタンスを作成。<br />
※一部抜粋</p>
<pre lang="actionscript3">
			// シェイプを非表示
			exitShape.visible = false;

			// ビットマップキャプチャ用キャンバスを作成します
			// 第1引数には、キャンバスの横幅
			// 第2引数には、キャンバスの高さ
			clipCanvas = new BitmapCanvas(myWidth, myHeight);
			addChild(clipCanvas);
</pre>
<p>コンストラクタの最後にキャプチャを開始する処理を記述します。<br />
はじめはstartCaptureメソッドの第2引数をtrueにします。</p>
<p>※一部抜粋</p>
<pre lang="actionscript3">
			// キャプチャを開始します。
			// 第1引数には、対象オブジェクト
			// 第2引数には、キャプチャを繰り返すかどうか
			clipCanvas.startCapture(clipContainer, true);

			addEventListener(Event.ADDED_TO_STAGE, onAddToStage);
</pre>
<p>実行してみると、オブジェクトが動くたびにキャンバスに転写され<br />
足跡みたいな描画になります。</p>
<div id="Hype06"></div>
<p>（<a href="http://blog.awk2.net/utils/swfViewer.html?name=Hype06&#038;w=600&#038;h=480" target="_blank">別ウインドウで表示</a>）</p>
<p><script type="text/javascript">
swfobject.embedSWF("http://blog.awk2.net/swf/Hype06.swf", "Hype06", "600", "480", "10.0.0", "http://blog.awk2.net/expressInstall.swf", {}, {wmode:"opaque"});
</script></p>
<p>描画されている箇所をよく見ると、BitmapCanvasのコンストラクタで設定したとおり<br />
ステージ領域だけ足跡が描画されていることがわかります。<br />
つまり、Graphicクラスのclear()メソッドを呼ばないで描画している状態と同じです。</p>
<p>そこで、ステージ領域だけを描画するようにコンストラクタに記述していた<br />
コンテナ（clipConteiner）の追加処理を削除します。<br />
※一部抜粋</p>
<pre lang="actionscript3">
			// コンテナを作成
			clipContainer = new Sprite();
// 削除		addChild(clipContainer);
</pre>
<p>これでBitmapCanvasのキャプチャ部分だけを表示するようできました。</p>
<div id="Hype06_1"></div>
<p>（<a href="http://blog.awk2.net/utils/swfViewer.html?name=Hype06_1&#038;w=600&#038;h=480" target="_blank">別ウインドウで表示</a>）</p>
<p><script type="text/javascript">
swfobject.embedSWF("http://blog.awk2.net/swf/Hype06_1.swf", "Hype06_1", "600", "480", "10.0.0", "http://blog.awk2.net/expressInstall.swf", {}, {wmode:"opaque"});
</script></p>
<p>ステージへ入る前、出た後は表示されず、ステージ上では正しく表示されています。<br />
何よりもDisplayObjectを描画しているわけではなく、Bitmapに転写したものを描画しているので<br />
パフォーマンスもかなり期待できます。</p>
<p>ここで、はじめに設定したstartCaptureメソッドの第2引数をfalseにして実行してみます。</p>
<div id="Hype06_2"></div>
<p>（<a href="http://blog.awk2.net/utils/swfViewer.html?name=Hype06_2&#038;w=600&#038;h=480" target="_blank">別ウインドウで表示</a>）</p>
<p><script type="text/javascript">
swfobject.embedSWF("http://blog.awk2.net/swf/Hype06_2.swf", "Hype06_2", "600", "480", "10.0.0", "http://blog.awk2.net/expressInstall.swf", {}, {wmode:"opaque"});
</script></p>
<p>画面がスッキリしました。そして、スムーズに動きます。</p>
<p><strong>オブジェクトにいろいろな動作をつけてみる</strong></p>
<p>初回で、DIrectionalVibrationクラスで下から上に動きをつけましたが、<br />
その他の動きもつけてみます。</p>
<p>まず、FixedVibrationクラスをインポートします。</p>
<pre lang="actionscript3">
	import hype.extended.behavior.FixedVibration;
</pre>
<p>はじめに角度をつけます。<br />
FixedVibrationのインスタンスをpool.onRequestObjectの関数内に記述します。</p>
<pre lang="actionscript3">
				// オブジェクトを指定した角度に振動させます。
				// 第1引数には、対象オブジェクト
				// 第2引数には、対象プロパティ
				// 第3引数には、弾力値?
				// 第4引数には、加減速値?
				// 第5引数には、振動幅の最小値
				// 第6引数には、振動幅の最大値
				// 第7引数には、現在の値を維持するかどうか
				var rVibration:FixedVibration = new FixedVibration(clip, "rotation", 0.9, 0.1, -13, 13, false);

				// 振動を実行させます。
				rVibration.start();
</pre>
<p>-13度から13度の間で動きます。</p>
<div id="Hype07"></div>
<p>（<a href="http://blog.awk2.net/utils/swfViewer.html?name=Hype07&#038;w=600&#038;h=480" target="_blank">別ウインドウで表示</a>）</p>
<p><script type="text/javascript">
swfobject.embedSWF("http://blog.awk2.net/swf/Hype07.swf", "Hype07", "600", "480", "10.0.0", "http://blog.awk2.net/expressInstall.swf", {}, {wmode:"opaque"});
</script></p>
<p>次に、第7引数がどのような影響をあたえるか、X座標を動かすことで確認します。<br />
角度を少し抑え(min:-2、max:2）<br />
X座標用のFixedVibrationのインスタンスをpool.onRequestObjectの関数内に記述します。<br />
第7引数はとりあえずfalseに設定します。</p>
<pre lang="actionscript3">
				// オブジェクトを指定した座標に振動させます。
				// 第1引数には、対象オブジェクト
				// 第2引数には、対象プロパティ
				// 第3引数には、弾力値?
				// 第4引数には、加減速値?
				// 第5引数には、振動幅の最小値
				// 第6引数には、振動幅の最大値
				// 第7引数には、現在の値を維持するかどうか
				var xVibration:FixedVibration = new FixedVibration(clip, "x", 0.9, 0.1, 10, 40, false);

				// 振動を実行させます。
				xVibration.start();
</pre>
<p>実行すると、左側にオブジェクトが寄ってしまいます。</p>
<div id="Hype07_1"></div>
<p>（<a href="http://blog.awk2.net/utils/swfViewer.html?name=Hype07_1&#038;w=600&#038;h=480" target="_blank">別ウインドウで表示</a>）</p>
<p><script type="text/javascript">
swfobject.embedSWF("http://blog.awk2.net/swf/Hype07_1.swf", "Hype07_1", "600", "480", "10.0.0", "http://blog.awk2.net/expressInstall.swf", {}, {wmode:"opaque"});
</script></p>
<p>これは、第7引数の現在の値、つまり現在のX座標を維持するかどうかで、false=しないに設定しているので<br />
常に10pxから40pxの間を行き来することになります。</p>
<p>動きがわかるように振動幅を大きくし(min:-40、max:40）、第7引数をtrueにして実行してみます。</p>
<div id="Hype07_2"></div>
<p>（<a href="http://blog.awk2.net/utils/swfViewer.html?name=Hype07_2&#038;w=600&#038;h=480" target="_blank">別ウインドウで表示</a>）</p>
<p><script type="text/javascript">
swfobject.embedSWF("http://blog.awk2.net/swf/Hype07_2.swf", "Hype07_2", "600", "480", "10.0.0", "http://blog.awk2.net/expressInstall.swf", {}, {wmode:"opaque"});
</script></p>
<p>現在のX座標を維持し相対で動くことが確認できました。</p>
<p>最後に角度、X座標ともに程よい振動幅(min:-4、max:4）に設定し実行してみます。</p>
<div id="Hype07_3"></div>
<p>（<a href="http://blog.awk2.net/utils/swfViewer.html?name=Hype07_3&#038;w=600&#038;h=480" target="_blank">別ウインドウで表示</a>）</p>
<p><script type="text/javascript">
swfobject.embedSWF("http://blog.awk2.net/swf/Hype07_3.swf", "Hype07_3", "600", "480", "10.0.0", "http://blog.awk2.net/expressInstall.swf", {}, {wmode:"opaque"});
</script></p>
<p>3ヶ月遅れのハロウィンですが、、これで出来上がりです！！</p>
<p>気づいたら第4回まで続いてしまい<br />
つたない文章と、わかりずらいコードの説明が散見していたと思いますので<br />
<a href="http://blog.awk2.net/swf/Hype07_3.txt" target="_blank">出来上がりのソース</a>をおいて置きます。</p>
<p>個人的に解釈して記述している箇所もあるので<br />
是非、Joshuaさんのチュートリアルを閲覧されることをお勧めいたします。</p>
<p>チュートリアルを見て試しているだけで、ActionScriptのテクニックが物凄い詰まっていることがわかります。<br />
コードも直感的でわかりやすいし、引数のパラメータをいじるだけでいろいろな動きがつけられるので<br />
コードを書くのがが苦手な方や、AS初心者にはとてもなじみ易いと思います。<br />
メモリ管理もしっかり考慮されていてASになれている方にも興味深いフレームワークだと思いました。</p>
<p>指摘等ございましたら以下までご連絡いただけると幸いです。<br />
otayori[at]awk2.net</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.awk2.net/article/201001270001/394/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>HYPE frameworkの勉強(3)</title>
		<link>http://blog.awk2.net/article/201001260931/372</link>
		<comments>http://blog.awk2.net/article/201001260931/372#comments</comments>
		<pubDate>Tue, 26 Jan 2010 00:31:56 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[ActionScript]]></category>
		<category><![CDATA[Flex Builder 3]]></category>
		<category><![CDATA[the HYPE framework]]></category>

		<guid isPermaLink="false">http://blog.awk2.net/?p=372</guid>
		<description><![CDATA[初回はこちら 第2回はこちら 前回までのソースはこちら ※ 注意 ※ 自分はFlexBuilder3を使用して試していますので CS4を使ったやり方は実際のチュートリアルを参照ください。 オブジェクトのステージアウトを検 [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://blog.awk2.net/article/201001241623.html">初回はこちら</a><br />
<a href="http://blog.awk2.net/article/201001260059.html">第2回はこちら</a><br />
<a href="http://blog.awk2.net/swf/Hype04.txt" target="_blank">前回までのソースはこちら</a></p>
<p>※ 注意 ※<br />
自分はFlexBuilder3を使用して試していますので<br />
CS4を使ったやり方は実際のチュートリアルを参照ください。</p>
<p><strong>オブジェクトのステージアウトを検知する</strong></p>
<p>ステージと同じ領域にしたシェイプから<br />
オブジェクトが外れたかどうかをチェックすることで<br />
ステージアウトしたかを判断します。</p>
<p>ExitShapeTriggerクラスをインポートします。</p>
<pre lang="actionscript3">
	import hype.extended.trigger.ExitShapeTrigger;
</pre>
<p>ステージ領域のシェイプを作成します。</p>
<p>メンバー変数を定義します。</p>
<p>※一部抜粋</p>
<pre lang="actionscript3">
		// ステージ領域のシェイプ
		private var exitShape:Shape;
</pre>
<p>コンストラクタでインスタンスを作成し、<br />
ステージ領域で塗りつぶします。</p>
<p>※一部抜粋</p>
<pre lang="actionscript3">
			var myWidth:Number = stage.stageWidth;
			var myHeight:Number = stage.stageHeight;

			// ステージ領域のシェイプを作成します
			exitShape = new Shape();
			exitShape.graphics.beginFill(0x333333);
			exitShape.graphics.drawRect(0, 0, myWidth, myHeight);
			exitShape.graphics.endFill();
			addChild(exitShape);
</pre>
<p>次に、オブジェクトがステージ領域から外れたら呼ばれる関数に<br />
プールからの解放と表示リストからの削除をする処理を記述します。</p>
<pre lang="actionscript3">
		/**
		 * ExitShapeTriggerクラスのコンストラクタに設定するコールバック関数
		 * リファレンスには詳しく書かれていないですが第1引数は対象オブジェクトのようです。
		 */
		private function onExitShape(clip):void
		{
			// 対象オブジェクトをプールから解放します
			pool.release(clip);
			// クリップコンテナから対象オブジェクトを削除します
			clipContainer.removeChild(clip);
		}
</pre>
<p>最後に、オブジェクトがステージ領域から外れたかどうかをチェックする処理を、<br />
pool.onRequestObjectの関数内に記述します。</p>
<p>※一部抜粋</p>
<pre lang="actionscript3">
				// 振動を実行させます。
				yVibration.start();

				// シェイプから外れたかどうかをチェックします
				// 第1引数には、対象オブジェクトがシェイプから外れた場合に呼ばれるメソッド
				// 第2引数には、対象オブジェクト
				// 第3引数には、検知するシェイプ
				// 第4引数には、対象オブジェクトの実際のピクセルで比較するか境界ポックスで比較するかどうか（hitTestPointメソッドの第3引数と同じ意味）
				// 第5引数には、対象オブジェクトを一度シェイプに入れる必要があるかどうか
				var exitTrigger:ExitShapeTrigger = new ExitShapeTrigger(onExitShape, clip, exitShape, false, false);

				// チェックを開始します。
				exitTrigger.start();

				clipContainer.addChild(clip);
</pre>
<p>ステージ領域から外れたオブジェクトが消えることが確認できます。<br />
しかも、外れたオブジェクトが新たに作成されることも確認できました。<br />
※ステージサイズが550px×400pxで、SWFの表示サイズを600px×480pxにして確認しています。</p>
<div id="Hype05"></div>
<p>（<a href="http://blog.awk2.net/utils/swfViewer.html?name=Hype05&#038;w=640&#038;h=480" target="_blank">別ウインドウで表示</a>）</p>
<p><script type="text/javascript">
swfobject.embedSWF("http://blog.awk2.net/swf/Hype05.swf", "Hype05", "600", "480", "10.0.0", "http://blog.awk2.net/expressInstall.swf", {}, {wmode:"opaque"});
</script></p>
<p>これは、前回の『ランダムにムービークリップを表示する』で記述したSimpleRhythmクラスのメソッドが<br />
一定時間動いてるからです。</p>
<p>次に、ExitShapeTriggerコンストラクタの第5引数について仕組みを考察してみます。</p>
<p>第5引数をfalseに設定してみるとオブジェクトが上に動くことなく、点滅したようになります。</p>
<div id="Hype05_1"></div>
<p>（<a href="http://blog.awk2.net/utils/swfViewer.html?name=Hype05_1&#038;w=600&#038;h=480" target="_blank">別ウインドウで表示</a>）</p>
<p><script type="text/javascript">
swfobject.embedSWF("http://blog.awk2.net/swf/Hype05_1.swf", "Hype05_1", "600", "480", "10.0.0", "http://blog.awk2.net/expressInstall.swf", {}, {wmode:"opaque"});
</script></p>
<p>これは第5引数で、オブジェクトが既にシェイプに入っていると設定しているので<br />
SimpleRhythmクラスのメソッドによって作成された瞬間に<br />
シェイプから外れたと判断され削除の処理が実行されます。<br />
さらにSimpleRhythmクラスのメソッドによって再度作成されるので<br />
ステージを横断することなく点滅してしまいます。</p>
<p>では、第5引数をfalseの状態のまま<br />
オブジェクトが作成した際に既にシェイプに入っている状態になるように<br />
ステージ領域のシェイプを広げてみます。</p>
<p>※一部抜粋</p>
<pre lang="actionscript3">
			exitShape.graphics.drawRect(0, -myHeight*0.25, myWidth, myHeight*1.5);
</pre>
<p>※ステージサイズが550px×600pxで、SWFの表示サイズを600px×720pxにして確認しています。</p>
<div id="Hype05_2"></div>
<p>（<a href="http://blog.awk2.net/utils/swfViewer.html?name=Hype05_2&#038;w=600&#038;h=720" target="_blank">別ウインドウで表示</a>）</p>
<p><script type="text/javascript">
swfobject.embedSWF("http://blog.awk2.net/swf/Hype05_2.swf", "Hype05_2", "600", "720", "10.0.0", "http://blog.awk2.net/expressInstall.swf", {}, {wmode:"opaque"});
</script></p>
<p>正常に動くことが確認できました。</p>
<p>再度、第5引数をtrueの状態に変更します。<br />
そこで今度はステージ領域のシェイプの横幅を半分ぐらい短く設定してみます。<br />
※一部抜粋</p>
<pre lang="actionscript3">
			exitShape.graphics.drawRect(0, 0, myWidth*0.6, myHeight);
</pre>
<p>※ステージサイズが330px×400pxで、SWFの表示サイズを600px×480pxにして確認しています。</p>
<div id="Hype05_3"></div>
<p>（<a href="http://blog.awk2.net/utils/swfViewer.html?name=Hype05_3&#038;w=600&#038;h=480" target="_blank">別ウインドウで表示</a>）</p>
<p><script type="text/javascript">
swfobject.embedSWF("http://blog.awk2.net/swf/Hype05_3.swf", "Hype05_3", "600", "480", "10.0.0", "http://blog.awk2.net/expressInstall.swf", {}, {wmode:"opaque"});
</script></p>
<p>シェイプに入ったオブジェクトだけ、シェイプから外れた瞬間に消えることが確認できました。</p>
<p>最後に、これまでの内容を踏まえコンテンツを次のように調整します。<br />
・第5引数をfalseの状態に変更<br />
・シェイプの横幅をステージ領域に戻し、高さをオブジェクトの生成／削除されるタイミングが<br />
　ステージ上で見えないように調整<br />
・シェイプを非表示に設定（非表示にしても検知可能です。）<br />
・オブジェクトの数を増加（200個）</p>
<div id="Hype05_4"></div>
<p>（<a href="http://blog.awk2.net/utils/swfViewer.html?name=Hype05_4&#038;w=550&#038;h=400" target="_blank">別ウインドウで表示</a>）</p>
<p><script type="text/javascript">
swfobject.embedSWF("http://blog.awk2.net/swf/Hype05_4.swf", "Hype05_4", "550", "400", "10.0.0", "http://blog.awk2.net/expressInstall.swf", {}, {wmode:"opaque"});
</script></p>
<p>段々と形になってきました！</p>
<p>今回は、チュートリアルの26分ぐらいから39分ぐらいまでのお話でした。</p>
<p>調べれば調べるほど興味深いです。<br />
ちゃんと、メモリ管理も考慮して作られています。</p>
<p>指摘等ございましたらご連絡いただけると幸いです。</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.awk2.net/article/201001260931/372/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

