RAD Studio 勉強会 @ 大阪 14/09/27

TEffect を使った綺麗な Form

システムプランベネックス 毛利

appmethod 含む

自己紹介• 毛利と申します

XE7 から *.fmx が複数作られます

• 注意点

マスタ以外の form 名は、いじらない ( 理解できているなら大丈夫です )

*.fmx が増えるだけなので fmx ファイルに書き込まれるファイルはプロパティはそれぞれで別です

Platform ごとの *.fmx はこんな感じですForm1.iPhone4in.fmx ←iPhoneForm1.LgXhdpiPh.fmx ←Android5 インチForm1.SmXhdpiPh.fmx ←Android3.5 インチForm1.Macintosh.fmx ←MacOSForm1.pas ← マスタ (Win)

Unit1.pas に呼出す fmx ファイルが書かれています

{$R *.fmx}{$R *.iPhone4in.fmx IOS}{$R *.LgXhdpiPh.fmx ANDROID}{$R *.SmXhdpiPh.fmx ANDROID}{$R *.Macintosh.fmx _MACOS}

なので解っていれば特にこの規則に従わなくても大丈夫だと思います

C++Builder の場合は#pragma resource "*.fmx"#pragma resource ("*.NmXhdpiPh.fmx", _PLAT_ANDROID)#pragma resource ("*.iPhone4in.fmx", _PLAT_IOS)

試してみます• マスタ以外で Effect コンポーネントを別の TPanel コン

ポーネントの上に置くと置けません

*. iPhone4in.fmx では移動できません でもマスタは移動できます

コンポーネントの削除もマスタから

• 他の fmx ファイルから削除すると

ご注意ください

Timage も同じく fmx ファイルが違うので結果は違います

• マスタ fmx の場合

*. iPhone4in.fmxはこんな感じです

配置の順番を変えると• マスタ側で先に画像まで埋め込んだ

Timage を作るとほかも反映されます

⇒

*. iPhone4in.fmxはこんな感じです

いじってたらマスタ fmx 以外壊れたりして空っぽになったりしました ( ・ _ ・ ;)XE7 のバグ？

ターゲットデバイスが 1 種類なら

• Android/iPhone などターゲットが固定ならマスタだけで設計しても問題無いと思います

• マスタだけを使う場合 Form のサイズだけを気にするようにすれば良い

複数 *.fmx での注意まとめ• 何事もマスタで関係性だけを作ります

• それ以外のプロパティなどはそれぞれのfmx ファイルのプロパティを変更して OKです

• あまりにも fmx どうしが違うと壊れてマスタだけの情報になったりしました ( ・_ ・ ;)

TEffect

• 業務用アプリとしては使わないのでしょうか

• 業務用タブレットでも楽しい動きが欲しい

TShadowEffect デモ

実行⇒

できました完成ですｗｗコードは 1 行も書かなくて OK です

これ C++も Delphiも同じです

次は動きのある Effect コンポーネントを使ってみます

このあたりの Effect コンポーネントが動画に動きがあるものです

デモります

TDissolveTransitionEffect を使って画像を変化させてみましょう

実行⇒

パワポではわかりにくいですが 実行すると初音ミクと IA の画像が混ざって行く様子がわかります

AnimateFloat メソッドを使って動きのある処理に変えてみましょう

• AnimateFloat() は TFmxObject からあるメソッドなので TFmxObject 継承されているFire Monky のコンポーネントはほとんど実装できます

• 内部的に TFloatAnimation を Create してくれて勝手に Start してくれます

AnimateFloat メソッドを使って動きのある処理に変えてみましょう

• コンパイル時にこんな注意が。。。

でも僕は使いますｗTTrackBar の value で警告は良いんですけどTefect にも出てくるなんて

AnimateFloat 使い方• FireMonky の Visual コンポーネント上で例えば Tbutton: Button1 の場

合

Button1.AnimateFloat(‘Position.Y’, 0, 2); こんだけ書いておけば Button1 が一番上 (Position.Y:=0) に 2 秒間使って移動します

先ほどのミクと IA が混ざる Effect 処理をAnimateFloat 使ってみましょう

タイマーコンポーネントのイベントハンドラーからDissolveTransitionEffect1.AnimateFloat を実行してみます

Button を実装してボタンイベントでも OK です

実行してみます

DissolveTransitionEffect1.AnimateFloat が動いているのが確認できます

実装も簡単です• タイマーイベントにほんの数行の処理だけです

Effect かけたあとのデータって保存したいですよね？

• 可能ですTbitmap を作って Image1 の内容をコピーしますその後その Effect でDissolveTransitionEffect1.ProcessEffect();メソッドを実行すれば目的の Tbitmap に Effect 処理がかけれます

ProcessEffect メソッドは Teffect で実装されているので継承されているクラスならすべて持っています

TMultiView は便利です• これ Tpanel で実装してたと思いますがかなり使えそうです• 設定も簡単ですボタンをプロパティに入れるだけです

コード書く必要が無いのでTMultiView 貼ったら実行してみますｗ

デモ実行します

以上• ありがとうございました