Home

STUDIO KINGDOM

Flash CS3に入門してみた

ので、ちょっとまとめておく。ちなみにFlashといっても、デザイナー等の芸術家向けのアニメーションタイプとプログラマー向きのアプリケーションタイプがあるとして、もちろん後者のアプリケーションタイプをターゲットにした内容になっています。

インスタンスのタイプ

インスタンスのタイプには以下の3つがある。

  • ムービークリップ
  • ボタン
  • グラフィック

ムービークリップとグラフィックの違いがよく分からない。つまづく人は多いはず。大きな違いはActionScriptが「書ける/書けない」ということらしい。ムービークリップシンボルとグラフィックシンボルの違いは? – 教えて!goo

フレームについて

image

白マル 空白キーフレーム ムービークリップなどが何も無い状態が開始されることを示す。
他にレイヤーが無ければ、何も表示されないことになる。
黒マル キーフレーム ムービークリップなどが初めて登場することを示す。
a 小文字のa アクションスクリプト アクションスクリプトが書かれているフレーム。
白い長方形 フレーム終了 続行されてきたキーフレームの状態が終了するフレームであることを示す。
上記以外 通常のフレーム 前方のキーフレームの状態をキープする。

ActionScript用のレイヤーを用意する

ActionScriptをフレームに書く場合、ActionScript用のレイヤーを作り、そちらにまとめるようにする。

image

よく使うショートカット

F5 フレームの追加
Shift + F5 フレームの削除
F8 シンボルに変換
F9 アクションパネルを開く
Ctrl + Enter ムービープレビュー

フレームアクションと描写

フレームアクションは、そのフレームに再生が移ってきたタイミングで実行されるらしい。1フレームだけの場合にフレームアクションが繰り返されないのは、「1フレーム目⇒1フレーム目⇒1フレーム目」となり、再生が移ってきたという判定がされないからなのであろう。ちなみにfpsとは1秒間に何コマ再生されるかということ。

変数の宣言

var n:int = 10;
var str:String = "Flashcs3";
var mc:MovieClip = new MovieClip();var value:*

コロンで区切って型を指定することによって、コードヒントが使えるようになる。型を厳密に指定しない場合は、4行目のように指定する。

アクションスクリプトはで来るだけ一箇所(1フレーム内)に収める

そうすることで以下のメリットがある

  • 処理が細切れにならず、一箇所を確認するだけで全体の流れを把握することが出来る。
  • 一箇所にまとめたスクリプトと一緒にムービークリップをシンボル化すると、扱いやすいシンボルになる。前述した1フレームの場合に、フレームアクションが繰り返されないという特性を利用できる。

タイムラインが読み込まれる順番

タイムラインは一番階層が上のメインフレームから下の階層に向かって順番に読み込まれる。同じタイムライン上で、初めてそのタイムラインに登場するムービークリップに対して上の階層からアクセスしようとすると値を取得することが出来ない。この問題は必要な場合は、処理を関数として予め宣言し、読み込んでおくことで解決できる。

Windows + Xampp環境にAkelosで簡易Blogを作ってみる(3)

前回の「Windows + Xampp環境にAkelosで簡易Blogを作ってみる(2)」からの続きです。
この記事はAkelos公式サイトの解説動画を参考にしています。

1). 多言語対応を試してみる

Akelosはデフォで多言語に対応するための仕組みがあるようです。インストール時にen,jaなどを入力したのはこのためだったようですね。app/locales/blog/jp.phpを開いて、$dictionary['The Akelos Blog'] に格納されている値を日本語の任意の文字列に変更してください。一覧ページのタイトルが変更されていることを確認できると思います。

image

ここで、「http://localhost/en/blog/listing/」を開いてみましょう。タイトルは元の「The Akelos Blog」であることが確認できると思います。en.phpもjp.phpと同じフォルダ内に存在します。この機能と.htaccessを使えば、多言語対応のサービスが簡単に作れそうですね。

2). ログをとる

config/config.phpを編集して、ログファイルを出力するように設定を変更します。、boot.phpのインクルード処理の前にAK_LOG_EVENTSを定義します。

define('AK_LOG_EVENTS', true);
include_once(dirname(__FILE__).DIRECTORY_SEPARATOR.'boot.php');

登録や更新処理を行うとlog/development.logが生成され、ログ出力されていることを確認できると思います。

3). ユニットテスト

ユニットテストを試してみます。test/unit/app/modelsに生成したモデルに合わせて、ユニットテスト用のファイルが格納されているので、testコマンドで実行してみます。

php test ./unit/app/models/post.php

コマンドが実行された後、1件の失敗があることを確認できると思います。

image

では、テストが通るパターンを試してみましょう。test/unit/app/models/post.phpを開き、test_should_be_added()関数を下記のように書き直します。

function test_should_be_added()
{
$Post = new Post(array('title'=>'First test post', 'body'=>'Say hello'));
$Post->comment->create(array('body'=>'hello!'));
$Post->save();
$Post->reload();

$this->assertEqual(1, $Post->comment->count());
}

また、test/unit/app/models/comment.phpのtest_should_be_added()関数の中身は全てコメントアウトし、app/installers/comment_installer.phpの初期コメント生成の処理もコメントアウトします。

//$Post = new Post(1);
//$Post->comment->create(array('body'=>"コメントをどうぞ。"));
//$Post->save();

再度、コマンドを実行します。

php test ./unit/app/models/post.php

今度はテストが通ったことを確認できると思います。

image

解説動画では、Akelosコンソールで更に何かをしているようですが、あまり重要そうではないので省きます。

まとめ

解説動画を元に実際にAkelosをインストールして、簡単なBlogの作成、ユニットテストまで行いましたが、バージョンの違いのせいか、ところどころ異なる点がありました。ただ、触っていて感じたことは、「噂どおりCakePHPより良さそうだ」ということです。2つのフレームワークの比較について、時間があればまた記事にしてみたいと思います。

Windows + Xampp環境にAkelosで簡易Blogを作ってみる(2)

前回の「Windows + Xampp環境にAkelosで簡易Blogを作ってみる(1)」からの続きです。
この記事はAkelos公式サイトの解説動画を参考にしています。

1). 部品の共有化

エントリー内容を表示する部分を共有化します。新しくapp/views/blog/_post.tplファイルを作成し、app/views/blog/show.tplの下記のソースをコピー&ペーストしてください。

・_post.tpl

    <hr />
    <h2><?php echo $url_helper->link_to($post->title, array('action'=>'show', 'id'=>$post->id)); ?></h2>
    <p><?php echo $text_helper->textilize($post->body); ?></p>
    <p><small>{post.posted_at}<?php echo $blog_helper->link_to_edit($post); ?></small></p>

次にこの部品化された_post.tplをshow.tplとlisting.tplから呼び出します。app/views/blog/show.tplとapp/views/blog/liting.tplを下記のように書き直してください。

・show.tplのshowブロックを下記のように書き換え

  <div class="show">
    <?php echo $controller->render(array('partial'=>'post')); ?>
  </div>

・liting.tplのcontentブロックを下記のように書き換え

<div id="content">
  <h1>_{The Akelos Blog}</h1>
  {?posts}
     <?php echo $controller->render(array('partial'=>'post', 'collection'=>$posts)); ?>
  {end}
</div>

ソースを書き直したら、ブラウザで今まで通り問題なく処理されていることを確認してください。

2). コメントテーブルを作成

コメント機能を実装するためにCommentモデルを作成します。下記のコマンドを実行してください。上手くいかない場合は最後に–forceを付けて実行してください。

php generate model Comment

次はapp/models/comment.phpとapp/models/post.phpにお互いの依存関係をソースに追加します。

・comment.php

<?php
class Comment extends ActiveRecord
{
  var $belongs_to = 'post';
}
?>

・post.phpのfunction validate()の上に追加

<?php
class Post extends ActiveRecord
{
	var $has_many = 'comments';

	function validate()
	{
		$this->validatesPresenceOf('title');
	}
}
?>

次にapp/installers/comment_installer.phpを下記のように書き換えます。

<?php
class CommentInstaller extends AkInstaller
{
    function up_1()
    {
        $this->createTable('comments', "
          id,
          body,
          post_id
        ");

        AK::import('post,comment');

        $Post = new Post(1);
        $Post->comment->create(array('body'=>"コメントをどうぞ。"));
        $Post->save();
    }

    function down_1()
    {
        $this->dropTable('comments');
    }
}
?>

installerファイルを作ったら、コマンドを入力してテーブルを作成します。

php migrate comment install

commentテーブルが作成され、レコードが1つ作成されていることが確認できると思います。このコメントをshowページに表示させるため、app/controllers/blog_controller.phpとapp/views/app/views/blog/show.tplにソースを追記します。

・blog_controller.phpのshowアクションのfind関数の引数にコメント情報を追加します。

function show()
{
    $this->post =&amp; $this->Post->find(@$this->params['id'], array('include'=>'comments'));
}

・show.tplのcontentブロックの最後に追加します。

<h2>_{Comments}</h2>
{loop post.comments}
  <hr />
  <p>{comment.body}</p>
{end}

showページをリロードしてコメントが表示されていることを確認してください。

image

3). コメント欄を実装

app/views/blog/show.tplにコメント欄のソースを追加します。先ほどのコメントを表示するソースの後に追加します。

  <h3>_{Add a comment}</h3>
  <?php echo $form_tag_helper->form_tag(array('action'=>'comment', 'id'=>$post->id)); ?>
    <?php echo $form_helper->text_area('comment','body'); ?><br />
    <?php echo $form_tag_helper->submit_tag("Comment!"); ?>
  </fom>

app/controllers/blog_controller.phpに、commentアクションを追加します。

  function comment()
  {
    $Post = $this->Post->find($this->params['id']);
    $Post->comment->create($this->params['comment']);
    $Post->save();

    $this->flash['notice'] = $this->t('Your comment was successfully added');
	$this->redirectTo(array('action'=>'show', 'id'=>$Post->id));
  }

showページに入力欄が表示されます。コメントを入力して、正しく動作しているか確認してください。

image

次回に続きます。

Home

検索
フィード
メタ
お城
STUDIO KINGDOM

Return to page top