![見出し画像](https://assets.st-note.com/production/uploads/images/141006433/rectangle_large_type_2_2ded4a1bbb94b5653d5dd4d5c1bdc8e0.png?width=800)
Teamsチーム予約投稿アプリの作り方〜Teamsに欲しい機能を作れます〜
Teamsチャットには1週間位内のスケジュール送信機能がありますが、チームにはありません。
▼こんなことありませんか?
・チームに予約投稿ができたら、忘れなかったのに…
・時間外にチームに投稿してはいけない会社のルールがある。
このアプリは、30日以内のチーム予約投稿ができる自分だけのアプリです。Power AppsとPower Automateを使ってみたい人向け(初心者の方向け)に、画像を多く使っています。
前提条件
・Microsoft 365のライセンスが必要です。
・Power AppsおよびPower Automateの環境が設定されていること。
・Microsoft Listsが利用可能であること。
・Teamsチームのメンバーであること。
・Power Automateで必要なフローを作成するための権限があること。
※Power Apps、Power Automateは、一番安いBusiness Basicから使うことができます。
チーム予約投稿アプリの要件
・投稿予約は、他のユーザーに見られない。
・投稿をキャンセルできる。
・指定日時で投稿できる(30日以内)。
目次です。5から有料になります。
1.システム構成と全体のイメージ
![](https://assets.st-note.com/img/1716006081174-oTxwpxyDFa.png?width=800)
▼予約投稿
• Power Apps: Teamsチーム予約投稿アプリを使って投稿内容を入力します。
• Microsoft Lists: データベースとして、ReservationTeamsPostリストに投稿内容を保存します。
• Power Automate: フローを利用して、指定日時にTeamsに投稿されます。
▼予約投稿のキャンセル
• Power Apps: Teamsチーム予約投稿アプリで予約投稿のキャンセルをします。
• Microsoft Lists: ReservationTeamsPostリストのStatusを「取り消し処理中」に更新します。
• Power Automate: キャンセルフローを実行し、予約された投稿を取り消します。
• Power Automate: ReservationTeamsPostリストのStatusを「キャンセル」に更新します。
アプリまでは作りたくないという人は、下記noteをご覧ください。ただし、フローのキャンセルや投稿予定のアイテムを見ることは出来ません。
2.紹介動画
手順は、初心者向けに一番少ない手順でできるように、画像150枚くらいあります。
動画をご覧いただき、アプリを作ってみたい方は、手順通りに作成してください。
3.Teams予約投稿リストの作成
Teamsチーム予約投稿アプリのデータソースは、Microsoft Listsにします。
※他のユーザーと共有する必要がないからです(要件を確認ください)。
①Microsoft Listsを開き、「+新しいリスト」をクリックします。
![](https://assets.st-note.com/img/1715995632605-n6hZZnpUsb.png?width=800)
②「空白のリスト」をクリックします。
![](https://assets.st-note.com/img/1715995671418-EvssOMPSM7.png?width=800)
③リスト名の「ReservationTeamPost」を入力し、「作成」をクリックします。
※保存先は、「マイリスト」にします。
![](https://assets.st-note.com/img/1715995700888-HjeSrb4G8E.png?width=800)
④★をクリックし、お気に入りに設定するとMicrosoft Listsのアプリのトップに表示されるので、すぐアクセスできます。
![](https://assets.st-note.com/img/1715995742375-T4j8Z9uPbY.png?width=800)
⑤「+列の追加」をクリックしてリストに列を追加します。列の種類を間違えないように追加してください。追加する列は下記になります。
※間違えた場合は、列を削除してやり直してください。
※Statusの既定値は、「投稿予定」
![](https://assets.st-note.com/img/1715995771198-etyGBDKzJ6.png)
▼間違えそうな列
![](https://assets.st-note.com/img/1715995796961-aK12k739wj.png?width=800)
⑥リストが作成されました。
![](https://assets.st-note.com/img/1715995903122-HWihOJ8Lhu.png?width=800)
リストができたら、次にPower Appsでアプリを作成します。
4.アプリ作成手順〜メニュー作成まで〜
①Power Appsのアプリを開き、「+作成」→「空のアプリ」をクリックします。
![](https://assets.st-note.com/img/1715996078837-xSw6HqqT68.png?width=800)
②「空のキャンパスアプリ」の「作成」をクリックします。
![](https://assets.st-note.com/img/1715996099753-gQo3paCrYM.png?width=800)
③アプリ名に『Teamsチーム予約投稿アプリ』と入力し、「作成」をクリックします。
![](https://assets.st-note.com/img/1715996127330-GioPtf2pWe.png?width=800)
④Screen1が表示されました。
![](https://assets.st-note.com/img/1715996147403-PH3AsKa9hN.png?width=800)
次にデータに「ReservationTeamPost」のリストを接続します。Microsoft Listsでは無く、SharePointのアプリになります。
⑤「データ」→「+データの追加」→『SharePoint』と入力します。「SharePoint」をクリックします。
![](https://assets.st-note.com/img/1715996186693-D7X45G1KEm.png?width=800)
⑥最近利用したサイトには、SharePointサイトが表示されるので、Microsoft Listsの「ReservationTeamPost」リストを開き、URLの自分のアドレスまでをコピーします。
![](https://assets.st-note.com/img/1715996215954-dE1UK4BZGv.png?width=800)
⑦コピーしたURLを貼り付けし、「接続」をクリックし、「ReservationTeamPost」をチェックしたら、「接続」をクリックします。
![](https://assets.st-note.com/img/1715996252485-AqybxNFgnR.png?width=800)
⑧「ReservationTeamPost」リストがデータに接続されました。
![](https://assets.st-note.com/img/1715996286645-T2QhDsGw2H.png)
⑨「データ」→「+データの追加」→『Teams』と入力します。「Teams」をクリックします。
![](https://assets.st-note.com/img/1715996326173-WpSLpucMkT.png?width=800)
⑩「MicrosoftTeams」がデータに接続されました。
![](https://assets.st-note.com/img/1715996351568-iY5lAZCYpi.png)
次にヘッダーを作成します。
⑪「ツリービュー」→「+挿入」→「四角形」をクリックします。
![](https://assets.st-note.com/img/1715996381597-3Y7ZibaAd5.png)
⑫高さ60にしてヘッダーを調整します。
![](https://assets.st-note.com/img/1715996414101-qFdpoqJfBQ.png?width=800)
⑬「+挿入」→「テキストラベル」をクリックします。
![](https://assets.st-note.com/img/1715996438466-qFiuvraMze.png)
⑭フォントサイズ「16」、フォントの太さ「中太字」、色「白」に設定し、ヘッダーの四角形に重ねて表示させます。
![](https://assets.st-note.com/img/1715996460423-goCFIc1BEx.png?width=800)
次にスクリーンの左側に「チーム」「チャネル」を表示させます。ドロップボックスとギャラリーを使います。
⑮Teamsを開き、アプリを開いたときに最初に表示させるチームとチャネルを決めておきます。
![](https://assets.st-note.com/img/1715996494327-Pa79Jwf6bq.png)
⑯「App」→プロパティリストOnStart→fxに下記式を追加します。
ClearCollect(colTeam, MicrosoftTeams.GetAllTeams().value);
Set(gblSelectedTeam, LookUp(colTeam, displayName = "広告宣伝部"));
ClearCollect(colChannel, Sort(MicrosoftTeams.GetChannelsForGroup(gblSelectedTeam.id).value, description, SortOrder.Ascending));
Set(gblSelectedChannel, Index(colChannel,1));
![](https://assets.st-note.com/img/1715996518099-kq1ojbUlkU.png?width=800)
⑰「App」を右クリックし、「On Startを実行します」をクリックします。
![](https://assets.st-note.com/img/1715996540969-fSb4TF82zT.png)
⑱「Screen1」→「+挿入」→入力の「ドロップダウン」をクリックします。
![](https://assets.st-note.com/img/1715996562595-KG6OZhO4ZK.png)
⑲Dropdown1の「詳細設定」→Itemsに『colTeam』を入力し、Valueに「displayName」を選択します。Defaultに「gblSelectedTeam.displayName」を入力します。
![](https://assets.st-note.com/img/1715996582338-NHyGBt4kLf.png?width=800)
次にドロップダウンリストを変更したときに、チームのチャネルが表示するようにします。
⑳Dropdown1のプロパティリストのOnChangeに下記式を追加します。
ClearCollect(colChannel, Sort(MicrosoftTeams.GetChannelsForGroup(Dropdown1.Selected.id).value, description, SortOrder.Ascending));
Set(gblSelectedChannel, First(colChannel));
![](https://assets.st-note.com/img/1715996610772-LqnWxbKfxE.png?width=800)
次にギャラリーを追加して、チャネルが表示されるようにします。ここで最初に設定した「広告宣伝部」の既定で選択するチャネルが何番目かを確認します。
㉑「+挿入」→レイアウト「高さが伸縮可能な空のギャラリー」をクリックします。
![](https://assets.st-note.com/img/1715996638729-z2zcZLaWsf.png)
㉒ギャラリーの位置を調整し、プロパティリストのItemsに『colChannel』を入力し、「挿入ペインで項目を追加する」をクリックします。
![](https://assets.st-note.com/img/1715996674315-nHC0C9Ckoc.png)
㉓「テキストラベル」をクリックします。
![](https://assets.st-note.com/img/1715996733373-XSU63H18ti.png?width=800)
㉔プロパティリストのTextに『ThisItem.displayName』と入力します。ラベルの位置は、ギャラリーの一番上にドラックして移動します。
![](https://assets.st-note.com/img/1715996772038-XZimRe97lL.png)
㉕「ツリービュー」→「Galley1」→「詳細設定」→テンプレートのサイズ『50』、サイズの高さに下記式を追加します。
※位置、サイズ調整はご自身の環境にあった設定にしてください。
Gallery1.AllItemsCount * 60
![](https://assets.st-note.com/img/1715996804891-nBb04hixkJ.png?width=800)
㉖右上にある「▷」をクリックし、ドロップダウンリストで別のチームを選択したときに、チャネルがすべて表示されるか確認します。
![](https://assets.st-note.com/img/1715996842892-h9HCZ1LfmJ.png?width=800)
㉗ドロップダウンリストでチャネル数が多いチームを選択します。
![](https://assets.st-note.com/img/1715996862531-bvraTjzbsw.png?width=800)
㉘既定で表示させるチャネルを選択し、「業務連絡」が上から何番目か確認します。2番目でした。
![](https://assets.st-note.com/img/1715996888564-SsH3ItrdJT.png?width=800)
㉙「App」→プロパティリストOnStartのIndex(colChannel,1))の1を2に変更します。
![](https://assets.st-note.com/img/1715996921945-PzVTGcCc32.png?width=800)
㉚「Gallery1」→プロパティリストDefaultに『gblSelectedChannel』を入力します。
![](https://assets.st-note.com/img/1715996955644-cGEh0irE7E.png)
どのチャネルが選択されているか分からないので、「✓」のアイコンを追加します。
㉛「Label2」を選択し、「+挿入」→アイコン「✓チェック」をクリックします。
![](https://assets.st-note.com/img/1715996983924-3P3UmqFOfl.png?width=800)
㉜アイコンの位置を調整し、プロパティリストVisibleに『ThisItem.IsSelected』を入力します。
![](https://assets.st-note.com/img/1715997035124-PpLFeCUsQS.png?width=800)
次にテストをします。
㉝右上の「公開」→「このバージョンの公開」をクリックします。
![](https://assets.st-note.com/img/1715997059488-Zf7f4Sb0gr.png?width=800)
㉞Power Appsの「アプリ」→Teamsチーム予約投稿アプリの「▷」をクリックします。
![](https://assets.st-note.com/img/1715997080713-PWQe5SJxdf.png?width=800)
㉟アプリの「許可」をクリックします。
![](https://assets.st-note.com/img/1715997102515-Bdt31XKJJ5.png)
㊱チームが「広告宣伝部」、チャネルが「業務連絡」が選択されたことを確認します。
※チームを変更すると、General(一般)のチャネルが選択されます。
![](https://assets.st-note.com/img/1715997127065-CqA5RQA6m3.png?width=800)
次にフォームの作成手順です。
ここから先は
¥ 500
この記事が気に入ったらサポートをしてみませんか?