yaoayanui/src/config/subtitleStylePresets.js

/** 字幕样式字体与快速预设（对齐 Electron SubtitleStyleSelector） */

export const SUBTITLE_FONT_OPTIONS = [
  { label: "胡晓波男神体", value: "胡晓波男神体" },
  { label: "优设标题黑", value: "优设标题黑" },
  { label: "微软雅黑", value: "Microsoft YaHei" },
  { label: "微软雅黑 UI", value: "Microsoft YaHei UI" },
  { label: "月星楷", value: "月星楷" },
  { label: "USMCCyuanjiantecu", value: "USMCCyuanjiantecu" },
  { label: "庞门正道标题体", value: "庞门正道标题体免费版" },
  { label: "霞鹜文楷", value: "霞鹜文楷-Light" },
  { label: "文鼎PL简中楷", value: "文鼎PL简中楷" },
  { label: "杨任东竹石体", value: "杨任东竹石体" },
  { label: "千图厚黑体", value: "千图厚黑体" },
  { label: "Arial", value: "Arial" },
];

export const SUBTITLE_STYLE_PRESETS = [
  {
    label: "黑底白字",
    style: {
      fontColor: "#FFFFFF",
      backgroundColor: "#000000",
      backgroundOpacity: 0.8,
      outlineWidth: 0,
    },
  },
  {
    label: "白底黑字",
    style: {
      fontColor: "#000000",
      backgroundColor: "#FFFFFF",
      backgroundOpacity: 0.9,
      outlineWidth: 0,
    },
  },
  {
    label: "抖音风格",
    style: {
      fontColor: "#FFFFFF",
      backgroundColor: "transparent",
      backgroundOpacity: 0,
      outlineColor: "#000000",
      outlineWidth: 3,
      shadowOffset: 2,
      shadowColor: "#000000",
    },
  },
  {
    label: "红底白字",
    style: {
      fontColor: "#FFFFFF",
      backgroundColor: "#FF0000",
      backgroundOpacity: 0.85,
      outlineWidth: 0,
    },
  },
  {
    label: "黄底黑字",
    style: {
      fontColor: "#000000",
      backgroundColor: "#FFD700",
      backgroundOpacity: 0.9,
      outlineWidth: 0,
    },
  },
  {
    label: "蓝底白字",
    style: {
      fontColor: "#FFFFFF",
      backgroundColor: "#2563EB",
      backgroundOpacity: 0.85,
      outlineWidth: 0,
    },
  },
  {
    label: "绿色高亮",
    style: {
      fontColor: "#00FF88",
      backgroundColor: "transparent",
      backgroundOpacity: 0,
      outlineColor: "#000000",
      outlineWidth: 2,
    },
  },
  {
    label: "紫色高亮",
    style: {
      fontColor: "#E879F9",
      backgroundColor: "transparent",
      backgroundOpacity: 0,
      outlineColor: "#000000",
      outlineWidth: 2,
    },
  },
  {
    label: "立体阴影",
    style: {
      fontColor: "#FFFFFF",
      backgroundColor: "transparent",
      backgroundOpacity: 0,
      outlineWidth: 0,
      shadowOffset: 3,
      shadowBlur: 4,
      shadowColor: "#000000",
    },
  },
  {
    label: "霓虹发光",
    style: {
      fontColor: "#00FFFF",
      backgroundColor: "transparent",
      backgroundOpacity: 0,
      outlineColor: "#FF00FF",
      outlineWidth: 2,
      shadowOffset: 0,
      shadowBlur: 8,
      shadowColor: "#00FFFF",
    },
  },
];

/**
 * @param {Record<string, unknown>} style
 */
export function buildSubtitlePreviewBoxStyle(style) {
  const fontSize = Number(style?.fontSize) || 35;
  const outline = Number(style?.outlineWidth) || 0;
  const offset = Number(style?.shadowOffset) || 0;
  const shadows = [];
  if (outline > 0) {
    const c = style?.outlineColor || "#000000";
    const w = Math.max(1, outline);
    shadows.push(
      `${w}px 0 0 ${c}`,
      `-${w}px 0 0 ${c}`,
      `0 ${w}px 0 ${c}`,
      `0 -${w}px 0 ${c}`,
    );
  }
  if (offset > 0) {
    shadows.push(
      `${offset}px ${offset}px ${Number(style?.shadowBlur) || 4}px ${style?.shadowColor || "#000000"}`,
    );
  }
  const bg =
    style?.backgroundColor &&
    style.backgroundColor !== "transparent" &&
    (Number(style?.backgroundOpacity) ?? 0) > 0
      ? style.backgroundColor
      : "transparent";
  return {
    fontFamily: style?.fontName ? `'${style.fontName}'` : "Microsoft YaHei UI",
    fontSize: `${Math.min(fontSize, 42)}px`,
    color: style?.fontColor || "#FFFFFF",
    backgroundColor: bg,
    padding: bg !== "transparent" ? "4px 12px" : "0",
    borderRadius: bg !== "transparent" ? "4px" : "0",
    textShadow: shadows.length ? shadows.join(", ") : "0 1px 2px rgba(0,0,0,0.5)",
    fontWeight: "bold",
  };
}