V2C 使用法 [レス表示スタイル]

注意:現在このページの内容は仕様を確定するための暫定的なものです。

「スレッド」メニューの「レス表示スタイル」→「再読み込み」でV2Cを再起動せずにレス表示スタイルの変更を反映させることができます。

このページにある使用例は使い方を説明するためだけのものですが、こちら(外部サイト)では実用的なレス表示スタイルをダウンロードすることができます。

既知の問題[T20080808]

H20080827の変更点

・"width"が設定されている場合、不必用に幅を広げないようにした。

"width"に値が設定されていても自動的に親の幅に合せて幅が広がってしまうことはなくなったはずです。

・<HBOX>の直接の子要素では"width"の単位として%を使えるようにした。

子要素の幅の合計が親の内容領域の幅を越える場合は%単位で指定された"width"が圧縮されます。注意:「HBOX制限」が適用される場合は使用できません。(次項参照)

・「HBOX制限」を変更した。

新しい「HBOX制限」は、「そのHBOX自体またはその親(直接の親でなくても可)の"width"に固定値が設定されていない場合、直接の子要素のうち右端の子要素の"width"は固定値か無設定(つまり%単位以外)、かつそれ以外の子要素の"width"には固定値が設定されていなければならない。」になります。

・コンテナ要素の内容領域に最小幅("min-width")を設定できるようにした。

空でない<DIV>にはデフォルトで30px(<DIV>が<MESSAGE>を含む場合は200px)が設定されていますが、"min-width"はそのデフォルト値を上書きします。

・コンテナ要素の内容領域に最大幅("max-width")を設定できるようにした。

・"min-height"がmarginとpaddingを含む高さに適用されていた問題を修正した。

設定ファイル

レス表示スタイルのIDは半角英数字と'_'(アンダースコア)からなる文字列で、先頭に'_'は使えません。また、"Default"と"Rectangle"(大文字・小文字を区別しない)は存在しても無視されます。

「レス表示スタイルの設定…」でID(以下は"Test"がIDに指定されている場合を説明)を指定している場合、起動時にログ保存用フォルダの"style"フォルダ下の"Test"フォルダに"style.txt"が存在すればそのフォルダが使用されます。次に"Test.zip"が存在しかつその中に"style.txt"が存在すればそのファイルのフォルダを"Test"フォルダと見倣します。この時フォルダの名前は"Test"である必要はなく、また"style.txt"がフォルダに入っている必要もありません。

ファイルの文字コードはUTF-8、構成は


<PROPERTY>
Name=スタイル名
</PROPERTY>

<STYLE>
  背景・境界の指定
</STYLE>

<HEADER>
  ページ最上部の要素配置の指定
</HEADER>

<RES>
  通常レスの要素配置の指定
</RES>

<NEWRES>
  新着レスの要素配置の指定
  (存在しない場合は<RES>〜</RES>が使用される)
</NEWRES>

<NGRES>
  NGレスの要素配置の指定
</NGRES>

<NEWNGRES>
  新着NGレスの要素配置の指定
  (存在しない場合は<NGRES>〜</NGRES>が使用される)
</NEWNGRES>

<BOOKMARK>
  しおりの要素配置の指定
</BOOKMARK>

<NEWMARK>
  新着境界の要素配置の指定
</NEWMARK>

<PREVIEWMARK>
  書き込みプレビュー境界の要素配置の指定
</PREVIEWMARK>

<FOOTER>
  ページ最下部の要素配置の指定
</FOOTER>

<POPUP>
  ポップアップ用の<HEADER>・<RES>・<NEWRES>・<NGRES>・<NEWNGRES>・<FOOTER>
</POPUP>

で、<STYLE>〜</STYLE>・<RES>〜</RES>は必須、その他はなくてもかまいません。

以下の説明では<RES>・<NEWRES>・<NGRES>・<NEWNGRES>をまとめて<?RES>と表記する場合があります。

<PROPERTY>〜</PROPERTY>(<PROPERTY>と</PROPERTY>はそれぞれ単独の行に存在しなければならない)内の"Name="の後の文字列(上の例では"スタイル名")がこのスタイルの名前になり、レス表示スタイル選択ダイアログのコンボボックスで"スタイル名 [ID]"のように表示されます。注意:スタイルのID(フォルダ名またはZIPファイル名)は自由に変更できるが重複できない、スタイルの名前はスタイル固有のものだが別のスタイルと名前が重なってもかまわない、という特徴があります。(名前も重ならないに越したことはありませんが。)

<POPUP>〜</POPUP>の内側で<RES>・<NEWRES>・<NGRES>・<NEWNGRES>・<HEADER>・<FOOTER>を設定すると、それらはポップアップで使用されます。これらを全て設定する必要はなく、<NEWRES>・<NEWNGRES>の設定が無い場合は<RES>・<NGRES>が使用され、さらに<RES>・<NGRES>も設定されていない場合はレス表示欄の<RES>・<NGRES>が使用されます。(つまり、"<POPUP></POPUP>"だけが存在するとレス表示欄の設定がそのまま使われる。)<HEADER>・<FOOTER>は<POPUP>〜</POPUP>内の設定が無いと表示されませんが、<POPUP option="header">のように<POPUP>にoptionを追加すると、<POPUP>より前に設定した<HEADER>がそのままポップアップでも使用されます。(<FOOTER>は<POPUP option="footer">、<HEADER>・<FOOTER>両方の場合は<POPUP option="header footer">。)。<POPUP>〜</POPUP>内で<RES>・<NEWRES>・<NGRES>・<NEWNGRES>・<HEADER>・<FOOTER>以外を設定するとエラーになります。注意:全体の設定は"root"ではなく"popuproot"クラスで設定します。また、<HBOX>は子要素のうち右端の子要素だけ"width"の設定が無く、残りの子要素に"width"が設定されている場合に限りポップアップで使用できます。(以下この制限を「HBOX制限」と呼びます。)<?RES>に「HBOX制限」に従わない<HBOX>を使っていない場合は、<STYLE>〜</STYLE>の".root{"を".root,.popuproot{"に書き換え、style.txtの最後に"<POPUP></POPUP>"を追加することで、レス表示欄とポップアップを(背景画像を除き)同じスタイルで表示することができます。

スタイル

背景・境界の指定はSTYLEタグの間でCSSに似た書式で指定します。(CSSに関してはCSSガイド等を参照してください。)CSSとの違いは:

以下のプロパティはCSSにないものです。

"background-overflow": デフォルトは"hidden"で、"background-image"の領域外にはみ出した部分は描画されない。"visible"を指定すると、"background-image"の領域外にはみ出した部分も描画する。ただし"visible"が有効なのは"background-repeat"が"no-repeat"の場合のみ。

"border-image": 画像ファイルの相対パス中に

"border-overflow": "border-image"の外枠からはみ出した部分を描画する場合は"visible"を指定してください。2番目の値("hidden"または"visible")を指定するとpaddingより内側の"border-image"を描画するかどうかを設定できる。"border-overflow"のデフォルト値は"hidden visible"。注意:今のところ"hidden"では中央("C")の画像はpaddingより外側の部分も描画されない。

"border-radius": "background-color"と共に指定し、背景色で塗り潰される長方形領域の角の半径を指定する。今のところ境界線の角は丸く描画されない。

"frame-color": "popuproot"クラスでポップアップの枠色を指定する。

要素の配置

要素はRESタグ等の間でHTMLに似た書式で指定します。以下は<RES>に対して説明していますが、<HEADER>・<NEWRES>・<NGRES>・<FOOTER>・<BOOKMARK>・<NEWMARK>・<PREVIEWMARK>にも適用されます。

出発点

style.txtの内容を下のようにするとデフォルトの表示と同じになります。ここから少しづつ変えていくのがいいかもしれません。

<STYLE>
.inf,.ng { padding: .5em .5em .2em .5em;}
.msg { padding: .2em .5em .5em 2em;}
</STYLE>

<RES>
  <DIV class="inf"><NUMBER> :<NAME> [<MAIL>] :<TIME><IDSET><AUXSET></DIV>
  <DIV class="msg"><MESSAGE></DIV>
</RES>

<NGRES>
  <DIV class="ng"><NUMBER> 非表示:<NGREASON></DIV>
</NGRES>

例1(レス番号行の背景に画像)

Janeのスキンでよく見かけるタイプの背景ですが、幅はレス表示欄の幅に従って変化し、改行された場合も高さが変化します。

"style.txt"と画像ファイルはstyle_barex1.zipにあります。"style.txt"は上の「出発点」とほぼ同じですが、<STYLE>〜</STYLE>が以下のようになっています。

<STYLE>
.root { background-color: #CCC;} /* 画像を見易くするために背景を灰色に */
.inf,.ng { margin: .1em .5em 0; padding: 4px 17px 11px 12px; /* 周囲のスペース調節 */
  border-image: url(image/hdr_[A].png);} /* 背景画像 */
.msg { padding: .2em .5em .5em 2em;}
</STYLE>

変更履歴

H20080723の変更点

・ポップアップで限定的に<HBOX>が使用できるようにした。

<HBOX>の子要素のうち右端の子要素だけ"width"の設定が無く、残りの子要素に"width"が設定されている場合に限りポップアップで使用できます。(以下この制限を「HBOX制限」と呼びます。)

・左右の"margin"の値に"auto"を使用できるようにした。

外側のコンテナ要素で使用できます。例えば
<HEADER><DIV class="hdr">X</DIV></HEADER>
と".hdr{margin:0 auto;}"で<HEADER>をセンタリングすることができます。"text-align: center"との違いは境界("border")の全幅が内容のサイズに合った大きさになることです。注意:<*RES>では使用できず、前項の「HBOX制限」があります。

・サムネイルをまとめて表示する位置を設定できるようにした。

<THUMBNAIL>で指定できます。現在<THUMBNAIL>自体に"margin"や"padding"を設定することはできないので、典型的な使い方は
<DIV class="thmn" option="thumbnail"><THUMBNAIL></DIV>
のようになります。「option="thumbnail"」は<VBOX>・<HBOX>・<DIV>に対して指定でき、サムネイル画像を「本文外にまとめて表示」しない場合(デフォルト)はそれらを無視します。もし「option="thumbnail"」を指定しないと<THUMBNAIL>自体は表示されませんが、<VBOX>・<HBOX>・<DIV>の"margin"や"padding"による領域が残ってしまいます。

・ポップアップで<HEADER>・<FOOTER>を表示できるようにした。

<POPUP>〜</POPUP>内で<HEADER>・<FOOTER>を設定してください。<POPUP option="header">のように<POPUP>にoptionを追加すると、<POPUP>より前に設定した<HEADER>がそのままポップアップでも使用されます。(<FOOTER>は<POPUP option="footer">、<HEADER>・<FOOTER>両方の場合は<POPUP option="header footer">。)もちろん「HBOX制限」が適用されます。

T20080630aの変更点

・"background-attachment"が"fixed"の時はレス表示欄に対して画像を固定するようにした。

水平スクロールバーの状態によらず画像の位置は変化しません。

・"background-attachment"が境界("border")に影響しないようにした。

"background-attachment"によって境界("border")の位置・サイズを変えるようにしたのは何か理由があったような気もしますが思い出せない…。

・IDが存在しない場合タグ外の文字を表示しない設定ができるようにした。

<SPAN class="id">〜</SPAN>でタグ外の文字を囲むと囲まれた文字はIDが存在しないレスでは無視されます。

・<ID option="nolabel">でラベルを表示しない場合直前のスペースも表示しないようにした。

・スタイルの設定によってはCPU使用率がほぼ100%になってしまうことがある問題を修正した。

T20080630の変更点

・スレッド毎にレス表示スタイルを設定できるようにした。

これまでスタイルのIDは"Test"に固定されていましたが、"style"フォルダの下のフォルダ名またはZIPファイル名をIDとしてそれらをスレッド毎に選択できるようになりました。IDは半角英数字と'_'(アンダースコア)からなる文字列で、先頭に'_'は使えません。また、"Default"と"Rectangle"(大文字・小文字を区別しない)は存在しても無視されます。初期状態ではデフォルトのレス表示スタイルを使用する設定になっているので、レス表示スタイルをカスタマイズしていた方は「設定」メニューの「レス表示スタイルの設定…」で「全体」の「選択したスタイルを使用する」をチェックしコンボボックスから"Test"を選択してください。(設定前に"Test"をよりスタイルにふさわしいIDに変更しておいた方がいいかもしれません。)レス表示スタイルの「再読み込み」は表示されているスレッドのスタイルだけが対象になります。

・スタイルに名前を付けられるようにした。

<STYLE>より前に

<PROPERTY>
Name=スタイル名
</PROPERTY>


(<PROPERTY>と</PROPERTY>はそれぞれ単独の行に存在しなければならない)を置くと、このスタイルの名前が"スタイル名"になり、レス表示スタイル選択ダイアログのコンボボックスで"スタイル名 [ID]"のように表示されます。スタイルのID(フォルダ名またはZIPファイル名)は自由に変更できるが重複できない、スタイルの名前はスタイル固有のものだが別のスタイルと名前が重なってもかまわない、という特徴があります。(名前も重ならないに越したことはありませんが。)

・ポップアップの枠色を変更できるようにした。

"popuproot"クラスで"frame-color"を設定してください。例:".popuproot {frame-color: red;}"

・外部コマンドでレス表示スタイルのフォルダへのパスを使えるようにした。

コマンド中の"$STYLEDIR"はレス表示欄のレス表示スタイルのフォルダに置換されます。フォルダが存在しない場合(レス表示スタイルがZIPファイルから読み込まれている時等)には"$STYLEDIR"を含むコマンドはエラーになります。

・新着NGレス用のスタイルを設定できるようにした。

<NEWNGRES>〜</NEWNGRES>が新着NGレスに適用されます。<NEWNGRES>が設定されていなければ<NGRES>が使われます。

・ポップアップ用のスタイルを設定できるようにした。

<POPUP>〜</POPUP>の内側で<RES>・<NEWRES>・<NGRES>・<NEWNGRES>を設定すると、それらはポップアップで使用されます。これらを全て設定する必要はなく、<NEWRES>・<NEWNGRES>の設定が無い場合は<RES>・<NGRES>が使用され、さらに<RES>・<NGRES>も設定されていない場合はレス表示欄の<RES>・<NGRES>が使用されます。(つまり、"<POPUP></POPUP>"だけが存在するとレス表示欄の設定がそのまま使われる。)<POPUP>〜</POPUP>内で<RES><NEWRES><NGRES><NEWNGRES>以外を設定するとエラーになります。注意:<POPUP>〜</POPUP>はstyle.txtの最後に置いてください。全体の設定は"root"ではなく"popuproot"クラスで設定します。また、<HBOX>はポップアップでは使用できません。<RES>等に<HBOX>を使っていない場合は、<STYLE>〜</STYLE>の".root{"を".root,.popuproot{"に書き換え、style.txtの最後に"<POPUP></POPUP>"を追加することで、レス表示欄とポップアップを(背景画像を除き)同じスタイルで表示することができます。

・<ALLRESCOUNT>等を<?RES>〜</?RES>の中でも使えるようにした。

<NEWRESCOUNT>・<ALLRESCOUNT>・<GETRESCOUNT>・<SIZE>・<SIZEKB>が使えるようになったはず。注意:現在これらが<RES>〜</RES>または<NGRES>〜</NGRES>で使われている場合には、スレッドの更新時は常に(既得レスも含め)全レスのレイアウトを再計算します。

・<ID>のID本体だけを表示できるようにした。

<ID>のかわりに<ID option="nolabel">を使うとIDの前に付くラベル(普通は"ID:")を表示しません。

・製作支援関連の機能をダイアログにまとめた。

「スレッド」メニューの「レス表示スタイル」→「製作支援…」で表示されます。現在は枠・境界・背景の表示・非表示切り替えとレス表示スタイルの再読み込みができます。

・"border-image"のpaddingより内側にはみ出した部分を描画しない設定ができるようにした。

"border-overflow"に2番目の値("hidden"または"visible")を指定するとpaddingより内側のborder-imageを描画するかどうかを設定できます。"border-overflow"のデフォルト値は"hidden visible"です。注意:今のところ"hidden"では中央("C")の画像はpaddingより外側の部分も描画されません

・レスの被参照回数の表示位置を設定できるようにした。

<RES>等の中に<REFCOUNT>が存在するとデフォルトの位置(レス番号の直後)には被参照回数が表示されなくなります。<BR>タグのクラスに"refcount"を指定する(<BR class="refcount">)と、被参照数が0の場合その<BR>タグは無視されます。(<SPAN class="refcount">〜</SPAN>に囲まれたタグ外の文字も同様に無視されます。)

・レスのチェックボックスの表示位置を設定できるようにした。

<RES>等の中に<RESCHECKBOX>が存在するとレスのチェックボックスがその位置に表示されるようになります。