Powerful Animation
Visual Studio Codeの拡張機能 Powerful Animationが使えそうなので紹介。
SVGをPower Appsで使うことがありますが、" ダブルクオーテーションを' シングルクオーテーションに置き換えなければならなかったりと、少し手間があります。
実際にSVGをPower Appsで描画する場合
"data:image/svg+xml," & EncodeUrl("<svg xmlns='http://www.w3.org/2000/svg'{画像}</svg>")
と式を書かなければならないことが若干手間だったりします。
この部分をクイックにできる拡張機能が Powerful Animationです。
下記のSVGを例にして試してみましょう。
自分で書いたゴリラの絵🦍です
ワンパンマン リスペクト✨
インストール
-
Visual Studio Codeを開き、拡張機能を選択 - Powerful Animationを選択
- インストール
このステップでクイックに準備が完了します。
使い方 Powerful Animations: Convert to Single Quotes
さっそくSVGファイルを開いてみましょう。
Visual Studio CodeでSVGを開きます。
文字列を選択し、コマンドパレットからPowerful Animations: Convert to Single Quotesを実行します。
即座に" ダブルクオーテーションを' シングルクオーテーションに置き換わります。
Power Appsの"data:image/svg+xml," & EncodeUrl("ここに値貼り付け")
スグにPower Appsで表示しやすくなりました。
気の利いた置き換え機能になります。
使い方 Powerful Animations: Prepare SVG for Power Apps
上記の機能では物足りない。理想はワンクリックです。
それをかなえるコマンドがPrepare SVG for Power Apps!!
コマンドパレットに入力して実行。
即座にクリップボードへ、Power Appsで使用する文字列が格納されます。
これをそのままPower AppsのImage コントロールのImageプロパティに貼り付けると・・・
"data:image/svg+xml;utf8, " & EncodeUrl("<~~全ての必要な値が設定されます！
手間があったPower Fxの入力、" ダブルクオーテーションを' シングルクオーテーションに置き換える手間もなく、Cool✨
何かと使えそうですね！
おわりに
今回は便利で要チェックな拡張機能を紹介しました！
Preview段階でインストール数もまだ少ないですね！
アーリーアダプタ感味わえます！
今後の追加機能にも期待大！
Powerな人へ届け！