使用播放器SDK为Android和iOS添加外挂与M3U8字幕

阿里云播放器支持标准WebVTT流的双端解析渲染，可读取CSS样式并按标准实现双端统一字幕样式。并支持单文件多文本样式，适用于角色对话区分、重点内容强调及特殊视觉效果等场景。

以下为示例WebVTT文件：

REGION：显示区域定义。

STYLE：字体样式定义（首项为默认样式）。

WEBVTT

REGION

id:bottom

width:70.000000%

lines:3

viewportanchor:15.000000%,95.000000%

regionanchor:0.000000%,100.000000%

scroll:up

STYLE

::cue {

color: white;

font-size: 70%;

font-family: Noto Sans;

font-weight: bold;

background-color: rgba(0, 0, 0, 0.2);

}

::cue(.font1) {

color: rgba(255, 255, 255, 1);

font-weight: bold;

font-family: Noto Sans;

outline-width: 3px;

outline-color: rgba(0, 0, 0, 1);

}

::cue(.font2) {

color: rgba(252, 255, 101, 1);

font-style: bold;

font-family: Noto Sans;

outline-width: 3px;

outline-color: rgba(0, 0, 0, 1);

}

::cue(.font3) {

color: rgba(255, 191 23, 1);

font-style: bold;

font-family: Noto Sans;

outline-width: 3px;

outline-color: rgba(183, 28, 28, 1);

}

00:00:00.200 --> 00:00:01.800 region:bottom align:center

被告人薄寒时

00:00:01.800 --> 00:00:03.200 region:bottom align:center

你还有什么话要说

00:00:04.100 --> 00:00:04.800 region:bottom align:center

我

00:00:11.200 --> 00:00:12.200 region:bottom align:center

我无话可说

00:00:14.500 --> 00:00:16.200 region:bottom align:center

被告人薄寒时

...为文字片段指定特定样式，请参照如下设置：

我无话可说