ttk::treeview(2)

このページでは、先のサンプルでご紹介しきれなかった TreeViewのポイントを補足します。 というときにいつも出てくるのが、 テキストファイルからあのデータを読み込んで、 表示、編集できるサンプルです。 (このページのサンプルでは編集後の保存はできません)
まず、マスターデータとして、 下のようなタブ区切り形式のテキストファイルを作り、 "shiten.txt" の名前で保存します。 

00100	札幌	1	札幌市清田区美しが丘九条9丁目99	30
00200	仙台	2	仙台市青葉区柏木9-9-99	32
00301	新宿	3	東京都新宿区新宿九丁目99−99	50
... (略) ...

Tclプログラムは以下の通りです。 ファイルの読み取りのために、 Standard Tcl Library(Tcllib)のfileutil、textutilパッケージを使っているので、 Tcllibをインストールしている必要があります。 

package require fileutil
package require textutil

wm title . "Shiten"

# タブ区切りテキストファイルを読み、
# 中身を行、列2次元のリストに格納して返します。
proc readDataFile dataVar {
    upvar $dataVar data
    set content [::fileutil::cat "./shiten.txt" -encoding cp932]
    set rows [::textutil::split::splitx $content {[\r\n]+} ]
    set data {}
    foreach rowStr $rows {
        set rowArr [::textutil::split::splitx $rowStr "\\t+"]
        if {[llength $rowArr] != 0} { lappend data $rowArr }
    }
}

set f1 [ttk::frame .f1]

set tb [ttk::treeview $f1.tb1 -show "headings" \
  -columns {ShitenCode ShitenName AreaCode Address EmployeeNum} \
  -displaycolumns {ShitenCode ShitenName Address AreaCode EmployeeNum} \
  -xsc "$f1.scrh set" -ysc "$f1.scrv set" \
  -height 8]
#$tb column #0 -width 50
$tb column ShitenCode  -anc w -width 75
$tb column ShitenName  -anc w -width 75
$tb column AreaCode    -anc e -width 50
$tb column Address     -anc w -width 200
$tb column EmployeeNum -anc e -width 50
#$tb heading #0     -text "種類"
$tb heading ShitenCode -text "支店コード"
$tb heading ShitenName -text "支店名称"
$tb heading AreaCode   -text "地域"
$tb heading #3   -text "所在地"
$tb heading #5   -text "従業員数"

readDataFile data
set y 0
foreach rowData $data {
    set rowTag "tag[expr $y%2+1]"
    $tb insert {} end -values $rowData -tag $rowTag
    incr y
}
$tb tag configure tag1 -background #ffdddd
$tb tag configure tag2 -background #ddddff

ttk::scrollbar $f1.scrv -orient v -command "$tb yview"
ttk::scrollbar $f1.scrh -orient h -command "$tb xview"
grid $f1.tb1  -column 1 -row 1
grid $f1.scrv -column 2 -row 1 -sticky ns
grid $f1.scrh -column 1 -row 2 -sticky ew
pack $f1
bind . <Key-Escape> exit


この例では、::ttk::treeviewコマンドの-showを "headings" ということでtreeを無効にしています。 そのため左端からデータ行ということになり、"#0" の設定は効きません。
それで使って気づいた注意ですが、treeviewには -widthオプションがありません(ver8.5.9現在)。 各列の幅を各列のcolumnウィジェットサブコマンドの-widthで設定すると、 その幅だけ必ず取ろうとします。 ということは…横スクロールバーの意味はないんでないのかしら？ 気になってちょっと検索したところ、ttkの元になったTile拡張の時代には、 treeviewは横スクロールをサポートしていなかったらしいです。 それが今でもそうなのか、今後の改修でサポートされるのか、 上の例の無駄なスクロールバーは一体どこへ向かおうとしているのか。
…気を取り直して、違う点に移りましょう。 treeviewには-columnsのほかに-displaycolumnsというオプションがあり、 データ上の列の並びと、表示上の並びを変えることができます。 また、一部の列を-displaycolumnsに含めないことで、表示しないようにもできます。
またtreeviewウィジェットのheadingsやsetなどのサブコマンドで指定する 「列識別子」には、-columnで指定したIDのほかに、#1、#2…のような指定もできます。 繰り返しになりますが、ツリーを表示しているときはツリー部が#0で、 データ列の左端から#1、#2…となります。 ツリー無効のときには#0はなく、やっぱりデータ列の左端から#1、#2…となります。
また、-displaycolumnsを指定しているときは、 #1、#2…は-displaycolumnsの並び順に対応します。 -columnsの並び順ではありません(つまり#3といえば常に左から3列目を指します)。 

package require fileutil
package require textutil

wm title . "Shiten"

# タブ区切りテキストファイルを読み、
# 中身を行、列2次元のリストに格納して返します。
proc readDataFile dataVar {
    upvar $dataVar data
    set content [::fileutil::cat "./shiten.txt" -encoding cp932]
    set rows [::textutil::split::splitx $content {[\r\n]+} ]
    set data {}
    foreach rowStr $rows {
        set rowArr [::textutil::split::splitx $rowStr "\\t+"]
        if {[llength $rowArr] != 0} { lappend data $rowArr }
    }
}

set f1 [ttk::frame .f1]

set tb [ttk::treeview $f1.tb1 -height 8 \
  -columns {ShitenCode ShitenName AreaCode Address EmployeeNum} \
  -displaycolumns {ShitenCode Address EmployeeNum} \
  -xsc "$f1.scrh set" -ysc "$f1.scrv set" ]
$tb column #0 -width 80
$tb column ShitenCode  -anc w -width 75
$tb column Address     -anc w -width 200
$tb column EmployeeNum -anc e -width 50
$tb heading #0   -text "支店"
$tb heading ShitenCode -text "支店コード"
$tb heading #2   -text "所在地"
$tb heading #3   -text "従業員数"

readDataFile data

set index 1
foreach a {北海道 東北 関東 中部 近畿 中国 四国 九州 沖縄} {
    set areaRowId($index) [$tb insert {} end -text $a -open true]
    incr index
}

foreach rowData $data {
    set shitenName [lindex $rowData 1]
    set area [lindex $rowData 2]

    set id [$tb insert $areaRowId($area) end -text $shitenName -values $rowData]

    # 同じ親の中でのインデックスを取得し、-tagを"tag1"と"tag2"交互に
    # 割り当てることで、交互に背景色を変更します。
    set y [$tb index $id]
    set rowTag "tag[expr $y%2+1]"
    $tb item $id -tag $rowTag
}
$tb tag configure tag1 -background #ffdddd
$tb tag configure tag2 -background #ddddff

ttk::scrollbar $f1.scrv -orient v -command "$tb yview"
ttk::scrollbar $f1.scrh -orient h -command "$tb xview"
grid $f1.tb1  -column 1 -row 1
grid $f1.scrv -column 2 -row 1 -sticky ns
grid $f1.scrh -column 1 -row 2 -sticky ew
pack $f1
bind . <Key-Escape> exit


今度の例では::ttk::treeviewコマンドに-showを指定していないので、 デフォルトの {tree headings} つまりツリー列も見出し行も表示されます。
前ページにはなかった新しい利用法といえば、 treeviewウィジェットのindexサブコマンドです。 これは、指定したアイテム（行）が、 共通の親を持つ子の中で何行目にいるか(先頭が0)を返します。 上の例ではこの数字を2で割った余りによって itemサブコマンドでtag1とtag2というタグを各行に交互に付与することで、 背景色を横縞模様にしています。

やねうらの top
(first uploaded 2010/09/26 last updated 2010/09/26, MISUMI URANO)