[Fx0でアプリを作る]Framinでトリガーとアクションを作る

Fx0でのアプリ制作第2弾です。 前回:ビューに画像を追加する 今回は「トリガー」と「アクション」を設定して、「画像をタッチした時に通知を出す」アプリにしていきます。 1:レシピを作成を選択する 早速レシピを作ります。 […]

広告ここから
広告ここまで

目次

    Fx0でのアプリ制作第2弾です。

    前回:ビューに画像を追加する

    今回は「トリガー」と「アクション」を設定して、「画像をタッチした時に通知を出す」アプリにしていきます。

    1:レシピを作成を選択する

    早速レシピを作ります。

    まずはアプリの編集画面から「レシピを作成」ボタンをタップします。
    2015-01-16-19-05-31

    1-1:レシピ名をつける

    レシピ作成画面では「レシピ名」と「トリガー」「アクション」の3つを設定することができます。

    2015-01-18-14-14-53

    ここで「追加」ボタンをタップすることで、トリガーとアクションを設定する画面に移動します。

    余談ですが、画面によって「トリガー」だったり「トリガ」だったりでちょっと表記ゆれがあるみたいです。

    2:トリガーを選ぶ

    ここからは先にきっかけとなる「トリガー」を設定して、その後「アクション」を設定するという流れになります。

    トリガーは以下の9種類から選択します。

    1. タッチ操作をする
    2. 端末を振る(速さ)
    3. 端末を振る(回数
    4. 明るさ
    5. バッテリー
    6. タイマー
    7. アラーム
    8. 天気予報
    9. 画面復帰
    2015-01-18-14-15-012015-01-18-14-15-18

    今回は「画像をタッチた時に通知を出す」操作を追加したいので、「タッチ操作をする」をタップします。

    すると右側の画像のように「タッチする画像」を選択する画面に移動します。

    ここで選択できるものは、「ビュー」で作成したものに限られる様子です。

    2-1:タッチ種別を選ぶ

    タッチ対象の画像を選択した後、「タッチの種類」を設定します。

    説明文をみる限り、「タッチ」「ロングタッチ」「スワイプ」の3種類から選べる様子です。

    2015-01-18-14-15-282015-01-18-14-15-38

    丸部分にタッチ操作を行うと、右側の画像のように設定された「タッチの種類」が表示されます。

    意図した種類になっていれば、このまま「完了」をタップしましょう。

    2015-01-18-14-15-52

    設定した「トリガー」はこのようにレシピ画面から見ることができます。

    「アクション」の設定は、ここから「追加」ボタンをタップすることで行えます。

    3:アクションを追加する

    「アクション」の設定画面では、以下の「アクション」を設定できます。

    1. ビューの画像切り替え
    2. アプリ起動
    3. 通知
    4. 音声出力
    5. バイブレーション

    今回は「通知」をタップして、通知メッセージを設定します。

    2015-01-18-21-44-322015-01-18-14-16-36

    通知メッセージの編集画面では、「通知タイトル」と「通知内容」を設定できます。

    「プレビュー」をタップすることで通知の表示具合を確認できます。

    3-1:レシピを保存する

    先ほど作成した通知を保存すると、以下のように「トリガー→アクション」という構図でレシピが作られます。

    ボタンを見るに「差し込み」や「順序入れ替え」、「ループ」なども行えそうですが、それはまたの機会にしましょう。

    「レシピ作成」画面で「完了」をタップすると、レシピ作成が完了します。

    2015-01-18-14-16-502015-01-18-14-17-12

    保存した「レシピ」は、右側の画像のように表示されます。

    「レシピ」を組み合わせることで、様々な操作に対応できそうですね。

    4:動かしてみる

    最後に「レイアウト確認」で実際に動かしてみます。
    2015-01-18-14-17-24
    画像を長押しすると、上部に通知テキストが表示されました。

    今回は簡単な設定のみでしたが、トリガーを組み合わせて設定することなどもできそうなインターフェイスですのでなかなか奥が深そうな気配です。

    次回は「ビューの組み合わせ」か「トリガーの組み合わせ」について紹介できればと思います。

    広告ここから
    広告ここまで
    Home
    Search
    Bookmark