Как добавить фоновое изображение в GTK TreeView?

Question

Я хотел бы иметь GTK TreeView с фоновым изображением, как показано на макете ниже.

Я нашел методы для установки фона цвет виджетов, но естьне похоже на способ установки фона pixbuf или другого формата изображения.

Я использую Python с PyGTK, но ответ на любом языке с привязками GTK приемлем.

Макет gtkTreeView с фоновым изображением :

Первая попытка

Основываясь на совете Чон Бора, я попробовалследующее:

style = treeview.get_style().copy()
img_pixbuf = gtk.gdk.pixbuf_new_from_file(image_filename)
img_pixmap = img_pixbuf.render_pixmap_and_mask()[0]
for state in (gtk.STATE_NORMAL, gtk.STATE_ACTIVE, gtk.STATE_PRELIGHT,
              gtk.STATE_SELECTED, gtk.STATE_INSENSITIVE):
    style.bg_pixmap[state] = img_pixmap
treeview.set_style(style)

Сначала это, казалось, не имело никакого эффекта, но при выборе элемента в моем TreeView я заметил следующее:

Часть фона «просвечивает» при выделении строки.

(Обратите внимание, что я использую фоновое изображение на основе моего макета, за исключением того, что оно имеет некоторый синий цвет, для целей тестирования).

Затем я активировал часть моего графического интерфейса, которая очищает содержимоеf TreeView и перерисовывает его, и заметил это:

Однако, как только я добавляю что-то в TreeView, фон исчезает, поэтому я все еще не уверен, если этоидти в правильном направлении.

Answer 1

Используя GTK3 и gtkmm, можно использовать CSS, но изображение должно быть доступно в виде файла или, возможно, ресурсов.

Здесь я предполагаю, что древовидное представление имеет подкласс:

class MyTreeView : public Gtk::TreeView { .. };

для вашего дерева задайте имя и добавьте к нему стиль CSS:

MyTreeView::MyTreeView () {

  set_name ("MyTreeView");
  auto css = Gtk::CssProvider::create ();
  auto sc  = get_style_context ();

  string path_to_img = "my-image.png";

  string css_data =
    ustring::compose (
                    "#MyTreeView  { background-image: url(\"%1\");"
                    "               background-repeat: no-repeat;"
                    "               background-position: 50%% 50%%;"
                    " }\n"
                    "#MyTreeView  .hide_bg { background-image: none; }",
                    path_to_img);

  try {
    css->load_from_data (css_data);
  } catch (Gtk::CssProviderError &e) {
    cout "error: attempted to set background image: " << path_to_img.c_str () << ": " << e.what () << endl;
  }

  auto screen = Gdk::Screen::get_default ();
  sc->add_provider_for_screen (screen, css, GTK_STYLE_PROVIDER_PRIORITY_APPLICATION);

}

кажется, что также можно установить прозрачный фон строки , добавив:

background: none;

в CSS.

Фоновое изображение затем можно скрыть или показать с помощью:

if (!hide) {
  auto sc = get_style_context ();
  if (!sc->has_class ("hide_bg")) sc->add_class ("hide_bg");
} else {
  auto sc = get_style_context ();
  if (sc->has_class ("hide_bg")) sc->remove_class ("hide_bg");
}

Answer 2

Я подозреваю, что, поскольку в каждой ячейке есть средство визуализации, которое контролирует ее внешний вид, вам придется каким-то образом изменять ячейку в виде дерева за ячейкой.

В любом случае, стоит попробовать следующий код (непроверенный, неполный код):

# Get the treeview's style
style = treeview.get_style().copy()

# Change the bg_pixmap attribute
#   It's an array with one pixbuf for every widget state, so
#   you probably want to replace each of the default 
#   pixmap's with your own image(s)
#   

style.bg_pixmap[0] = your_pixmap
style.bg_pixmap[1] = your_pixmap
style.bg_pixmap[2] = your_pixmap
style.bg_pixmap[3] = your_pixmap
style.bg_pixmap[4] = your_pixmap

# Set the modified style
treeview.set_style(style)

Атрибут bg_pixmap задокументирован в справке PyGTK .

Я не уверен в том, как положения массива отображаются в состояния виджета. Если он такой же, как в c ++, он будет:

0 - STATE_NORMAL    
1 - STATE_ACTIVE    
2 - STATE_PRELIGHT  
3 - STATE_SELECTED  
4 - STATE_INSENSITIVE