2017/08/02

Flashコンテンツを HTMLコンテンツに(その2)

ちょっと時間が取れたので、Flaからhtmlにコンバートしたデータを動かしてみました。

オリジナルがHTML+SWFなので、その形を真似てHTMLにAnimate CC がコンバートしたHTMLを移植してみました。しかし、本来表示されるべきリンクボタンはHTMLに記述されていたのですが動作を確認したところ、SWFファイルだったCANVASの下に潜っているようです。

なので、SWFで組み込まれていたHTMLファイルはインラインフレームで呼び出すことにしました。
するといい感じでオリジナルが再現されました。

ですが、よくよく見比べると、SWF側に背景としている画像が貼られていません。
これはパブリッシュの時の設定で、イメージアセットを書き出すのスプライトシートに結合のチェックを外すとうまく読み込んだようでした。

まだ入り口にしか過ぎないファイルで、結構手間取ってしまいました。
前途多難です。

2017/07/31

Flashコンテンツを HTMLコンテンツに

Flashのコンテンツが会社にあります。

いまだに、保守しながら使っています。
ですが、Adobeが「Flash」を2020年末で提供打ち切りを発表しました。

こうなるとFlashでのコンテンツの提供は無理ですよね。
そこで、会社からはHTMLに移行すべき調査するようにとの指示を受けました。

FLAのファイルがあるのでとりあえず変換できるかどうかを試してみました。
Animate CC で読み込んでドキュメントコンバータからHTML5 Canvasを選択し変換します。

変換自体は問題なく完了していますが、正しい動作をするかどうかは別問題です。
それをこれから検証しながら、進めます。

ま、仕事の合間にのんびり進めますけどね。

2014/08/16

Dreamweaverの使い方

新規作成でhtmlファイルを作った後、CSSを読み込みたい場合は以下のような手順で読み込みます。

【CSSファイルの読み込み】
CSSデザイナーのウィンドウを開いて、(+)をクリック。これで、外部のCSSを読み込む事ができます。

2014/07/09

Deamweaverを学ぶにはまずこのサイトから

Creative Cloudを使ってるんだから、Dreamweaverも使わにゃそんそん、って感じでなにかいい学習サイトが無いか調べてみました。

すると、Adobeが提供してしているこんなサイトがありました。

6つの動画があり、ひとつひとつ見ていくと提供されているサンプルのWEBサイトが完成します。
丁寧な解説でわかりやすいです。

動画も5分程度に収まっているので、一本見るのが大変ということもないので、Dreamweaverがこんなかんじかぁってわかると思います。

この動画を見ながらDreamweaverを触ってみたいと思います。

その前にHTML5には文書構造なるものがあるらしく
header:上部につける共通フォーマット、会社のロゴとか。
section:章
article:記事、メイン(DWでは記事と表記)
aside:メインコンテンツに含めない関連コンテンツ、リファレンス情報、短い解説(DWでは付加情報と表記)
footer:下部につける共通フォーマット
nav:サイトのナビゲーション(DWではナビゲーション)
figure:画像

の6つがあります。
Dreamweaverの解説サイトでもその設定から始まっています。
Dreamweaverではその他にメインという項目もあります。(記事とメインの違いが???です)

WEBページのそれぞれのパートに意味を持たせましょってことらしいです。
この基礎知識を持って1本目、2本目を見るといいように思います。

2012/11/29

PhoneGap 2.0をみる(2)方向転換

PhoneGapでiPhoneアプリを作ってみようかと思っていましたが、なんだか環境がないので、大きく方向転換します。

Flashを使ってiOS用のコンテンツを作ってみようと思います。
なんだかんだ言ってもFlashは統合環境だもんね。

どこまでできるかがんばってみます。

2012/11/27

PhoneGap 2.0をみる(1)

PhoneGapが2.0になってます。

書籍「PhoneGapで作るiPhoneアプリ開発入門」でも1.9と2.0があり、2.0についても解説されていますが、基本は1.9。

でも、開発の事を考えると2.0を選択すべきだと思うわけです。いろいろな事が進化する中で、開発環境も進化していただかなくてはならないと思う訳です。

で、持ってる書籍をみてみると、どっから手を付けていいのかわからない状態です。

挫折した、「カメラアプリ」をなんとか作ってみたいと思ってるので、がんばってみます。

2012/10/14

Andorid エミュレータでの実行方法

Dreamweaver と PhoneGapで作られたAndroidのサンプル。
実機があれば、QRコードを読み込んで実機でテストできるできるらしいんだけど、こちとら、自前のAndroid端末なんて持ってないわけで、エミュレータから実行するしかないんですよ。

実際にはAdobe の PhoneGap Buildでビルドされたapkファイルをエミュレータで実行するってことになるんですけど、その方法がわからずてんてこ舞いでした。

いろいろと調べ回ってやっとこさ動かす事ができました。

で、方法は
adb installを実行すること。

知ってる人にとってみれば簡単なことなんでしょうけど、ターミナルを使って adbとうっても

-bash: adb: command not found

と言われるだけ。
調べてみると

./adb

で実行できるらしくやっと使い方がでてきました。

そんなおり、偶然見つけたサイトにインストール方法が書いてありました。

adb installの後に apkのパスを入力すればいいらしいです。

ここまでくればしめたもので、以下のコマンドを実行し

./adb install /Users/MyWorks/PhoneGapByDW/Start/app.apk

見事、エミュレータで実行、確認することができました。
大変でした。

ちなみにapp.apkのパスの入力はファイルをターミナルにドロップすれば、追加してくれますよ。

2012/10/13

PhoneGap 新たなる旅立ち

DWでPhoneGapを使った開発環境を整えてみようと思います。
調べているとこんなサイトを見つけました。

AndroidはSDKをダウンロードして、ZIPを解凍して、適当なところにおいて(自分の場合はアプリケーションフォルダ)DWのPhoneGapの設定でAndroid SDKの場所を指定して、保存。としてみたのですが、

「Androidに指定されたSDKの場所が有効ではありません。設定を検証してください」

とのエラーが出てしまいました。
なので、今度はホームフォルダの中にSDKを移動して、その場所を指定しました。するとエラーはなくなり保存できました。

続いてiOSで出ているエラー

「Signing Key Required 」

の撲滅です。
このエラーの回避のためにはCERTIFICATION ファイルと PROVISIONINGファイルを用意しなくてはいけない様です。

CERTIFICATIONファイルはキーチェーンから書き出して、PROVISIONINGはIOS Develop Centerからダウンロード。

CERTIFICATIONは過去のファイルなどいくつかあったので、削除して、新たに作りなおし、Provisioning ファイルも作り直し、PhoneGap Build のサイトでSign Key を追加。

DWの画面でPhoneGap Buildサービスのアプリケーションを再ビルドをクリック。
iOSも問題なく、ビルドできました。

実際に実行できるかどうか、QRコードを読み取り、実行させようとしたところ、

「Build.phonegap.comにより、PhoneGap Build Applicationがインストールされます」

というダイアログがでて、インストールをクリック。

ダウンロードが始まりました。が、途中で

「Appをダウンロードできません。PhoneGap Build Applicationは現在インストールできません。」

というエラーが発生し、インストールできませんでした。
この、問題の解決方法がわからず、ただいまPhoneGapを使ったiOS開発はできない状態です。


2012/10/06

PhoneGap、カメラが起動しない。(逃亡編)

PhoneGap + xcodeでカメラアプリを作成しようと試みておりました。

PhoneGapは1.9.0。
xcodeは4.5。

ソースを何度も見直し、環境も何か秘密があるのかと思い探ってみたのですが、それらしい情報は手に入れる事ができず、全く進まない状態になってしまいました。

現状、xcodeでの開発はあきらめて、Dreamweaverで試してみようかと思います。

環境の構築からスタートです。

2012/10/05

PhoneGap、カメラが起動しない。(未解決)

PhoneGapを使った開発。実機への転送は成功したのですが、プログラムに問題があるようで、動作しません。

カメラアプリを作ってみたくて、始めたんですけど。

実際に動作していると思われるソースをコピー&ペーストしてみましたが、それでも動作しません。
2種類ぐらい試したのですが、だめでしたね。

この先、進めることができるのかな?