EPUBの目次
EPUBの目次について、どう設定するUIがいいかなと悩んでいた。目次を調べるときに第一話のページを探すには、画像を表示したほうが見つけやすい。ただ小さい文字を観ようとすると大変なので拡大とか全画面表示できたらいいかなとか考えていた。ファイル名でもくじがわかるようにしている場合はファイル名を変更して出力すると割り当てが変わってしまう。
目次に表示する文字と画像を連ねて選択または書き込みできるようにする。どのようなUIが最適だろうか。画像を選択するのにファイル名をプルダウンメニューで選べるようにし、その横側に目次に表示する文字を入力できるようにする。クリックすると画像を表示する。
キンドルでの目次では、XHTMLだけではなく、TOC.NCXでも指定する必要がある。
どうも端末によって表示する目次が違うようだ。
それぞれの目次について指定しておく。
例えば、nav.xhtmlから目次の部分だけを抜き出すと。
<ol>
<li><a href="xhtml/p-cover.xhtml">表紙</a></li>
<li><a href="xhtml/p-001.xhtml">目次</a></li>
</ol>
のように、olタグでliをはさみaタグでリンクを張っている。
増やすときは、
<li><a href="xhtml/p-cover.xhtml">表紙</a></li>
のリスト構造を増やす。
toc.ncx
toc.ncxも同じようにすると、下のように長くなる。プログラムを書くときに問題になりそうなのがplayOrderで、1つずつ増やしていく必要がある。
<ncx:navMap>
<ncx:navPoint id="p01" playOrder="1">
<ncx:navLabel>
<ncx:text>navigation</ncx:text>
</ncx:navLabel>
<ncx:content src="xhtml/p-cover.xhtml"/>
</ncx:navPoint>
<ncx:navPoint id="about" playOrder="2">
<ncx:navLabel>
<ncx:text>目次</ncx:text>
</ncx:navLabel>
<ncx:content src="xhtml/p-001.xhtml"/>
</ncx:navPoint>
</ncx:navMap>
