**[[質問箱4/243]] [#gd0ecf02] #author("2018-03-11T20:01:27+09:00;2008-02-18T22:26:27+09:00","","") **[[質問箱/4243]] [#gd0ecf02] |RIGHT:70|LEFT:410|c |~カテゴリ|| |~サマリ|テーブルの改造で特定の行に色をつける| |~バージョン|1.4.7| |~投稿者|[[アベス]]| |~状態|完了| |~投稿日|&new{2008-02-14 (木) 01:41:30};| ***質問 [#i68cadc8] |aaa|aaa|h と作成すると、見出しになりますよね。 これの要領で |aaa|aaa|o←アルファベットは適当 にすると この行だけ色を変更することはできないでしょうか? |見出し|h |あいうえお| |BGCOLOR(#ffffff):かきくけこ| |さしすせそ| |BGCOLOR(#ffffff):たちつてと| のように色を1行ごとによって変更したいのですが BGCOLORをいれると見にくくなる上に面倒なので |かきくけこ|かきくけこ|o でその行は全てBGCOLOR(#):が適用されると楽だなと思いました ***回答 [#s6c80e79] |見出し|h |あいうえお| |BGCOLOR(#ffffff):|c |かきくけこ| |BGCOLOR():|c |さしすせそ| |BGCOLOR(#ffffff):|c |たちつてと| |見出し|h |あいうえお| |BGCOLOR(#ffffff):|c |かきくけこ| |BGCOLOR():|c |さしすせそ| |BGCOLOR(#ffffff):|c |たちつてと| - このように書式指定行というのはあります。[[整形ルール]]は読みましたか? -- [[ぃぉぃぉ]] &new{2008-02-14 (木) 02:17:10}; - [[質問箱4/130]] と同じ質問かな? -- &new{2008-02-14 (木) 18:11:12}; - [[質問箱/4130]] と同じ質問かな? -- &new{2008-02-14 (木) 18:11:12}; - cはもちろん知っていますが、毎回はさむことになるとやはり編集する時に見難くなるので。理想の形はやはり1文字で変更をと思っています。&br;そうですね。上記の質問と大体同じなのですが、そちらの解決方法を見ると結局編集時の見にくさ、さらに手間もかかるのでちょっと違うかなと思いました。 -- [[アベス]] &new{2008-02-15 (金) 16:41:46}; - 次のような改造はどうでしょうか? -- &new{2008-02-17 (日) 14:35:34}; -- lib/convert_html.php (行数は、r1.18 の時の目安) --- 535行目あたり - function toString() + function toString($flag) { if ($this->rowspan == 0 || $this->colspan == 0) return ''; - $param = ' class="style_' . $this->tag . '"'; + if ($flag) { + $param = ' class="style_' . $this->tag . '1"'; + } else { + $param = ' class="style_' . $this->tag . '2"'; + } if ($this->rowspan > 1) $param .= ' rowspan="' . $this->rowspan . '"'; if ($this->colspan > 1) { $param .= ' colspan="' . $this->colspan . '"'; unset($this->style['width']); } if (! empty($this->style)) $param .= ' style="' . join(' ', $this->style) . '"'; return $this->wrap(parent::toString(), $this->tag, $param, FALSE); } --- 635行目あたり // toString $string = ''; foreach ($parts as $type => $part) { + $flag = FALSE; $part_string = ''; foreach (array_keys($this->elements) as $nrow) { if ($this->types[$nrow] != $type) continue; + $flag = ! $flag; $row = & $this->elements[$nrow]; $row_string = ''; foreach (array_keys($row) as $ncol) - $row_string .= $row[$ncol]->toString(); + $row_string .= $row[$ncol]->toString($flag); $part_string .= $this->wrap($row_string, 'tr'); } $string .= $this->wrap($part_string, $part); } -- css に次の定義を追加((「CSV形式の表組み」等が''style_th'' や''style_td'' を使っているので、消してしまわないように注意))。 thead td.style_td1 thead td.style_td2 tfoot td.style_td1 tfoot td.style_td2 thead th.style_th1 thead th.style_th2 tfoot th.style_th1 tfoot th.style_th2 .style_th1 .style_th2 .style_td1 .style_td2 -- サイトごとやスキンごと等、複数のcss を設定する手間はあるものの、いちいち手で「この行の色を変えて」と(行末に1文字)入力する必要はない。 -- &new{2008-02-17 (日) 14:35:34}; - 細かい詳細ありがとうございます、ほとんど理想的な動作をしてくれました。~ しかしrowspanを使うとデザインが少し崩れてしまいます。~ |~あいうえお|かきくけこ| |~|さしすせそ| |~たちつてと|なにぬねの| |~|はひふへほ| |~まみむめも|やゆよ| |~らりるれろ|わをん| 上記の場合、th1である「あ行」は正常ですが、th2となってほしい「た行」が一行またいだのでth1になってしまいます。~ rowspanを使用していない「ま行」はth1、「ら行」はth2と当然動作してくれます。~ さらに理想としては、「か行」と「さ行」はtd1に、「な行」と「は行」がtd2になりませんでしょうか?~ 表で表示すると |BGCOLOR(#ffffff):~あいうえお|BGCOLOR(#ffffff):かきくけこ| |~|BGCOLOR(#ffffff):さしすせそ| |~|BGCOLOR(#ffffff):たちつてと| |BGCOLOR(#ffdddd):~たちつてと|BGCOLOR(#ffDDDD):なにぬねの| |~|BGCOLOR(#ffDDDD):はひふへほ| |~|BGCOLOR(#ffDDDD):まみむめも| |BGCOLOR(#ffffff):~アイウエオ|BGCOLOR(#ffffff):カキクケコ| |~|BGCOLOR(#ffffff):サシスセソ| |~|BGCOLOR(#ffffff):タチツテト| という風な形です。~ もちろんこのままで十分満足なのですが、rowspanを使うことを考えて上記の様にできますでしょうか?~ 厳しそうならこのまま完了にしたいと思っています、わがまま言って申し訳ないです。 -- [[アベス]] &new{2008-02-17 (日) 22:34:23}; - やっぱり自動で処理する機能だけでは困る場合がありますか・・・。という訳で、手動でも設定できるようなのを考えてみました。デフォルトからの差分です。 -- lib/convert_html.php (行数は、r1.18 の時の目安) ---115行目あたり // '|'-separated table function & Factory_Table(& $root, $text) { - if (! preg_match('/^\|(.+)\|([hHfFcC]?)$/', $text, $out)) { + if (! preg_match('/^\|(.+)\|([hHfFcC]?)([12]?)$/', $text, $out)) { return Factory_Inline($text); } else { return new Table($out); } } --- 535行目あたり - function toString() + function toString($flag) { if ($this->rowspan == 0 || $this->colspan == 0) return ''; - $param = ' class="style_' . $this->tag . '"'; + $param = ' class="style_' . $this->tag . $flag . '"'; if ($this->rowspan > 1) $param .= ' rowspan="' . $this->rowspan . '"'; if ($this->colspan > 1) { --- 560行目あたり class Table extends Element { var $type; var $types; var $col; // number of column + var $style; function Table($out) { parent::Element(); $cells = explode('|', $out[1]); $this->col = count($cells); $this->type = strtolower($out[2]); $this->types = array($this->type); + $this->style = array($out[3]); $is_template = ($this->type == 'c'); $row = array(); foreach ($cells as $cell) --- 585行目あたり function & insert(& $obj) { $this->elements[] = $obj->elements[0]; $this->types[] = $obj->type; + $this->style[] = $obj->style[0]; return $this; } --- 610行目あたり // Set colspan and style $stylerow = NULL; + $stylecss = ''; foreach (array_keys($this->elements) as $nrow) { $row = & $this->elements[$nrow]; - if ($this->types[$nrow] == 'c') + if ($this->types[$nrow] == 'c') { $stylerow = & $row; + $stylecss = & $this->style[$nrow]; + } else if ($stylecss != '' && $this->style[$nrow] == '') { + $this->style[$nrow] = $stylecss; + } $colspan = 1; foreach (array_keys($row) as $ncol) { if ($row[$ncol]->colspan == 0) { --- 635行目あたり // toString $string = ''; foreach ($parts as $type => $part) { + $flag = 0; $part_string = ''; foreach (array_keys($this->elements) as $nrow) { if ($this->types[$nrow] != $type) continue; + + switch ($flag) + { + case 1: + ++$flag; + break; + + default: + $flag = 1; + } + if ($this->style[$nrow] == '') { + $tmp = $flag; + } else { + $tmp = $this->style[$nrow]; + } $row = & $this->elements[$nrow]; $row_string = ''; foreach (array_keys($row) as $ncol) - $row_string .= $row[$ncol]->toString(); + $row_string .= $row[$ncol]->toString($tmp); $part_string .= $this->wrap($row_string, 'tr'); } $string .= $this->wrap($part_string, $part); } -- css に追加する定義は前と同じなので省略 -- 使い方のイメージはこんな感じ |~style_th1|style_td1|1 |~|style_td1|1 |~|style_td1|1 ||COLOR(#666666):|c2 |~style_th2|style_td2| |~|style_td2| |~|style_td1|1 |||c |~自動設定|自動設定| |~|自動設定| |~|自動設定| |BGCOLOR(#ffffff):~style_th1|BGCOLOR(#ffffff):style_td1| |~|BGCOLOR(#ffffff):style_td1| |~|BGCOLOR(#ffffff):style_td1| |BGCOLOR(#ffdddd):|COLOR(#666666):BGCOLOR(#ffdddd):|c |~style_th2|style_td2| |~|style_td2| |~|BGCOLOR(#ffffff):style_td1| |||c |BGCOLOR(#ffffff):~自動設定|BGCOLOR(#ffffff):自動設定| |~|BGCOLOR(#ffdddd):自動設定| |~|BGCOLOR(#ffffff):自動設定| --- 表組みの行末に(この改造の場合では)''1''や''2''を書くと、その行だけスタイルを手動で指定できます(省略すると自動)。''h'',''f'',''c''と併用する場合は、例えば''h1''のように文字の後に指定してください。&br;また、書式指定行で指定した場合は、次に書式指定行が出てくるまで、すべての行にその値を指定するのと同じ効果が得られます(ただし、すでに指定されている行は上書きしません)。&br;書式指定行で指定したものをキャンセルする場合は、上の例のように書式指定行の行末に''c''とだけ書いてください。 -- あまり長文になってもアレなので書きませんが、一応「switch ($flag) 」の部分の処理を変えれば、ループパターンを2行で1セットから、3行で1セットにも、4行で1セットにもできるようにはなってます。その場合、必要ならFactory_Table 関数で、行末に受け付けるパターンを修正しなくてはなりませんが。 -- 横長の表になればなるほど、セルを縦に結合したときに期待したものにならない可能性が増えてしまう((2マスならまだしも、3マス、4マス、・・・、と増えれば増えるほど、セルの結合を加味した自動処理は厳しくなっていくので。というか、複雑になりそうなので回避しました。))のは変わりませんが、最初の希望通り「行末に指定する」ことである程度はコントロールできると思います。 -- &new{2008-02-18 (月) 21:44:04}; // ↓、初心者向けの注意書き -- あと、最初の改造のときに書き忘れてましたが、この改造はconvert_html 関数を通るすべての処理に影響が出ます((例えばtracker_list プラグインで、表組みを使って表示している場合など))。なので、大まかな意味を理解してから、この改造をするようにして下さい。 -- &new{2008-02-18 (月) 21:44:04}; - ありがとうございます、理想的な動きをしてくれるようになりました!~ 例の説明もわかりやすくてとても助かります。~ ループパターンは、そうですね。rowspanを使うこともあり、使わないこともあるのでこのままでよさそうですね、使いやすいです。~ 表組み全般に適応されるとのことですが、自分のskinでは特に問題は無さそうなのでこのまま使わせてもらいます!~ よく雑誌とかでも表組みは行間ごとに色を変えていて、見やすいと思っていたので、どうしても実現してほしい機能でした。~ ここまで詳しく書き込んでくれてどうもありがとうございました! -- [[アベス]] &new{2008-02-18 (月) 22:18:07}; #comment