リストビューにアイコンとテキストを同時表示する

概要

リストビューにアイコンとテキストを一つの列に同時表示する場合は手動でビューの列クラス(Gtk::TreeViewColumn)を作ってTreeViewに登録し、さらにpixbufとテキストのレンダリングクラス(Gtk::CellRendererPixbuf, Gtk::CellRendererText)を作って作成したGtk::TreeViewColumnにパックする必要がある。さらにモデルの列を Gtk::TreeViewColumn::add_attribute()を使ってレンダリングクラスにマップする。

ソース

listview4.cpp


#include <gtkmm.h>

// 派生レコードクラス
class MyRecord : public Gtk::TreeModel::ColumnRecord
{

public:
    Gtk::TreeModelColumn< Glib::RefPtr< Gdk::Pixbuf > >  m_col_image;
    Gtk::TreeModelColumn< Glib::ustring > m_col_name;

    MyRecord(){

        // レコード( Gtk::TreeModel::ColumnRecord )に列( Gtk::TreeModelColumn )を登録
        add( m_col_image );
        add( m_col_name );
    }
};


/////////////////////


class MainWin : public Gtk::Window
{
    Gtk::ScrolledWindow m_scrwin;
    Gtk::TreeView m_treeview;

    MyRecord m_record;
    Glib::RefPtr< Gtk::ListStore > m_liststore;

public:
    MainWin();
};


MainWin::MainWin()
{
    // レコードを用いてモデル( Gtk::ListStore )作成
    m_liststore = Gtk::ListStore::create( m_record );

    // モデルをビュー( Gtk::TreeView )にセット
    m_treeview.set_model( m_liststore );

    // ビューの列クラス(Gtk::TreeViewColumn)を作ってTreeViewに登録
    Gtk::TreeViewColumn* viewcol = Gtk::manage( new Gtk::TreeViewColumn( "アイコン+名前" ) );
    m_treeview.append_column( *viewcol );

    // pixbufのレンダリングクラス(Gtk::CellRendererPixbuf)を作って
    // ビューの列クラス(Gtk::TreeViewColumn)にパック
    Gtk::CellRendererPixbuf* ren_pixbuf = Gtk::manage( new Gtk::CellRendererPixbuf() );
    viewcol->pack_start( *ren_pixbuf, false );
    // pixbufの実体が登録されているモデルの列を指定。0 はモデルの0列目(m_col_image)の意味
    viewcol->add_attribute( *ren_pixbuf, "pixbuf", 0 ); 

    // テキストレンダリングクラス(Gtk::CellRendererText)を作って
    // ビューの列クラス(Gtk::TreeViewColumn)にパック
    Gtk::CellRendererText* ren_text = Gtk::manage( new Gtk::CellRendererText() );
    viewcol->pack_start( *ren_text, true );
    // テキストの実体が登録されているモデルの列を指定。1 はモデルの1列目(m_col_text)の意味
    viewcol->add_attribute( *ren_text, "text", 1 ); 

    // モデルに行を追加するとビューの表示も同時に更新される
    Gtk::TreeModel::Row row;

    row = *( m_liststore->append() );
    // Gtk::Widget::render_icon()を使ってストックアイコンをレンダリングする
    row[ m_record.m_col_image ] = Gtk::Widget::render_icon( Gtk::Stock::YES, Gtk::ICON_SIZE_MENU );
    row[ m_record.m_col_name ] = "ほげ";

    row = *( m_liststore->append() );
    row[ m_record.m_col_image ] = Gtk::Widget::render_icon( Gtk::Stock::NO, Gtk::ICON_SIZE_MENU );
    row[ m_record.m_col_name ] = "あああ";

    // widgetのパック
    m_scrwin.add( m_treeview );
    add( m_scrwin );
    show_all_children();
    resize( 200,200 );
}


int main( int argc, char *argv[] )
{
    Gtk::Main kit( argc, argv );
    MainWin mainwin;
    Gtk::Main::run( mainwin );

    return 0;
}

コンパイル

必要なコンパイルオプションは pkg-config を使って取得する。

g++ listview4.cpp -o listview4 `pkg-config gtkmm-2.4 --cflags --libs`

内容

リストビューにアイコンとテキストを同時表示する

概要

ソース

コンパイル

結果