2011年04月17日

パラフラで携帯用アプリを作る

KoolmovesがHTML5をサポートしたので携帯アプリがかけるのかと思っていましたが、どうもキーボードの入力ができません。

そこで、久々にParaflaを覗いてみました。

paraflaはしばらくバージョンアップがなかったので、ここ数年チェックをしていませんでした。

久々に作者のページにアクセスしてみたところページがリニューアルされ、paraflaも新しいバージョンがアップされていました。

そして、以前ダウンロードしたときはまだ携帯用にはちょっと残念でしたが、サンプルを見る限り新しバージョンでは私の携帯でもキーボードを認識していましたので、早速勉強してみようと思います。

paraflaではそのままインストールしただけでいくつかのサンプルが保存されています。

そのなかで、sample07が携帯用のサンプルでした。

sample07ではキーボードの1〜3を使って、砲台の制御をします。

パソコンでも携帯電話でも同じです。

1で砲台が左に、3で砲台が右に、2でミサイルを発射します。

とりあえず下にアップしてみました。

これは動作確認用です。

ソースがありますので確認してみようと思います。






posted by hirano at 22:30| 埼玉 ☁| Comment(6) | TrackBack(0) | Koolmoves | このブログの読者になる | 更新情報をチェックする

2011年02月28日

スライドショーの切り替え

消えてるボタンでフラッシュを切り替えてみたのですが、切り替えるというより新しく現れるようになってしまいました。

画像の右上にマウスを移動してください。

次へボタンが現れますので、そこをクリックしてください。


予め普段は見えていないボタンを作って名前を付けて保存しておきます。

体験版を使っている場合保存ができませんのでその都度作ってください。

普段は見えないボタンをKoolMovesで開いて、Views --> Wizardsでウィザードモードに切り替えます。

New Slideshowで画像を読み込みます。

画像を読み込んだらAdvancedモードに切り替えて画像ごとにTransitionを切り替えます。
posted by hirano at 22:52| 埼玉 🌁| Comment(0) | TrackBack(0) | Koolmoves | このブログの読者になる | 更新情報をチェックする

2011年02月05日

スライドショー

KoolMovesでスライドショーを作成する一番簡単な方法はウィザードを使用することです。

ウィザードだと、6ステップでスライドショーが作成できます。

1.メニューのViewからWizards for Effects/Slideshowでウィザードモードにします。
2.Select a wizard...からNew slideshowを選択します。
3.画像ファイルがいれてあるフォルダーを指定し、「次へ」ボタンを押します。
4.「次へ」を4回押します。
5.「完了」を押します。
6.Ctrl を押しながら、スペースバーを押すとブラウザた立ち上がって、スライドショーを表示します。

ということで、昨年の公民館の文化祭写真をまとめてスライドショーにしてみました。




ちょっと小さいですね。

実は、Wizardでそのまま作ったら、ファイルサイズが60MB以上になってしまい、ほとんど固まったようになってしまいました。

SWFファイルのファイルサイズは5MB以下です。

ということで、上記の手順にするために下準備が必要です。

使用する画像の数が、110枚ですので画像を小さくする必要があります。

そこで使用するソフトが「縮小専用」。

縮小専用で、画像サイズを320x320にします。

エクスプローラで画像ファイルをまとめて選択して、「縮小専用」にドロップします。

すると、画像ファイルのあるフォルダーに、Resizedというフォルダーを作成して、そこに縮小したファイルを作ってくれますので、そのフォルダー名を上記、(3)で、指定します。

ムービーサイズは、320x240としておきます。

posted by hirano at 01:02| 埼玉 ☁| Comment(0) | TrackBack(0) | Koolmoves | このブログの読者になる | 更新情報をチェックする

2011年01月30日

普段は見えないボタン

KoolMovesのサポートフォーラムで、FlashKitというところで見つけたネタです。

マウスが外れると透明になるボタンです。

KoolMovesのファイルもダウンロードできますので、挑戦してみました。

そのままでは大きいので、ムービーサイズは、240x150にしました。

まず透明になる外側の領域を作ります。

長方形を作成し"f"を押し塗りつぶし、ムービークリップに変換します。アイテムの名前は、mc1となります。

mc1を選択した状態で、キーボードの"p"を押します。

図形のプロパティのダイアログが開きますので、Framesボタンを押します。

長方形の名前は、S1となっています。

S1の内側に、ボタンとなる一回り小さな長方形を描き別の色で塗りつぶします。これはS2となります。

S2の内側に入るように、"ボタン"と文字を入れます。

全体を選択し、ムービークリップに変換します。名前がmc2となりますが、ここで、名前をcontentsと変更します。

"p"ボタンを押し、Framesボタンを押します。

S2とボタンの文字を選択し、ボタンに変更します。

"p"ボタンを押し、Statesボタンを押します。Hintが出てきますが、☓で閉じます。

OverとDownの時のそれぞれのボタン色を設定します。

このままではボタンの外側が見えなくなるので、領域の上に文字を入れます。

最後にActionScriptでコードを書き込みます。

"a"キーを押し、以下のコードを記入します。

mc1.contents.alpha=0;

mc1.addEventListener(MouseEvent.MOUSE_OVER,showBar);
mc1.addEventListener(MouseEvent.MOUSE_OUT,hideBar);

function showBar(e:MouseEvent){
mc1.contents.alpha=.5;
}

function hideBar(e:MouseEvent){
mc1.contents.alpha=0;
}



それで出来上がったものがこれです。

写真などの上に置くボタンとして、ぴったりではないですか?







以下は上記のソースです
hiddenbutton.zip
posted by hirano at 00:39| 埼玉 ☁| Comment(0) | TrackBack(0) | Koolmoves | このブログの読者になる | 更新情報をチェックする

2010年10月26日

チョウの作成

KoolMovesでチョウを作ってみました。

これは、英語版HelpManual 30P のOnionSkinningで出てくるものです。

ここではオニオンスキンだけしか、紹介していないのですが、チョウの作成から行ってみました。

手順としては以下の通りです。

まず、チョウの外形から。

片方の羽を作ります。

KoolMovesのツールバーから、Draw Point by point、多角形を使い最初の形です。

多角形ツールを使うと、角のところには、□ が描かれます。

この多角形を変形して、羽にしていきます。

羽にするには、Add curve to shape boundary、曲線の追加ツールを使います。

曲線を追加した部分には、〇が描かれます。

□と□の間には、〇を1個だけ入れることが出来ます。

塗りつぶしツールで、色をつけます。



羽が選択された状態で、Transform --> Rotate をクリックすると、中心点が表示されますので、これを羽の付け根部分に移動します。

更に適当な角度になるように回転後 Edit --> Copu Objectsを行い、次に、Edit --> Paste Objectsをすると、少しずれて羽がもう一枚現れます。

これを、Transform --> Flip Horizontally で水平方向に反転します。カーソルキーを使って付け根がうまく接触するように移動しましょう。

butter2.jpg

時計の形をしたアイコン。Score/Timeline 、タイムラインを表示するとS1とS2という図形が作られています。

両方を選択しムービークリップに変換します。

ツールバーの上から4番目、左側の映画のフィルムのようなアイコン、Create Empty Movieで
マウスをしばらく押さえていると、Convert to Movie Clipと言うアイコンが出てきますのでこれをクリックします。

すると、S1とS2が一緒になり、mc1が作成されます。

ムービークリップの中で、キーフレームのコピーを行います。

はばたかせるために、最初と最後のキーフレームの状態は同じにしておきます。

Main mivieをクリックし、メインフレームに戻ります。

次にオニオンスキンの実行です。

オニオンスキンとは、前後のフレームを薄く表示することにより、動き方が見えるようにします。

Option --> Onion Skinningをクリックして、Onion Skinningのチェックボックスにチェックを入れOKボタンを押します。

いかにもチョウが飛んでいるように移動しながら回転を加えたり、拡大縮小を行ってみましょう。

各フレームのインターバルタイムを2〜3秒としてチョウを移動します。

テストをするには、Ctrl + Spaceで再生します。

うまく羽ばたいたら、File --> Export/Publish MovieでSWFファイルとして出力します。




posted by hirano at 20:55| 埼玉 ☁| Comment(0) | TrackBack(0) | Koolmoves | このブログの読者になる | 更新情報をチェックする

2010年09月27日

フラッシュのためのブログ講習会

先日、近くの公衆施設でフリーのホットスポットがあることを発見した。

そこで早速調査。

ホットスポット名はフリースポットと言ってバッファローのルータを使用したホットスポット。

メールアドレスを利用して認証をとる方式です。

実際にノートパソコンを持っていき使ってみたところあっという間に認証ができてしまった。

学習室からの利用も可能ということで、もしかするとフラッシュの講習会ができるのではないか。

それもネットが利用できることから、より実践的な、ブログを使ってのブログにアップしながら講習を行うことが可能ではないか。

フラッシュでのブログのためには実際フラッシュをアップする環境も必要です。

そこでこのブログ。seesaanetを利用して、

seesaanetにブログを開設。

ブログに記事を書く。

簡単なフラッシュムービーを作成する。

画像の代わりにフラッシュムービーをアップする。

フラッシュはもちろんKoolMovesを使って作成します。とりあえず体験版で行いたいと思います。もちろん希望の方がいれば購入も可能です。

場所はちょっと交通の便は悪いですが、狭山市の智光山公園にある勤労福祉センターです。

数人の打ち合わせスタイルでやる場合は部屋をとらずロビーでの講習も可能と思われます。

もちろんネットの使用料はタダです。

部屋をとったとしても一番安い部屋、一番安い時間の場合500円で借りることができますので非常に使いやすいと思います。

希望などあったらコメントに入れてもらえると助かります。
posted by hirano at 00:48| 埼玉 ☁| Comment(0) | TrackBack(0) | Koolmoves | このブログの読者になる | 更新情報をチェックする

2010年08月06日

バウンシングメニューの改造

バウンシングメニューにドラッグを追加しました。

といっても、メニューですので、ドラッグではなくマウスを乗せるだけです。

ボールの上でマウスをゆっくり移動してみてください。マウスの移動速度の1/5の速度でマウスを追いかけます。

もちろんメニューですからクリックするとそのページにジャンプします。

携帯ではマウスが有りませんから、前回と同じです。

ついでに反射係数もボールごとに乱数で変えて有りますので、Ieのスクロールバーをドラッグするとばらばらに動いてくれます。





posted by hirano at 16:43| 埼玉 ☀| Comment(0) | TrackBack(0) | Koolmoves | このブログの読者になる | 更新情報をチェックする

2010年08月04日

バウンシングリンク

10月18日「ドラッグと衝突」を利用して、リンクにしてみました。

但しドラッグは無し、発射速度はMath.random()でその都度変更です。

携帯でうまく動くか疑問ですが、・・・もちろん、こもれびさんに対抗です。(笑)







リンク先の表示は、マウスを置くと表示しますので、文字数の制限は有りません。

携帯の場合は、上下キーで選択して、センターキーで確定です。
posted by hirano at 17:44| 埼玉 ☀| Comment(0) | TrackBack(0) | Koolmoves | このブログの読者になる | 更新情報をチェックする

2010年07月27日

携帯でも動く電卓

ちょっと未完成ですが、携帯でも動く電卓を作ってみました。

もちろん、KoolMovesです。

まだ、数字キーには対応していません。

カーソルのみで、キー入力します。

デバッグは僕の携帯電話です。

動かなかった人は、機種名を教えてくれるとうれしいです。






posted by hirano at 20:55| 埼玉 ☔| Comment(6) | TrackBack(0) | Koolmoves | このブログの読者になる | 更新情報をチェックする

2010年07月24日

KoolMovesで携帯対応

KoolMovesではどこにも携帯。つまり、cellphoneの記述がないのですが、何とか見つけました。

携帯で表示するには、Flashlite1.1で出力する必要があるのですが、SWF4というのも見つけました。

国産のソフトでは、paraflaとかsuzukaが対応しています。

しかしいまいち使い方が特殊なので、何とかせっかく持っているKoolMovesで作成できないかと思い、いろいろ設定を変えてみました。

デバッグは私の携帯です。機種はdocomoのSH-08Aですので、Flashlite3.1対応です。

そのためどの程度の互換性があるかわかりませんが画面サイズを240x240としてFlash Versionを最低に下げてみました。

結果として私の携帯では再生できたのですが皆さんどうでしょうか。

再生できた方、できなかった方の携帯機種名をコメントでいただけるとうれしいです。




設定は次の通りとしました。 Export SettingsでFlash VersionのExport SWF as versionを「Use above minimum version」に変更して出力です。
posted by hirano at 15:40| 埼玉 ☁| Comment(0) | TrackBack(0) | Koolmoves | このブログの読者になる | 更新情報をチェックする

広告


この広告は60日以上更新がないブログに表示がされております。

以下のいずれかの方法で非表示にすることが可能です。

・記事の投稿、編集をおこなう
・マイブログの【設定】 > 【広告設定】 より、「60日間更新が無い場合」 の 「広告を表示しない」にチェックを入れて保存する。


×

この広告は1年以上新しい記事の投稿がないブログに表示されております。