【Unifinity】写真付き電話帳アプリを作ってみよう

ユニフィニティー非公式の記事になります。
モバイルアプリノーコード開発プラットフォームであるUnifinity（ユニフィニティー）で写真付きの電話帳を作ってみました。
カメラで人の写真を撮り、その人の名前、電話番号を入力。
そして一覧から電話番号をタップすると電話がかけられるというスタンドアロンで動くアプリです。
本記事の最後にプロジェクトファイルを添付しています。

動作は以下の通りです。
①プラスボタンをタップすることでカメラが起動
②撮影した写真を表示し、名前、電話番号を入力
③登録ボタンをタップ
④登録したデータが表示、電話番号をタップすると電話がかけられ、削除ボタンをタップすると対象レコードを削除

使っている画面の設定や処理
これらについて説明していきます。サンプルとして活用してください。
１．リスト表示
２．カメラ起動
３．リスト表示から電話をかける
４．データ登録（バイナリデータ、テキストデータ）
５．リスト表示の行削除

細かい内容だとなんらかのボタンをタップした際にメッセージボックスを表示し、「OK」または「キャンセル」の結果によって処理を分岐しています。

１．リスト表示
リスト表示とは作成したテーブルの中身を表として表示する方法です。
この表現が正しいのかは疑問ですが・・・
まずはテーブルを作成後、１レコードを表現したい形で画面を作成します。

その後、ベースとなる画面と前述の明細を紐づけます。
これでリスト表示が完了です。

２．カメラ起動
Unifinityにはカメラを起動し、撮影結果を取得するコンポーネントがあります。このコンポーネントをひとつ選ぶだけで簡単にカメラアプリは作れます。今回はカメラを起動し、撮影すると画面遷移しラベルに写真を貼りつけるのですが、もし、カメラを起動しても撮影をやめてしまった場合には画面遷移すらしない動きをつけています。
カメラ撮影　⇒　撮影結果のバイト数を確認　⇒　０バイトだったら何もしない、０バイトではなかったら画面遷移し、写真を表示

３．リスト表示から電話をかける
リスト表示により、ボタンにはテーブルに登録された「電話番号」が表示されている前提です。
この値を取得し、「ダイアログ/通話」の処理に受け渡しているだけです。

４．データ登録（バイナリデータ、テキストデータ）
データ登録画面で入力したデータをテーブルに格納します。
写真はUnifinityではバイナリデータとして扱われます。写真自体はラベルに表示された値をとってきます。また、それぞれのテキストボックスに入力された値を取得もしてきます。これらをNo.7でテーブルに書き込みにいきます。なお、SQLはUnifintiy上ではこのレベルのアプリでは書きません。

５．リスト表示の行削除
不要なデータは削除したいので、リスト表示の削除ボタンをタップすると対象レコードを削除する処理を作ります。削除は非常に簡単で「データセット/行削除」だけです。なお、No.１でメッセージボックスを表示し、ボタンの種類を「OK/Cancel」としています。OKの場合は「1」Cancelの場合は「2」を処理の結果としています。その結果に応じて削除の実行や何もしないといった制御文を入れいています。

以下にUnifinityのプロジェクトファイルを格納しています。
Zipを解凍して参考にしてください。

写真付き電話帳.zip

1.7 MB

ファイルダウンロードについて

ダウンロード