ウィンドウサイズに応じてウィジェットを自動再配置するUIをつくろう
こちらはMaya Advent Calendar 2018 12月19日の記事です。
今年はアドカレはパスかな、、って思ってたけど誕生日空いてたので滑り込み！
PySideのUIネタなんぞを一つ。
UIの動的再配置！
・Maya標準機能のUI
ウィンドウサイズを縮めるとが見切れて使いづらい！
・カスタムツール
そもそも中身のウィジェットサイズ以下に縮まらなくて画面専有しすぎ！
ってことありませんか？ありますよね？ありますとも。
↓小さいウィンドウサイズで使おうとすると大事な部分が隠れちゃうとか、、
SoftimageのUIは親切設計でUIサイズが変更されると動的にUIパーツが並び替わるって仕様でした。
↓SIの動的再配置、あの頃はよかった。。。
自作のツールにはどうしてもこれが欲しい！ってことでPySideで実装したときの記録。
実装に必要なもの
・ウィジェットサイズよりも縮む受け皿
QScrollAreaで桶。
・自由に配置できるレイアウト
今回はQGridLayoutをつかいました。
配置位置をx, y , w, hで自由に指定。
・ウィンドウサイズ変更をトリガに再配置を実行する
こちらはウィンドウにresizeEventを仕込むことで実装。
・動的再配置処理
配置するウィジェットのサイズを予め取得しておいて、ウィンドウサイズに収まり切らなくなったら行を変えて配置する仕組みを考えます。
再帰的に配置していって要素がなくなれば終了みたいな。
というわけで最低限の要素でひとまず作ってみましょう。
↓はい実装。※時間がなくて説明少なめです、すんまそ。
実行するとこんな感じでボタン配置が動的に変化するウィンドウが開きます。
ちゃんと動きましたね。よかった。
要素のグループ化
これでも要件は満たすんですが、スピンボックスとスライダーを一組にしたい、とかボタンをグループごとに分けたいって場合もあると思います。
そういう場合はボタンリストに登録するウィジェットをひとまとめにするウィジェットでラッピングしてやるとよさそうです。
↓はい実装。※時間がな(ry
実行するとこんな感じでグループごとにまとまって配置されます。
今度もちゃんと動きましたね。よかったよかった。
そんなこんなで公開しているツールSIWeightEditorも同じ仕組みでUIを作ってます。
こちらはテーブルと上部ペインの比率も動的に変化します。
他QSplitter、QStackedWidgetと組み合わせると標準ウィジェットでは難しい多段タブ動的配置ツールランチャーも作れたりします。
こちらもSIにありましたね。
↓SIのシェルフ、あの頃はよか(ry
今回のものに限らずUI設計はちょっとした心遣いでとっても使いやすくなり、反面設計が悪いととってもわかりにくいものになりやすいですね。
個人的にデザイナーに使ってもらえるかどうかはUIの導入のよさ、（あとスタイリッシュさも笑）がかなり大きいと思ってます。
わかりやすく、使いやすい、機能面でも優れているツールづくりを目指したいですね。
明日はお待ちかねPySideマスターUnPySide（リンゴ酸）さんの記事でっす。
素敵なサムシングよろしくお願いしまーす。
おしまい。
2019/02/24追記
ウィンドウサイズ変更時にレイアウトに変化がない場合は再配置しない形にしたもの追加。ボタン数が数百とかになってきた場合の負荷対策。
