rd.rdlevel.cn/pages/captions.md
2026-06-18 17:53:30 +08:00

250 lines
14 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

# 文字事件
## 浮动文字基本设置
如果我们要制作一首歌曲的谱面,一般而言都会考虑将歌词显示在画面中,这是一种简单粗暴,但能快速提升整体观感的做法。要在画面中加上字幕,我们需要在紫色的版块中找到**浮动文字**事件。
选择这个事件后我们可以发现最开始的两行很有Word的感觉。
![](../images/floatingtext-fontslyle.png)
**aA**:可以调整字号大小,字号基本上没有上限,如果设置太大的话,文字就会**超出屏幕**。
**旋转**:可以旋转浮动文字框,注意是**整个文本框的旋转**,而不是每个字单独旋转。
**AB**:两个颜色分别是字的颜色和字符描边的颜色,刚才所说的字号里面,**只会包含字符本体的大小**,描边是没有算在里面的。
**↔**:指定浮动文字横向的基准位置。
**↕**:指定浮动文字纵向的基准位置。
![](../images/floatingtext-position.png)
**字体**:可以强制文本是哪种字体,有像素字体(不支持中文)、矢量字体(中文默认显示的字体)和粗体字体(`2-X`判定文字同款)
![](../images/captions_FONT.png)
**位置**:指的是基准的位置。可以按一下准星符号再在预览画面窗口中点选位置。有条件精准找到位置的话还是建议在`X``Y`栏中输入具体数值。**点击右边的`%`按键可以切换屏幕像素点和屏幕百分比两种输入方式**。
![不同基准在同一位置下的不同效果](../images/floatingtext-align.png)
**文字**:就是输入文本的地方了。纯英文文本是使用的像素字体,带有中文字符的情况下会全部变成矢量字体,如果你想要纯英文文本也显示矢量字体的话,可以回车键再在第二行输入一些中文,如下图所示。当文字框里没有中文时就无法输入中文,需在游戏外部打好要插入的文本,并通过复制粘贴的方式输入。
![](../images/floatingtext-example.png)
另外,目前已知中文繁体以及日语假名都可以在画面中正常显示。
![二次元歌曲狂喜](../images/floatingtext-jp.png)
**创建文本递进**:如果想要把一整句歌词按歌词节奏一个一个地显示出来,就需要在文本中使用“`/`”将它们隔开。如果想要一个一个地覆盖掉之前显示的内容,就需要在文本中使用`回车键`将他们隔开。之后点击下面的“创建文本递进”,在工作区里面可以拖动右箭头事件来调整时机。如果你做好了又不想要了,那么再把下面的开启改成关闭即可,无需手动删除。如果你又反悔了,还是想要,再改成开启,又会恢复记录。
```rdview 8 3
ea.FloatingText 1 1;
ea.AdvanceText 2 1;
ea.AdvanceText 3 1;
ea.AdvanceText 4 1;
ea.AdvanceText 5 1;
ea.AdvanceText 6 1;
ea.AdvanceText 7 1;
```
音节的消失方式选择**淡出**就是慢慢消失,**立即**就是瞬间消失,音节显示的时长是按创建文本递进的最后一个事件往后数拍子的。
```rdview 13 3
ea.FloatingText 1 1;
g 3 1 4 1;
g 7 1 0 1 #f80;
ea.AdvanceText 3 1;
g 8 1 4 1;
g 12 1 0 1 #f80;
ea.AdvanceText 8 1;
```
## 更丰富的效果和技巧
这个模块的基本功能就是上面那些,但是实际使用起来其实非常灵活。如果想要制作视觉效果更为丰富的字幕,就需要我们打开脑洞,多去深挖这些基础功能。下面我举几个例子给大家做一些启发。
**1、**如果想一次性显示多行,需要在换行的地方加上`\n`。输入`\/`才能打出“/”。
**2、**文本旋转效果是整个文本框的旋转,如果想要做到每个字都旋转,那么同样需要添加多个浮动文字模块,添加相同的旋转角度。如果想要让文本围绕一个中心旋转,那么直接用准星功能去找位置会方便一些。
**3、**如果在同一时刻同一位置有多个不同的浮动文字,那么字在屏幕中的上下层顺序只和你添加事件的先后顺序有关,先加入的事件在下层,后加入的事件在上层。这个机制无法进行修改。
**4、**如果想要给文本做颜色渐变的效果,可以在相同时间相同位置添加两个浮动文字,其中一个消失方式选择淡出,另一个选择立即,这样就获得了渐变效果。
**5、**把文字递进里面添加很多错误的文字,然后全部一个字一个字回车,就可以做到文字在同一位置的乱码效果。
**6、**在文本的最后放一个竖线“\|”或者下划线“\_”就可以做出打字的效果了。
![](../images/floatingtext-typing.gif)
```
ぼ|
ぼく|
僕|
僕の|
僕のゆ|
僕のゆめ|
僕の夢|
僕の夢
そ|
そう、|
そう、わ|
そう、わた|
そう、わたし|
そう、私|
そう、私の|
そう、私のゆ|
そう、私のゆめ|
そう、私の夢|
```
**7、**创建了一组文本递进之后,只需要双击浮动文字事件本身,整组字幕都会被选中。不需要一个个手动去点选了。
**8、**基准的左中右会影响文本递进效果。靠左时从左向右出现文本递进;靠中时从中间挤向两侧出现文本递进;靠右时从右向左出现文本递进。
**9、**在文本框的最后加一个空行,就可以通过文本递进的方式设置文本的结束时间,避免了一点点数格子的烦恼。
**10、**在文字中的个别字符前面加上`<color=#RRGGBBAA>`,后面加上`</color>`可以改变这几个字的颜色和透明度。关于颜色的介绍由于篇幅关系将放在下一小节。
![](../images/floatingtext-rainbow.png)
对应文本框内容为:
```html
<color=red>Wel</color><color=orange>come </color><color=yellow>to </color><color=green>Won</color><color=aqua>der</color><color=blue>land</color><color=purple>!</color>`<br>
<color=red></color><color=orange></color><color=yellow></color><color=green></color><color=aqua></color><color=blue></color><color=purple></color>
```
## 演示关卡
你以为这里会有一个我们制作的关卡?其实并不。在这里我想介绍的是官方联动关卡`MD-2`,不知道你们在游玩这关感受爆炸难度的同时有没有注意到字幕的表现?如果你没有什么印象的话可以先看看下面这个视频:
<div class="bv"><iframe src="https://player.bilibili.com/player.html?aid=374450491&page=56&autoplay=0" title="BPM 与偏移的校对教程" width="100%" height="100%" scrolling="no" frameborder="no" framespacing="0" allowfullscreen="true"></iframe></div>
看完之后我们再来回忆一下其中一段歌词的表现:
> `夜深了 月光也换了颜色`<br>
> 【换了颜色】字体为黑色
>
> `要更迷幻更鲜艳眩目得赤裸`<br>
> 【鲜艳炫目】字体为亮蓝色
>
> `我也将披上褪浅的音色`<br>
> 【褪浅的音色】消失更早
>
> `逃离这个现实的现在时分的陷落`<br>
> 这句意外的正常
>
> `像逆行在通往大人的公路`<br>
> 【像逆行在】四个字是从右往左出现的,也就是位置基准改成了靠右
>
> `粉红的喇叭裤 墨镜里装星空`<br>
> 【粉红】两字为粉红色,【星空】两字为蓝色和紫色
>
> `忽闪忽灭的影子中`<br>
> 【忽】字反复出现和淡出了几次,【影子】是黑色
>
> `撞见了另一个我`<br>
> 【另一个我】有两份文字略微偏移重叠在一起
有没有发现不管是颜色效果还是显示效果,在设计上都和歌词本身有着些许联系,也就让平淡无奇的歌词字幕一下子变得生动起来。
## 显示对话
在不少剧情关卡里面角色都会有聊天的过程,这在编辑器内也是可以轻松实现的,需要的是紫色版块中的**显示对话**功能。
点开后能很清晰地看到文本框,我们就是在这里输入对话。点击右下角的微笑脸可以选择出现的人物立绘:先选择人物,再选择动作。对于使用官方角色的情况下,这是一种比较直观的方法。对于自制角色的立绘表情,将在[这里](../pages/spritesheet.md#选择立绘)介绍,此处暂且不表。
下面的三个设置内容都非常直观,就不再多赘述了。
![对话事件的属性](../images/captions-dialogueproperties.png)
**需要注意的是:**
1. 你可以一次性输入多行文本,这样在实际显示时就会在同一对话框内逐步刷新每一行台词;如果使用多个显示对话事件,每个事件只输入一行文本,那么对话框有可能在一个事件之后消失再生成,影响连贯性。
2. 显示对话事件一次只能显示一个对话框,如果前一个事件的台词没有走完下一个事件就开始了,那么前一个会直接被顶替掉。即使设置为屏幕上方和屏幕下方各一个也会被顶替。
3. 一个对话框只能显示两行文字,多出来的会无法显示,请注意分段。分段后需要再输入一次立绘人物,否则立绘就不再显示了。
4. 如果需要实现像官方教程一样的可以手动跳过的对话框效果,可以添加自定义方法`activeDialogues = true`或`activeDialoguesImmediately = true`。
- 如果启用`activeDialogues = true`
在对话事件所在小节已经播放完毕而对话仍未结束时,游戏会等待至游戏音乐的下一个小节开始时继续播放;
- 如果启用`activeDialoguesImmediately = true`
- 如果对话事件结束时所在小节仍然未播放完毕,
游戏会等待至游戏音乐的下一个节拍开始时立即从时间轴的下一个小节继续播放。
- 如果对话事件所在小节已经播放完毕而对话仍未结束,
游戏会等待至游戏音乐的下一个节拍开始时继续播放。
5. 编辑器会自动识别标点符号,并在标点符号的位置自动添加不同程度的语句停顿,非常智能。但要注意,数学上的小数点“.”是会被判定为英文的句号的,从而产生停顿,非常不智能。
6. 从外界复制粘贴进入的文本中,换行符是有问题的,要退格两次才能被删掉,否则台词会叠在一起;最好的做法当然是不要复制进多余的换行符号。
![对话事件](../images/captions-dialoguecontent.png)
7. 可以使用对话标签控制对话的显示效果,这些标签总是被包裹在中括号里的。支持的标签如下:
- `[vslow]` - 非常慢
- `[slow]` - 慢
- `[normal]` - 正常速度
- `[fast]` - 快
- `[vfast]` - 非常快
- `[shout]` - 闪烁屏幕,高速显示
- `[flash]` - 闪烁屏幕
- `[#]` - 暂停\#秒
- `[shake]` - 让位于该标签后的文本摇晃。
- `[shakeRadius=X]` - 若与 \[shake\] 标签相邻,则设定摇晃的距离。
- `[wave]` - 让文本波浪式摇摆。
- `[waveHeight=Y]`
- `[waveSpeed=X]`
- `[swirl]` - 让文本以圆周运动的方式旋转。
- `[swirlRadius=Y]` - 文本转起来
- `[swirlSpeed=X]`
- `[static]` - 让此前设置移动方式的标签失效,位于该标签后的文本将不受前面的标签影响。
**8、** 可以使用颜色标签更改文字的颜色,只需按以下格式输入:`<color=文字颜色>要更改颜色的文字</color>`。代码中的颜色可以使用十六进制颜色值(不透明的 #RRGGBB 或包含透明度信息的 #RRGGBBAA ,也可以使用[Unity富文本的颜色名](https://docs.unity3d.com/Packages/com.unity.ugui@1.0/manual/StyledText.html)
| 颜色(中文) | 颜色(英文) | RGB | 示例 |
| :--- | :--- | :--- | :--- |
| 黑色 | black | `#000000` | <font color="black">示例</font> |
| 银色 | silver | `#c0c0c0` | <font color="silver ">示例</font> |
| 栗色 | maroon | `#800000` | <font color="maroon">示例</font> |
| 红色 | red | `#ff0000` | <font color="red">示例</font> |
| 深蓝色 | navy | `#000080` | <font color="navy">示例</font> |
| 蓝色 | blue | `#0000ff` | <font color="blue">示例</font> |
| 浅蓝色 | lightblue | `#add8e6` | <font color="lightblue">示例</font> |
| 紫色 | purple | `#800080` | <font color="purple">示例</font> |
| 品红色 | fuchsia / magenta | `#ff00ff` | <font color="fuchsia">示例</font> |
| 绿色 | green | `#008000` | <font color="green">示例</font> |
| 莱姆色 | lime | `#00ff00` | <font color="lime">示例</font> |
| 橄榄色 | olive | `#808000` | <font color="olive">示例</font> |
| 黄色 | yellow | `#ffff00` | <font color="yellow">示例</font> |
| 墨绿色 | teal | `#008080` | <font color="teal">示例</font> |
| 青色 | cyan / aqua | `#00ffff` | <font color="aqua">示例</font> |
| 灰色 | gray | `#808080` | <font color="gray">示例</font> |
| 橙色 | orange | `#ffa500` | <font color="orange">示例</font> |
| 白色 | white | `#ffffff` | <font color="white">示例</font> |
## 显示状态牌
除了浮动文字和对话框外,游戏里还有两个可以显示文字的事件。**显示状态牌**会在屏幕的左上角弹出一个带文字的状态牌,效果如下:
![显示状态牌事件](../images/captions-statussign.png)
状态牌的文字只可以显示一行,最好给状态牌文字设计得简洁一点。如果屏幕上已经存在状态牌,新的显示状态牌事件会修改当前状态牌上的文字,并重置状态牌的显示时长。另外,状态牌不会被任何干扰特效遮挡,是可信度最高的提示,非特殊机制,建议不要用来误导玩家判断或作为干扰。
持续时间里的“节拍”可以按,更换为以秒计时。
## 弹幕效果
另一个事件是**弹幕效果**,会刷出一大堆相同的字符串,同样的,只支持输入一行文字。
颜色可以选择单一的颜色,也可以选择随机的彩色。
弹幕移动方向也可以选择从左向右或是从右向左,这是个好文明,弹幕能选择方向之后也许会有些奇效。
![弹幕事件](../images/captions-danmaku.gif)