2022年11月

WinUI 3 で実際にアプリを作った感想

MainWindow静的 HTML によるヘルプ作成をアシストするツール「ちょちょいとファイル合併 2」(ソースコード)を WinUI 3(Windows App SDK)で作成した。

実際にアプリを作ると WinUI 3 の良いところ悪いところを実感できたので、そのまとめ。

なお、開発は Template Studio for WinUI を用いて行っているので、素の WinUI 3 より少し高機能な環境を使用している。

良いところ(メリット)

【デザインはわりと好き】

settingsボタンやチェックボックスなどのデザイン(Fluent Design)はわりと好き。

少なくとも、素の WinForms や WPF よりは洗練されている感がある。

マテリアルデザインはデフォルト(?)の紫をはじめとしたどぎつい色が多いので、それよりも落ち着いていて好き。ただ、パステル調のマテリアルデザインはきれいなので、そちらのほうが好き。

あと、ウィンドウを半透明+ぼかしにするアクリル効果は使いどころが難しいと思う。

【アクセスキーが表示されるのが良い】

AccessKeyコントロールにアクセスキー(Alt+x)が設定されている場合、Alt キーを押して離すとアクセスキーが表示されるのは分かりやすい。

普通のボタンはラベルにアクセスキーを表示しておけるが、アイコンボタンはアクセスキーを表示できないので、アクセスキー表示機能があることでユーザーはアクセスキーを認識できる。

Alt キーを「離した」時に表示されるので、既に知っているアクセスキーを使うときはわざわざ表示されず、うざくないのもポイント。

【RelativePanel】

WPF にあった DockPanel はなくなり、代わりに RelativePanel が登場。ちょっと使い方が難しいが、その分、高機能になっている。

RelativePanel で一番気に入ったのは、DockPanel の LastChildFill をより良く実現できること。

MainWindowDockPanel.LastChildFill の場合、残りのスペースを埋めるコントロール(右の図ではメイクファイル入力欄)を XAML 上で最後に記述することになり、結果的に、タブオーダーが見た目と異なってしまう(参照ボタンの後に入力欄が来る)。

RelativePanel なら、残りのスペースを埋めるコントロールを好きな順番で書くことができる(RelativePanel.RightOf / LeftOf を両方指定すると伸びる)ので、タブオーダーが見た目通りになる。

【静的バインディング】

XAML でのバインディングに静的バインディングの {x:Bind} が使える。

WPF は動的バインディングの {Binding} だったので、実行してみないとエラーが分からず、この点が個人的にとても嫌いだった。WinUI 3 で静的バインディングになり、コンパイル時に解決するのでミスが減る。パフォーマンスも向上するようだ。

ただ、デフォルトでバインディングの Mode が OneTime になっているので、WPF に慣れていると「値反映されない?」ってことになりがちなのは注意。

なお、{Binding} も使える。

【マルチリンガル】

恐らく Template Studio のおかげかと思うが、ローカライズの仕組みが最初から使える状態になっているのは良いと思う。

Ver 1.83 現在ではちょちょいとファイル合併 2 は多言語対応していないが、実験用に多言語対応してみてもいいかもしれない。

悪いところ(デメリット)

正直、悪いところが多すぎるし、1 つ 1 つのダメージがでかすぎる。なんとなくの印象だけど、すぐには改善されない気がする……。

※自分が気付いてないだけかもしれないので、もしご存じのかたはコメントいただけると幸いです。

【ウィンドウの機能が弱すぎる】

なんと、ウィンドウに Left / Top プロパティーがない。Template Studio では素の Window よりも強いサードパーティーの WindowEx を使っているが、それでもない。ウインドウを動かすには、コードビハインドで AppWindow.Move() を使う。MVVM どこ行った……。

ウィンドウサイズをコンテンツに合わせて調整する SizeToContent プロパティーもない。これを自力で実現するために無駄にコードを書く必要がある。自分は何をやっているのか……と虚しくなる。

なお、メインウィンドウに限っては XAML で Width / Height プロパティーを指定しても効かないが、これは Template Studio が何かしているからのようだ。コードビハインドで指定すると効くし、子ウィンドウなら XAML でも効く。

【ウィンドウをモーダルにできない】

子ウィンドウをモーダルウィンドウ(閉じるまで親ウィンドウを操作できないウィンドウ)にできない。モードレスになるので、環境設定ウィンドウで環境設定している時にメインウィンドウをクリックすると、メインウィンドウの操作ができてしまう。

確かに Windows 以外の OS に目を向ければ Haiku OS の流儀はすべてモードレスで、OS 全体でその流儀が浸透しているなら、モードレスはモードレスで使い勝手が良いし、個人的な好みで言えばモードレスかもしれない。しかし、Windows の流儀はモーダルなので、自分のアプリだけモードレスというのは違和感しかない。

ちょちょいとファイル合併 2 では擬似的にモーダルになるようにまたしても無駄にコードを書くこととなり、むなしさが増した。

PaintWindows 11 付属のペイントは WinUI 3 でありながら本物のモーダルウィンドウを実現しているっぽくて、どうやっているのか気になる。

【メッセージボックスが見切れる】

ContentDialogWinUI 3 のメッセージボックスは ContentDialog だが、メインウィンドウの範囲内でしか表示できないので、メインウィンドウよりも大きな内容を表示しようとすると見切れてしまう。

MessageDialog仕方ないので MessageDialog を使っているが、デザインが WinUI 3 とは異なるので違和感が出てしまう。

【ポップアップメニューがきつきつ】

Kitsu本質的には ContentDialog と同じ問題なのではと思うが、ポップアップメニュー(Flyout)も無理矢理メインウィンドウの範囲内で表示しようとするので、アイテム数が多いとスクロールバー表示になってしまい、非常に使いづらい。

Item3対処方法としては、スクロールしなくてもメインウィンドウ内に納まるアイテム数にするしかない。

ボタンとの位置関係によっては、納まるアイテム数にしていても、初回だけはスクロールバー表示になってしまい、これはバグだと思う。

ドキュメントによれば、FlyoutBase.ShouldConstrainToRootBounds プロパティを false にすればウィンドウ外に表示できるようなのだが、なぜか効かない。Popup.ShouldConstrainToRootBounds プロパティのドキュメントには「WinUI 3 では false はサポートされない」と書いてあるので、そういうことなのかもしれない。

【パッケージを作るの面倒】

公開用のパッケージを作る際、msix が作成され、msixbundle が作成されない。

手動で msixbundle を作成するのが面倒くさい。

【ロードマップが更新されない】

Windows App SDK のロードマップはこのへんこのへんに書かれているが、1.1 あたりで止まっている。

既に 1.2 が出ているが、この先どうなるのかの見通しが分からない。

【バグっぽい】

集約エラーハンドラー(Application.UnhandledException)がうまく動かなくてずっと悩んでいたが Windows App SDK 1.2 になったら動いたので、ただのバグだったようだ。

ポップアップメニューの初回位置もしかり。

【情報が少ない】

ノウハウしかり、ロードマップしかり、WinUI 3 に関する情報が非常に少ない。

クラスの検索をすると WinUI 3 ではなく UWP が引っかかりがち。

Uwp例えば、現時点では「TextBlock WinUI3」で検索すると UWP の TextBlock(Windows.UI.Xaml.Controls 名前空間)がトップに出てきて、WinUI 3 の TextBlock(Microsoft.UI.Xaml.Controls 名前空間)にはたどり着けない。

総評

良いところに目を向けて活用していきたいと思うものの、少なくとも現状では、WinUI 3 での開発は茨の道だと思う。

機能比較表

WPF と WinUI 3 の機能比較表を作成

更新履歴

  • 2022/11/23 初版。
  • 2022/11/26 バインディングについて追記。
  • 2022/11/26 ポップアップメニューについて追記。
  • 2023/05/21 機能比較表について記載。

ちょちょいとファイル合併 2 Ver 1.83 公開

settings「ちょちょいとファイル合併 2」Ver 1.83 を公開しました。

ちょちょいとファイル合併 2 は、静的 HTML によるヘルプの作成をアシストする、開発者向けのツールです。

WinUI 3 立ち位置メモ

アーキテクチャー的に? 構造的に? 階層的に? WinUI 3 がどのへんにいるのかがよく分からないので、調べてみた。

※情報をご存じの方はご教示いただけると幸いです!

今のところの想像はこんな感じ。

階層図2

以下元ネタ。

Microsoft Store の認定所要時間

認定アプリを Microsoft Store で公開するに当たっては、Store 側の認定を経なければなりませんが、申請してから認定されるまでにかかる時間はどれくらいなのか、まとめてみました。

全 12 回のサンプルで、所要時間の割合は以下の通りでした。

     ~6 時間以下16.7 %
6 時間超 ~ 1 日以下16.7 %
1 日超  ~ 3 日以下41.7 %
3 日超  ~    25.0 %

所要時間は、提出ボタンを押してから、結果の通知メールが来るまでの時間で測定しています。最近は通知メールが来なくなってしまったので、最近の結果は含めていません(設定でメール来るように出来るのか探しているのですが見つかりません……)。

申請の際には「通常数時間」「最大 3 営業日」かかると表示されます。数時間が 2~3 時間なのか 5~6 時間なのか分かりませんが、多めに 5~6 時間としても、数時間で結果が来るのは 2 割以下という統計になりました。

1~3 日のパターンが一番多いので、「通常 3 日以内」と表示するほうが適切な気がします。

メールは土日や夜に来ることもあるので、認定作業は割といつでもやっているようです。

関連記事

簡易キーチェンジャー Ver 1.14 B 公開

簡易キーチェンジャー簡易キーチェンジャー Ver 1.14 B を公開しました。

簡易キーチェンジャーは、再生中の音声のキー(音程)を、リアルタイムで上下させるための DirectShow フィルターです。イメージとしては、カラオケでキーを上げ下げするのと同様のことができます。

上下させる量などをブラウザで指定できるのが特徴です。

デュアルディスプレイ環境を構築

デュアルディスプレイねんがんの デュアルディスプレイを てにいれたぞ!

経緯

以前からデュアルディスプレイ(デュアルモニター)にしたいとは思っていたものの、スペースの問題で諦めていた。

机にフル HD モニターを 1 つ置き、両側にスピーカーを置くと、それだけでいっぱいになってしまう。

今回、スピーカーを上の棚に移動することで、モニターを 2 つ並べることができるようになった。少々きつきつではあるが……。

構成

  • メインディスプレイ:21.5 インチ、フル HD(JAPANNEXT JN-T215FLG144FHD)(新規購入)
  • サブディスプレイ:21.5 インチ、フル HD(IO DATA LCD-MF223XS)(継続使用)
構成新しく購入した JAPANNEXT のディスプレイをメインディスプレイとし、パソコンと DisplayPort で接続。

今まで使っていた IO DATA のディスプレイをサブディスプレイとし、パソコンと HDMI で接続。

サブディスプレイは Blu-ray のディスプレイと兼用とし、切替器でパソコンと Blu-ray を切り替えられるようにした。

便利

やはりデュアルディスプレイは便利。

ブラウザでプログラミングの解説記事を見ながら Visual Studio で開発できるし、攻略サイトを見ながらゲームもできる。

Twitter を表示しっぱなしにできるのも良い。

また、今までは Blu-ray プレーヤーで見るときはまったくパソコンを操作できなかったが、デュアルディスプレイだと、Blu-ray 再生中でも 1 画面はパソコンが使えるので、その点もとても利便性が向上した。

Windows 11 が活躍

Blu-ray を使うとパソコンは 1 画面になるので、サブディスプレイで表示していたアプリのウィンドウはメインディスプレイに自動的に移動される。

ここまでは Windows 10 も Windows 11 も同じ。

しかし、復帰の挙動が異なる。パソコンをデュアルディスプレイに戻すと、Windows 11 だと、もともとサブディスプレイで表示していたアプリのウィンドウが自動的にサブディスプレイに復帰する。Windows 10 は復帰せずメインディスプレイに居座る。

パソコンの電源を切らずにディスプレイの電源だけ切ったときも似たようなことが起こる。2 枚のディスプレイの認識タイミングが微妙にずれるため、一時的に 1 画面と判断されるので、Windows 10 だとメインディスプレイにすべてのウィンドウが寄ってしまう。Windows 11 はきちんと 2 画面に分離する。

デュアルディスプレイで使うなら、OS は Windows 11 が良い。というかそのために Windows 11 を導入した

なお、DisplayPort 接続の場合、相性が悪いとディスプレイのみ電源を切ると再接続できないことがあるようだが、幸いにして、うちの環境では再接続がうまくいっている。

欠点

スピーカーを上の棚に移動したため、スピーカーの下に自分が座る形になった。音楽を聴くという観点では音にちょっと違和感が出る。

配線は今までよりもさらにカオスになった。

とはいえ、デュアルディスプレイにはそれを上回る魅力があると思うので、しばらくこれでいこうと思う。

ゆかりすたー 4 NEBULA Ver 7.22 公開

ゆかりすたー 4 NEBULAゆかりすたー NEBULA Ver 7.22を公開しました。

ゆかりすたー NEBULA(ネビュラ)はカラオケ動画ファイルを整理し、ゆかり(持ち込みカラオケ用のブラウザリクエストツール)から検索できるようにするツールです。データベースを活用することにより、タイアップしている番組名や歌手名などの付加情報を含めて整理します。

Ver 6.02 以降は Microsoft Store での配布となっています(引き続き無料です)。それに伴い、Ver 4.60 以前からの更新に当たっては楽曲情報データベースの引き継ぎが必要となります。

Windows 11 導入

メイン PC を Windows 11 にした。

Explorer Patcher for Windows 11今まで Windows 10 のままだったのは、Windows 11 のタスクバーが退化しすぎて使い物にならなかったからだが、Explorer Patcher for Windows 11 により Windows 10 と同等の機能を使えることがわかったので、導入に踏み切った。

Explorer Patcher for Windows 11、UI がちょっと変わっていて、どこが反応する部分なのかが今ひとつ分かりづらいものの、機能は十分。
  • タスクバーのアイコンにラベル表示
  • タスクバーの高さを 2 段に
  • タスクトレイ(システムトレイ)にすべてのアイコンを表示
  • タスクトレイの左側にデスクトップメニューの追加
などができる。

また、エクスプローラーの右クリックメニューも Windows 10 と同等にできる。

クリーンインストールしたので、70 GB くらいしか空いていなかった C ドライブの空き容量が 370 GB まで回復。

すっきりとパソコンを使えるようになった。

月別アーカイブ
記事検索
最新コメント
  • ライブドアブログ