Photoshop UXP、サポートされていない機能

UXP

Photoshop UXPの開発について今回特にサポートされていない事、現状できないことを中心に書いていきます。CEP経験者なんかはドキュメントを結構飛ばして読んでしまうと思いますが結構サポートされていない機能、意外な仕様が多いです。

そもそもUXPのシステムは完全なブラウザベースのパネルではない

CEPはgoogle Chromiumベースのシステムでした。つまりほとんどGoogle ChromeをベースにしたシステムであったのでブラウザでサポートしているCSS,HTMLに関してはよほど新しいものでない限りCEP上では動くものでした。それに対してUXPは基本は同じですが完全なブラウザベースのシステムでは無いということ。さらにまだ開発途上ということもあり現状サポートされていないCSS,HTML,JSの機能があるという事です。詳細はこちら The UXP Technology Stack
これに関しても当初は一部だけかと思ったら結構ありました(汗)というわけでいくつか不明点も含めて取り上げます。

サポートされいない機能

What’s Unsupported in UXPを読むと大体わかります。とりあえずドラッグアンドドロップがサポートされていません。(すぐにサポートされるようになるとは書いていますが)html canvasなんかは使う方も多いでしょう。cssはfloatのみサポートされていないと書いていますがこれは後述しますが他にも色々あります。フレームワークのVueも公式にはできないとなっています。(ただ使用に成功した者もいるみたいです)その他getElementsByClassNameがサポートされていないから代わりにquerySelectorAllを使えとかここを読まなかったらずっと気づかないままコードと睨めっこしそうです。

CSS

ここにCSSのリファレンスがあります。一見すると単にMDNにも載っているCSSの基本の機能を羅列しているだけに見えますというか僕はそうなのかと思いました、しかしCSSのリファレンスにしては圧倒的に量が足りていません。例えばgridレイアウトがありません。displayのページでも触れられていません。ここで軽く触れられていますがサポートされていません。実際使ってみたらまっさらなパネルしか表示されなくて焦りました。その他transitions、animationsもサポートれていません。できたらこちらもできる限り読んだ方がいいでしょう。

よくわからない仕様の新機能

前回の記事で載せたとおり今回複数のパネルの機能等をmanifest.jsonとentrypointsオブジェクトのsetupメソッドで設定できます。そこにはパネルが表示された時、消えた時のイベントの発火時の関数も設定できますがshowメソッド除いてhideやdestoryのイベントは発火条件が謎なくらい発火の瞬間を確認できませんした。ただしここのEventsを読む限りhideは現状発火しないみたいなことが書いています。パネルを管理するオブジェクトに関しては以下、サンプルコードも載せておきます。

XDのページも見てみる。

Photoshop UXPページで発見できなかったメソッドがいくつかXDの方に載っていました。例えばmanifest.jsonに関する詳細はこことかその他ダイアログを表示してファイルを選択するメソッドなどここからFileSystemProvider項あたりで見つけられます。

現状のUXPを触ってみて

アプリケーションの動作環境も同じシステムの上で動くので魅力的ではあるのですが正直CSSとかのサポート環境まで確認しながら開発したくないのが本音です。web開発と同じ環境で開発できるのが魅力的だったので現状CEPの方がいいかなとも感じます。またベースのシステムが微妙に違うのでCEPで動いていたシステムが動かないとかあり得ます。とりあえず本格的な開発はアップデート待ちしたいです。

Adobeドキュメントリンク一覧

Beer 寄付してサイトを応援する。