技術情報ブログ
Power Platform
2022.02.09

Power Apps キャンバスアプリを用いて、年月のみで日付を表示・選択する方法(2)【SharePointリスト側の処理】

エンジニア募集しています

アーティサンではローコードエンジニアをはじめ、クラウド開発者やコンサルタントなどを募集しています。
アーティサンの仕事内容や転職にご興味のある方はこちらもご覧ください。

こんにちは。アーティサン株式会社の小刀稱(ことね)です。

通常このような場合、デートピッカー(DatePicker)を用いることが一般的です。
しかし、デートピッカーは年月日(例:2021年12月7日)までを必ず選択する必要があります。

Power Apps キャンバスアプリでのデートピッカー
Power Apps キャンバスアプリでのデートピッカー

よって、年月(例:2021年12月)のみで日付を表示・選択したい場合には、デートピッカーでの運用は向いておりません。

そこで本連載では、ドロップダウンを用いて、年月のみで日付の表示・選択を行う方法についてお伝えします。

前回までの内容は、以下をご参照ください。

前回、「データテーブル・ギャラリーを修正」までご紹介しました。
今回は、SharePointリストの表示を変更するについてお伝えします。

 

SharePointリストの表示を変更する

SharePointリストの列の表示を日付(年月のみ)とする方法について説明します。

変更方法としては以下2通りの方法があります。

それぞれの方法を以下で説明します。

 

新しい列を追加し、数式を用いて表示方法を設定

新しい列を追加し、以下の設定を行います。

SharePointリストの新しい列(数式)
SharePointリストの新しい列(数式)

ポイントとしては=TEXT(日付,”yyyy年MM月”)の部分です。

事前に作成していた「日付」列の値から、年月のみを表示するように設定しています。
SharePointリストを表示してみましょう。

年月のみ表示されている列が新しく追加されました。

SharePointリスト-編集後(数式)
SharePointリスト-編集後(数式)

このままでは、「日付」列と「日付(年月)」列の2つが表示されてしまいますので、ビューから「日付」列を削除するなどの対応を行ってください。

 

既存列の書式設定をJSONにて設定

「日付」列の書式設定から、以下JSONを記載します。

{
    "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
    "elmType": "div",
    "txtContent": "= getYear(@currentField) + '年' + getMonth(@currentField) + '月'"
}
SharePointリストの書式設定(JSON)
SharePointリストの書式設定(JSON)

ポイントとしては「数式」項目の
txtContent”: “= getYear(@currentField) + ‘年’ + getMonth(@currentField) + ‘月'”の部分です。
@currentFieldが「日付」列に格納されている実際の値であり、getYear・getMonthを用いて、年及び月を取得しています。

上記設定により、「日付」列の表示を変更することができました。

SharePointリスト-編集後(JSON)
SharePointリスト-編集後(JSON)

 

SharePointリストの表示を変更する際のメリット・デメリット

上記2つの方法について、メリット・デメリットをまとめました。

 

メリット

デメリット

新しい列を追加し、
数式にて表示方法を設定

・コーディングの知識がほぼ不要

・新しい列を別途追加する必要あり

既存列の書式設定をJSONにて設定

・新しい列を追加する必要なし

・コーディングの知識が必要

「新しい列を追加し、数式にて表示方法を設定する」方法は、コーディングの知識がほぼ不要であるため、作成する難易度は低く、お手軽に実施することが可能です。
しかし、新しい列を別途追加する必要があります。

一方、「既存列の書式設定をJSONにて設定」する場合は、新しい列を追加する必要がありません。
しかし、多少コーディング(JSON)の知識が必要となるので、実装するためのハードルが高くなってしまいます。

 

本連載では、Power Apps キャンバスアプリを用いて、年月のみで日付を表示・選択する方法について紹介しました。
今回ご紹介した内容を、活用いただければ幸いです。

 

 

 

弊社ではPower Platform(Power AppsやPower Automateなど)を用いてお客様の業務を自動化するご支援を数多く承っております。

業務の中で、「普段手動でやっている業務を自動化できないか」というような疑問がある場合には、お気軽にアーティサン株式会社までお問い合わせください。

Power Platform(SharePoint・Power Apps・Power Automate)に関する営業活動や設計、開発などを担当:小刀稱知哉

小刀稱知哉

大分県出身(温泉大好き♥♥)、現在は東京都在住

1990年4月9日生まれ

30才にしてメーカーの技術営業からIT業界にジョブチェンジ!!!

趣味は読書

Power Platform(SharePoint・Power Apps・Power Automate)に関する営業活動や設計、開発などを担当しております!

シェアする
記事カテゴリ
最新記事
2023.05.17

Microsoft Loop を使ってみよう

2023.04.19

Power Apps:キャンバスアプリでレスポンシブ レイアウト対応のアプリを作成する際の設計方針(4)

2023.04.07

Power Apps:キャンバスアプリでレスポンシブ レイアウト対応のアプリを作成する際の設計方針(3)

2023.03.23

Power Apps:キャンバスアプリでレスポンシブ レイアウト対応のアプリを作成する際の設計方針(2)

2023.03.03

Power Apps:キャンバスアプリでレスポンシブ レイアウト対応のアプリを作成する際の設計方針(1)

2021.06.23

【Power AutomateでExcelデータをSharePointにインポートするために考えること 第1回】4つのシーンごとに手法を比較、その最適解とは?

2
2021.07.14

【Power AutomateでExcelデータをSharePointにインポートするために考えること 第2回】フロー作成でエラー発生!

3
2021.09.03

【Power AutomateでExcelデータをSharePointにインポートするために考えること 第8回】トリガーの条件の指定方法

4
2020.10.02

世界に広がる Power Apps「モデル駆動型アプリ」のココがスゴイ!【第1回】

5
2022.02.16

SharePointのビューに擬似的なアクセス制限をかける方法(1)

--------------------------------------------------->
モデル駆動型アプリPower AppsPower PlatformSharePointExcelPower AutomateC#attributevalidationローコードAngularAccessInfoPathMatTableAngular Materialデータ構造SortByColumns関数TypeScriptHTMLEF CoreマイグレーションFramework CoreAttribute directivesO/Rマッパーazure sql databaseCase式HTTP RequestCSSxUnit.Net Core 3.1VSCode.Net Core Test ExplorerDataverse for Teamsitem関数Google MapsMarker ClustererRANK()関数Dynamics 365 SalesMicrosoft TranslatorマーカークラスタリングライブラリtailwindcssマルチテナントドロップダウンメニューBreakpointObserverメディアクエリスマホPCレスポンシブ入門初心者中級者キャンバスアプリDatePickerDropdownビューアクセス制限承認リマインドSetForAllUpdateContextロードマップ技術ItDX情報技術メッセージIDメールfirst()関数nest入れ子動的リストcollectionコレクション複数の添付ファイル承認フローformエクスポートインポートカスタマイズcomponentダイアログコンポーネントdialogTips新機能変数検索Microsoft 365グループセキュリティグループ送信元メールの送信差出人インスタントクラウドフロー自動化したクラウドフロー委任VBAエラーエクセルerror復元restorePower BI個人列ユーザー列SharePoint Onlineリスト非表示アプリ[市民開発者構築自動化したクラウド フローフローの種類インスタント クラウド フロースケジュール済みクラウド フローレスポンシブ レイアウトresponsive layoutLoopMicrosoft
PageTop
ページトップに戻る