跳到主要内容

章 10 · 篇 II · 工艺

配置:漫画

comics设置:漫画页的画框和格间距、分格样式、嵌字、对白框样式和角色表

更新于 2026-10-103分钟enescaptzhjaar

简单来说

本页讲漫画页面的设置。你可以设定页面的画框和分格之间的间距。你可以选择嵌字的字体和字号。你可以定义对白框、旁白框和拟声词怎样画。你还可以列出角色,让每个角色用自己的样式说话。漫画指南讲解怎样写这些页面。

#漫画

comics属性配置漫画页(:::page)、漫画条(:::strip)和跨页:分格从中切出的画框和格间距、分格样式、嵌字、对白框样式以及角色表。只有含漫画的文档才读取它;没有漫画的文档,排版结果与以前完全相同;含漫画却没有comics一节的文档,采用其语言的默认值。标记和嵌字的方式见漫画。

const config: PostextConfig = {
  comics: {
    readingDirection: 'auto',
    gutter: { horizontal: { value: 5, unit: 'mm' }, vertical: { value: 2.5, unit: 'mm' } },
    panel: { borderWidth: { value: 0.8, unit: 'pt' }, borderStyle: 'rough' },
    panelStyles: [{ id: 'night', background: { hex: '#14142b', model: 'hex' }, borderColor: { hex: '#ffffff', model: 'hex' } }],
    lettering: { fontSize: { value: 8.5, unit: 'pt' }, textTransform: 'uppercase' },
    balloonStyles: [{ id: 'eerie', shape: 'wavy', italic: true }],
    cast: [{ id: 'maya', name: '玛雅' }, { id: 'tomas', name: '托马斯爷爷' }],
  },
};
属性类型默认值说明
readingDirection'auto' | 'ltr' | 'rtl''auto'一行中各分格的顺序。'auto'在从右到左的文档、竖排文档以及日文和繁体中文中从右往左读,否则按artDirection的方向读(简体中文和韩文也是如此)。页面的direction属性可以覆盖它。page.binding: 'auto'时,漫画从右往左读的书在右侧装订。
artDirection'ltr' | 'rtl''ltr'画稿绘制时设想的阅读方向:日本漫画为'rtl'。
mirrorArtbooleanfalse把阅读方向与artDirection相反的页面上的画面左右翻转。分格写mirror=false时保持原画。
frame.marginsPageMargins页面边距漫画页自己的边距(top、bottom、left、right、mirror)。分格从这些边距以内的区域切出;未设置时,从页面的版心切出。
gutter.horizontalDimension4mm行与行之间的距离。页面的gutter属性可以覆盖它。
gutter.verticalDimension2mm同一行中左右相邻的分格之间的距离。
panelPanelStyleConfig见下文默认的分格样式。
panelStylesNamedPanelStyleConfig[][]命名分格样式,用:::page{style=…}或::panel{style=…}选取。每个样式有一个id、一个可选的name(只用于编辑器界面)和分格样式的各个字段;未设置的字段沿用panel。
letteringLetteringConfig见下文全书每个对白框的字体、字号和排印规则。
balloonStylesBalloonStyleConfig[]九种内置样式按种类划分的对白框样式。内置样式始终存在;id与内置样式相同的条目修改该样式,新id的条目添加一个以speech为基础的样式。
castComicCastMember[][]角色(见角色表)。
runningHeadsbooleanfalse在漫画页上印书眉和页码。关闭时,漫画页只有分格,但它的页码照样计数。
viewerLeafComicViewerLeafConfig未设置用于页面不是纸页的宿主:把漫画页排在一张印刷纸页上(width、height、margins),缩放到fitWidth px宽(高度最多fitHeight px),放在页面顶部。沙盒的HTML查看器设置它;它从不随文档保存。

#分格样式

comics.panel以及comics.panelStyles的每个条目:

属性类型默认值说明
borderWidthDimension1pt边框粗细;0表示不画边框。边框沿分格的轮廓描画。
borderColorColorValue黑色边框颜色(可链接调色板)。
borderRadiusDimension0矩形分格的圆角半径,最大为较短边的一半。被斜线切出的分格保持尖角。
borderStyle'solid' | 'rough' | 'none''solid'干净的直线、略带抖动的手绘线(以分格为种子生成,所以每次排版都一样),或者不画。
backgroundColorValue白色画面下面的底色:空分格的颜色,以及完整显示画面时四周色带的颜色。
fit'cover' | 'contain''cover'cover裁切画面以填满分格,但绝不切进安全区;contain完整显示画面。
bleedbooleanfalse使用这个样式的分格,在每条贴着画框的边上越过画框,延伸到裁切线和出血位。

#嵌字

comics.lettering设定全书的每个对白框。字号只有一个:对白框样式可以按比例缩放它(fontScale),文字从不为了塞进对白框而缩小。

属性类型默认值说明
fontFamilystring按语言嵌字字体。未设置时为Comic Neue;日文为Zen Antique,简体中文为Noto Sans SC,繁体中文为LXGW WenKai TC,阿拉伯文、波斯文和乌尔都文为Playpen Sans Arabic(defaultComicFont(locale))。
fontSizeDimension7.5pt对白框文字的字号。印刷页面上的漫画嵌字通常在7到9 pt之间。
lineHeightnumber1.15行与行之间的距离,以字号的倍数表示。保持默认值时,竖排以及中文和日文的对白框取1.5,阿拉伯文取1.45。
colorColorValue黑色文字颜色。
bold、italicbooleanfalse把全部嵌字排成粗体或斜体。中文、日文和阿拉伯文的嵌字从不倾斜。
letterSpacingDimension0字与字之间额外增加的距离;em相对于文字字号。阿拉伯文从不加字距。
writingMode'auto' | 'horizontal' | 'vertical''auto''auto'让日文和繁体中文以及任何竖排的文档竖排成列嵌字,其他一律横排。台词行的vertical或horizontal标记可以让那一行另行排列(见漫画 › 嵌字)。
textTransform'none' | 'uppercase''none'全部大写,这是美式和欧式嵌字的传统样式。没有大小写之分的文字保持原样。
dropFinalStop'auto' | boolean'auto'省略对白框末尾的句号(日本漫画中的。)。'auto':只用于日文和中文。
doubleDashbooleanfalse把破折号写成--,这是美式嵌字的习惯。
insetDimension1.5mm对白框与所在分格边框之间保留的距离。紧贴边框的旁白框不受它限制。
joinSameSpeaker'butt' | 'connector' | 'none''butt'同一说话人连续的两个对白框:框体合成一条轮廓,用一段细颈相连,或者保持分开。台词行可以用join或join=false单独指定。
maxColumnCharsnumber8竖排嵌字时,对白框中一列最多的字数。拟声词五个字后换列。

#对白框样式

comics.balloonStyles的每个条目叠加在id相同的内置样式(speech、thought、whisper、shout、radio、caption、inner、note、sfx)之上;id是新的时,叠加在speech之上。下表的默认值是speech的;每种内置样式改变了哪些值,见漫画一页。以em为单位的长度相对于对白框文字的字号。

属性类型默认值说明
idstring必填台词行用来指定这个样式的词:ben{whisper}: …或style=whisper。
namestringid便于阅读的名称,只用于编辑器界面。
shape'oval' | 'rounded' | 'rectangle' | 'cloud' | 'burst' | 'wavy' | 'electric' | 'none''oval'围绕文字的轮廓。'none'把文字直接排在画面上。
fillColorValue白色对白框的填充色。
strokeColorValue黑色轮廓颜色。
strokeWidthDimension0.6pt轮廓粗细。
dashbooleanfalse虚线轮廓(耳语)。
doublebooleanfalse双线轮廓。
wobblenumber0轮廓像手绘线一样抖动的程度,0到1,以对白框为种子生成,所以每次排版都不变。
roundnessnumber2.2椭圆所用超椭圆的指数:2是椭圆,数值越大越方。
burstPointsnumber14爆炸形的尖刺数;0表示按周长计算。
burstDepthnumber0.22爆炸形尖刺的深度,以框体半径的比例表示。
paddingDimension0.55em文字与轮廓之间的空白。
aspectnumber1.6断行时为文字块追求的宽高比(横排嵌字)。
tail'curved' | 'wedge' | 'bubbles' | 'zigzag' | 'none''curved'尾巴。
tailWidthDimension0.9em尾巴从轮廓伸出处的宽度。
tailReachnumber0.55尾巴伸向说话人的长度,以从轮廓到嘴的距离的比例表示。
target'mouth' | 'head''mouth'尾巴指向什么:锚点的嘴,或者它的头(心声)。
position'auto' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'top' | 'bottom''auto'台词行没有固定位置时对白框放在哪里:由嵌字安排,或者放在分格的某个角或某条边上。
buttbooleanfalse把放在角上或边上的对白框紧贴分格边框(旁白框)。
fontFamilystring嵌字字体这个样式的字体。sfx默认使用该语言的拟声词字体:Bangers,日文为Dela Gothic One,简体中文为ZCOOL KuaiLe,繁体中文为LXGW WenKai TC,阿拉伯文为Lalezar(defaultComicSfxFont(locale))。
fontScalenumber1文字字号,以嵌字字号的倍数表示。
bold、italicboolean同嵌字设置粗体或斜体文字。
colorColorValue同嵌字设置文字颜色。
textTransform'none' | 'uppercase'同嵌字设置这个样式全部大写。
letterSpacingDimension同嵌字设置字与字之间额外增加的距离。
align'center' | 'start''center'对白框内文字行的对齐方式。
haloDimension无围绕字形画出的描边及其宽度,让文字压在画面上也能看清(拟声词)。
haloColorColorValue白色描边的颜色。
rotatenumber0按顺时针旋转的角度。台词行的rotate属性优先。

#角色表

comics.cast的每个条目描述一个角色:

属性类型默认值说明
idstring必填脚本和画面锚点所用的说话人键。
namestringidHTML输出和流式EPUB在该角色的台词前印出的名字,编辑器也显示它。
balloonStylestringspeech该角色未指定样式的台词所用的样式。
colorColorValue同样式设置该角色对白框的文字颜色。
fillColorValue同样式设置该角色对白框的填充色。
fontFamilystring同样式设置该角色对白框的字体。

台词行自己的color和font优先于角色表,角色表又优先于对白框样式。每个漫画颜色都可以是调色板条目,像其他链接的颜色一样跟随调色板变化。

const resolved = resolveComicsConfig(config.comics, 'ja');
// => 每个字段都已填好;字体为Zen Antique和Dela Gothic One
 
const minimal = stripComicsDefaults(config.comics, 'ja');
// => 全部是默认值时为undefined
 
const shout = pickBalloonStyle(resolved, 'shout'); // 内置的shout,加上本书的修改
const night = pickPanelStyle(resolved, 'night');   // 命名分格样式,没有时为默认分格