業務改善と標準化を同時に実現:MS 365業務システム開発

PowerAppsの印刷機能の作り方(ギャラリーの非表示行を印刷する)

    
PowerAppsの印刷機能の作り方(ギャラリーの非表示行を印刷する)
\ この記事を共有 /
PowerAppsの印刷機能の作り方(ギャラリーの非表示行を印刷する)

今日はPowerAppsで作ったアプリをデスクトップで使うときに必須な印刷機能の作り方をお見せします。しかしギャラリーで非表示行は規定では印刷できません。それも印刷できる方法も使う数式も含めてご紹介します。

(動画時間:10:04)

PowerAppsの印刷機能の基本

こんにちは、リーンシグマブラックベルトのマイク根上です。
業務改善コンサルをしています。


今日はこの動画リクエストからです。

PowerApps 印刷機能 動画リクエスト

「新しく追加された印刷機能について紹介してほしいです。」

aoiroさん、動画リクエストありがとうございました。
このコメントを頂いた動画はPowerAppsと
MS Teamsの連携手法の普及によって
MS Accessが終焉するのではないか?、という内容でした。
⇒「MS Accessの終焉?デスクトップでもPowerApps【PowerApps+MS Teams】」

PowerAppsで作ったアプリを携帯端末だけでなく、
デスクトップでも使える業務アプリが普及すると言う話です。
その時はやっぱり画面を印刷したり、
その画面をPDFにしてメールで
送ったりしたいと言うニーズがあるので、
今日はその印刷機能の作り方をご紹介します。

印刷画面の追加画面

これはPowerAppsの開発画面です。
最新のバージョンであれば
「新しい画面」をクリックすると、
「縦長で印刷」や「横長で印刷」で
印刷ができる画面を追加できます。

印刷の見本として普通のボタンを一つ追加します。
画面右上の「印刷」と書いたラベルがあります。
それが印刷ボタンになるのです。
それを使うにはプレビューモードにする必要があります。

その「印刷」ラベルをクリックすると、印刷プレビューが出てきて、
ここで紙に印刷したり、PDFに保存ができるのです。

PowerAppsの印刷プレビュー画面

しかしよく見ると追加したボタンが白黒ですね。
左のペインの「その他の設定」で、
「背景のグラフィックス」にチェックを入れると、
画面通りの印刷ができます。
この部分はPowerApps側から制御できないので、
必要なら毎回ユーザーが手で変更しなければいけません。
この特性を理解してアプリを設計する必要があります。

ところでこのブラウザーはMS Edgeです。
お使いのブラウザーによって見かけは変りますのでご注意下さい。

どんな画面にも印刷機能の追加の仕方

実はこの印刷の画面を使わなくても、
どの画面でも、また、もう作成した画面でも
印刷ができる様にできます。

普通の画面にボタンやアイコンを追加して、
アイコンならその「アイコン」属性から(下図参照)
「印刷」などで検索して、
プリンターアイコンなどに変更できます。

PowerApps アイコンの検索

その「OnSelect」属性に「Print()」と入れるだけで、
印刷機能ができてしまいます。
プレビューモードにして、それをクリックすると、
同じ様に印刷ができます。

さっきと違うのはこの印刷ボタンが
さっきは非表示でしたが今回は見えます。

さっきの印刷ラベルの「Visible」属性を見ると、
次の数式があります。その「Parent」はこの画面の事です。

印刷ラベルの「Visible」属性=
Not(Parent.Printing)

つまり、この画面が印刷中でなければ
「Visible」属性がtrueでこのボタンが表示され、
印刷中なら非表示になります。

この数式をコピーして、新しい印刷ボタンの
「Visible」属性にペーストします。
これで印刷プレビューにすると、
ちゃんと非表示になって同じ状態にできました。
これが印刷機能の基本です。

PowerAppsのギャラリーの非表示行の印刷の仕方

この様に簡単に印刷機能を実装できますが、
残念ながらいくつか問題があります。

例えばギャラリーを追加して、
そのデータが多くてもアプリ内では
スクロールをして他のデータが見えますよね。

しかしこのままで印刷をしようと思ったら、
印刷ボタンを押した時の状態がそのまま印刷されるだけです。
つまり、見えない部分は印刷されません。

これだと実務では使い物になりませんね。
しかし、その非表示部分も印刷ができる様にする方法があります。
次にその方法をお見せしましょう。

次の数式をコピーして、ご自分のギャラリーの
「Height」属性にペーストします。

ギャラリーの「Height」属性=
If(
  Not(Parent.Printing),
  650,
  (Self.TemplateHeight+Self.TemplatePadding)*CountRows(Self.AllItems)
)

その時に元のHeightの数値を残して下さい。
この650を元の数値に変更するのです。

上の数式の意味は
「もし画面が印刷中でなければ、ギャラリーの高さを650にし、
印刷中であれば次の式の結果の長さにする」という事です。

その数式内の各オブジェクトは次の様になります:

  • 「Self」= ギャラリーの事
  • 「TemplateHeight」 = ギャラリーの一番上の高さ
  • 「TemplatePadding」 = 行と行の間の長さ
  • この二つの合計で一行の高さが出ます。

そして最後のCountRaws関数でこのギャラリー内の
データの個数を出しています。
その個数を一行の高さに掛けて、
全データを入れた高さを出しているのです。
つまり、印刷中はこの高さになるのです。

これで一度印刷をしてみましょう。
しかし、まだ全部の行が出てきません。なぜでしょう?
これはギャラリーの高さは増えても、
アプリの画面の高さが変っていなかったからです。
同じ様に印刷中は画面の縦の長さも変える必要があります。

印刷中だけアプリ画面の高さを変える方法

次の数式をコピーして、
それを画面の「Height」属性内にペーストします。

画面の「Height」属性=
If(
  Not(Self.Printing),
  Max(App.Height,App.MinScreenHeight),
  (Gallery1.TemplateHeight+Gallery1.TemplatePadding)*
              CountRows(Gallery1.AllItems)+Gallery1.Y
)

今度の数式には元の数式が入っているので、元の式は削除します。
ギャラリー名の違いからエラーが出ていれば、
ツリービュー内でギャラリー名を「Gallery1」に変更して下さい。
この数式の意味を考えて見ましょう。

今度の「Self」は画面になります。
つまりこの画面が印刷中でなければ、
この画面の高さは元の数式の結果の高さで、
印刷中であれば、次の数式の結果の高さになります。

ギャラリーの「Height」属性に入れた数式では「Self」を使ってましたが、
今度はギャラリーの外から参照するので、
そのギャラリー名を指定しなくてはいけません。
それ以外はほとんど同じ計算をしています。

しかし、最後にギャラリーの「Y」属性の値を加えていますね。
これはギャラリーの縦方向の位置です。
つまりギャラリーの上部分の長さをギャラリー全体の高さに足して、
画面全体の高さを出しているのです。
これでプレビューモードにして、印刷ボタンを押してみましょう。
今度は全行出てきます。

今後のマイクロソフトに改善を期待する印刷機能の課題

今回の例ではギャラリーに12個のデータしかないので、
全てのデータを表示して印刷する事ができました。
しかし、今の状況ではまだまだ課題があります。

残念ながらこの印刷機能は
最初の一ページしか印刷ができないのです。
ここでは縦のレイアウトで下に少し余白があり、
フォントを小さくして行の高さを小さくしたりの
多少の対応はできますが、
明らかに沢山のデータを印刷する事はできません。

更に印刷レイアウトを縦でなく横にすると表示できなくなります。
今回みたいにギャラリーが縦方向であれば、
画面のレイアウトが横で、
印刷のレイアウトが縦である必要があります。

逆にギャラリーが横方向であれば、
画面のレイアウトが縦で、
印刷のレイアウトが横である必要があります。
この様な特性を考慮してアプリの作成をして下さい。

これらの改善を今後のマイクロソフトに期待しましょう。
限定的ではありますが、今回ご紹介した方法で印刷機能を付け、
また作ったアプリをMS Teamsのチャネルのタブにつける事で
簡易業務システムを簡単に展開ができます。
今までにない業務改善のイノベーションを起こして下さい。

初級編:「マイクロソフトPowerApps【コントロールと関数 完全ガイド】」
Udemyオンラインコースを作りました!

⇒ 半額になる「ディスカウントリンクページ」へ

  「こちらの記事も読まれてます。」