2013/06/17

GTK 3 and CSS in Python



最近在看 CSS 對於 GTK 3 程式的支援,並且寫了一些小程式玩了一下,覺得相當愉悅。

在 GTK 2 以前,要修改 widget 外觀要可以透過 gtkrc,但對於 GTK 3 可以直接給 CSS 相較之下,修改 CSS 簡單多了。此外 CSS 又提供像是背景的 gradient, transition, border-radius, border-image 這類的特性,要做到一些簡單的特效也變得十分容易。詳細的特效可參考 GtkCssProvider

想直接玩一下 CSS 的花樣可直接在 Ubuntu 13.04 下安裝 gtk-3-examples,並執行 gtk3-demo

$ sudo apt-get install gtk-3-examples
$ gtk3-demo

其中 css theming 的部分就可看到 CSS 帶來的特殊處。如同下面影片:




Hello World


接下來就來寫個簡單的 GKT 3 and CSS 的“你好世界”吧!在 Ubuntu 13.04 的環境下需安裝:

$ sudo apt-get install gir1.2-gtk-3.0 

程式如下,執行畫面類似 demo 裡的 CSS accordion。



Document


若是第一次使用 GTK 3 的朋友們可以先從這份 GTK 3 tutorial 開始看起。若是已經熟悉 GTK 開發的朋友,可接接產生 API reference 來看,產生方式如下:

$ sudo apt-get install yelp yelp-tools libgirepository1.0-dev libgtk-3-dev
$ g-ir-doc-tool --language Python -o ./output_dir /usr/share/gir-1.0/Gtk-3.0.gir
$ yelp ./output_dir/index.page

執行畫面如下: