[PySide] PySideでCSSを使うメモ

DFTALKの記事にて(いつもありがとうございます)
PySideのUIの見た目をCSSでゴリゴリ書けることを知ったので、
記事を参考に色々と遊んでみようかなーとおもいます。

その中で、記事になかったところで、+で調べた事なんかをメモってみました。

CSSTEST

完成UIはこんな感じになります。
GroupBoxのボーダーをCSSを使用して変更する というので色々と確認しています。

まず、基本的なCSSの書式は

CSSを適応したいWidgetの名前{ CSSのプロパティ }

GroupBoxの場合は、

QGroupBox{CSSのプロパティ}

のようになります。
こうした場合、

UI_formTree

こんな感じに、自分の子にある同じクラス(Widget)タイプのものにもCSSが適応されます。
そのため、上のサンプルの場合、 A(グレーのボーダー)にStyleSheetを適応した場合、
特に設定しなければA_Child(グリーンのボーダー)にも適応されます。

そうではなく、Aの部分だけで子には適応しないようにするにはどうするのかと言うと

こんな感じに クラスタイプ#オブジェクト名 で指定すれば、指定したオブジェクトのみ
CSSを対応させることができるようです。

で。

これで個別設定は出来たのですが、CSSの設定をPythonのコード内にがんばって書いて setStyleSheet(str) に書くのはいまいちピンと来ないというか、
複数行あるのとかやるとコードがカオスって嫌だなぁというのがあったので
外部ファイルにCSSを書いておいて、読み込んで、UIに反映できんもんかと試してみました。

UIのファイルは → こちら

CSSファイルは

こんなかんじに、UIで使用する要素を1つのファイルにまとめて書きます。

本体はこんな感じになりました。
同じフォルダにあるcssを読み込んで、StyleSheetをセットします。
self.setStyleSheet(“~CSS~”) にしておくと、表示されているWidgetすべてに対してCSSが適応されるので、オブジェクトごとに setStyleSheet()しないでも大丈夫です。

そのほか、Qtに関係するCSSは、公式に一通りの参考があったので
ココを見ればだいたいの書き方は分かる…はず?

まだまだPySideネタは続きそう…

コメントを残す

メールアドレスが公開されることはありません。


*