三島正裕のOffice365コラムOffice365徹底活用編(第3回)~PowerAppsでモバイル掲示板を作成しよう~

  • 2018/6/14

先日、MicrosoftウェビナーにてPowerAppsを使ったモバイルアプリケーションの作成方法について説明をさせて頂きました。「働き方を変えてみよう」ということで当社の活用事例を紹介させて頂きながら、モバイルアプリケーションが出来上がるまでの過程をスライド形式で説明をさせて頂いたのですが、たくさんの方々にご視聴頂いたようで大変嬉しく思います。ご参加頂いた視聴者の皆様方、お忙しい中本当にありがとうございました。
さて、ウェビナーの中でもご案内させて頂いたとおり、今回のコラムではPowerAppsを使ったモバイル掲示板の作り方について説明をさせて頂きたいと思います。データソースは前回SharePoint Onlineで作成しましたリスト「行動予定掲示板(list_ActivityBoard)」を使います。リストの作成方法がわからない方は前回の記事を参考にして下さいね。
前回の記事:SharePoint Online で掲示板を作成しよう
https://www.si-jirei.jp/2018/05/31/office365%E3%82%B3%E3%83%A9%E3%83%A0-2/

1.PowerAppsとは

今回のコラムで取り扱う「PowerApps」ですが、ご存じないという方もおられるかもしれませんので、簡単に製品について紹介をさせて頂きます。PowerAppsというのはOffice365のアプリケーションの1つで、モバイルアプリケーションを作成することが出来ます。一覧表やグラフも自由なレイアウトで作成することが可能で、分析ツールを埋め込んでデータを可視化したり、画像や地図情報等のコンテンツを作成して埋め込んだり、スマートフォンに内蔵されているカメラやコンパス、加速度センサーやGPSなどの情報も取得することができます。こうした情報とリアルタイムに連携したアプリケーションが簡単に作成出来てしまうのがPowerAppsです。

2.SharePoint Onlineからアプリケーションを作成する

SharePoint Onlineでリストが完成しているならば、PowerAppsでアプリケーションを作成するのは非常に簡単です。開いたリストの上部に「PowerApps」と書かれたボタンがありますので、そこから「アプリの作成」を選択します。すると「アプリの作成」ウィンドウが開きますので、アプリ名を入力します。ここでは「ActivityBoard」と入力しておきます。


「作成」ボタンを押すと「アプリのビルド」が始まり、しばらくするとPowerAppsが起動し、アプリケーションが作成された状態で表示されます。

3.ラベルを追加する

アプリケーションを作成した時点では、ギャラリー(BrowseGallery1)に帰社時間が表示されていませんでしたので、帰社時間を表示するためのラベルを追加します。①メニュー「挿入」から「ラベル」を選択して、②ギャラリーの任意の場所に追加します。③ラベルの追加が出来たら、パラメータTextを「ThisItem.ReturnTime」に書き換えます。すると帰社時間が表示されるようになります。

4.画像データを張り付ける

顔写真も入れてみましょう。今回はフリー素材から顔のデータを10枚用意致しました。ギャラリーに写真を埋め込むためにはExcelのテーブルを使用します。Excelでのテーブルの作成方法は今回割愛させて頂きますが、テーブルの列には、Image [image]、__PowerAppsId__、Nameの3列を設定します。Image [image]には写真ファイルのパスを設定します。テーブル名はActivitiyBord_faceとします。

OneDriveにはこのように配置します。場所は任意の場所で良いのですが、顔写真を入れたフォルダとExcelファイルを同じ場所に設定します。


アップロードしたExcelに接続してみましょう。メニューにある「ビュー」から「データソース」をクリックすると、下図のようなメニューウィンドウが表示されますので、「+データソースの追加」を選択します。データソースは「OneDrive for Business」を選択して「作成」ボタンを押します。Excelファイルを置いたOneDrive for Businessのフォルダを選択してExcelファイルを開くと、テーブル「ActivitiyBord_face」が表示されますので、チェックをつけて「接続」ボタンを押します。


続いて一覧に写真を貼り付けたいと思います。「メディア」から「画像」を選択して、任意の位置にアイテムを張り付けます。初期表示としてサンプル画像が表示されていますので、これをOneDriveに保存した画像を表示するようにします。画像の張り付けにはLookUp関数を使います。LookUp関数は、テーブル内で数式を満たす最初のレコードを検索します。データソースは「ActivitiyBord_face」、条件には「テーブルのNameがギャラリーのNameと一致する場合」と設定し、結果には列名Imageを返すように設定しています。これでOneDriveに保存した画像が表示されます。

Print Friendly, PDF & Email

1

2

Related post

更新情報

更新情報

ログインステータス

Return Top