Skip to content

皮肤配置详解

Kyle Bing edited this page Dec 1, 2020 · 3 revisions

Rime 鼠须管 皮肤配置详解

该文章主要介绍的是 鼠须管 皮肤配置信息,for macOSWindows 应该是不适用

一、皮肤配置如何调用和编写

注意: 写的时候一定要注意缩进, yaml 就是靠缩进来区别层级的

patch:
  style:
    color_scheme: maple_roseo   # 这里写皮肤名,就是下面指定的名字:比如这里就是 maple_magenta

  preset_color_schemes:
    # 皮肤一
    maple_roseo:                # 这里的名字可以随意定义,但一定不要忘了跟上面的 color_schema 对应
      name: 玫枫 / Roseo Maple
      author: "KyleBing <https://kylebing.cn>"
      alpha: 1.0
      border_height: 5
    
    # 皮肤二
    maple_second:                  # 你可以定义多个皮肤,想用哪一个,就在上面 color_schema 中写哪个名字
      name: 玫枫2 / Roseo Maple Second
      author: "KyleBing <https://kylebing.cn>"

二、具体的配置参数

博客中的缩进可能会有问题,复制的时候一定要自己进行调整

查看鼠须管源码,可以看到里面具体的皮肤参数有哪些 594行往后: https://github.com/rime/squirrel/SquirrelPanel.m

name: 玫枫 / Roseo Maple
  author: "KyleBing <https://kylebing.cn>"
  alpha: 1.0                                # 候选窗口透明度:符点型数据,小数点形式,不然出错无法正常显示皮肤
  border_height: 5                          # 边距 - 面板上下
  border_width: 5                           # 边距 - 面板左右地
  border_color: 0xDAE0DA                    # 颜色 - 边框
  back_color: 0xF4F4F6                      # 颜色 - 面板背景
  label_color: 0xaaaaaa                     # 颜色 - 候选序号
  # font_face: PingFang SC                    # 字体 - 候选文字
  font_point: 18                            # 字体大小 - 候选
  # label_font_face: Arial                    # 字体 - 候选数字
  label_font_point: 18                      # 字体大小 - 候选序号
  corner_radius: 5                          # 候选框圆角大小

  # %c 是候选序号 %@ 是候选词
  candidate_format: "%c %@ "               # 候选词格式,后面多个空格是为了增加候选词之间的距离

  horizontal: true                         # 是否横向 true 或 false
  line_spacing: 5                          # horizontal 为 false 时,上下候选的间隔大小

  hilited_corner_radius: 5                  # 圆角 - 首选候选词
  hilited_candidate_text_color: 0x4F11FA    # 颜色 - 首选候选词 - 文字
  hilited_candidate_back_color: 0xEDEDF9    # 颜色 - 首选候选词 - 背景  8位的前两位是颜色透明度,00就是透明,FF就是不透明
  hilited_candidate_label_color: 0x884F11FA # 颜色 - 首选候选词 - 序号
  hilited_comment_text_color: 0xF19C38      # 颜色 - 首选候选词 - 提示编码
  candidate_text_color: 0x222222            # 颜色 - 其它候选词 - 文字
  comment_text_color: 0x5AC461              # 颜色 - 其它候选词 - 提示编码

  inline_preedit: true                      # 输入的编码是否直接写入到输入框中,如果为 false,未上屏的编码就会写在候选框中
  spacing: 5                                # 当 inline_preedit 为 false 时,编码会出现在候选面板中,该值控制编码与候选词之间的距离
  # inline_preedit 为 false 时
  hilited_text_color: 0x8E8E93              # 颜色 - 输入中 - 编码
  hilited_back_color: 0xEFEFF4              # 颜色 - 输入中 - 背景

三、分开来慢慢说

1、关于颜色

我们平常一般用到的颜色都是 RGB 顺序的,如 D1635D 就是 red: D1 | green: 63 | blue: 5D

而这里面用到的颜色可以有两种表达方式: 一种是带透明度的 ABGRA 代码透明度,范围也是从 00 - FF00 是透明 FF 是不透明 另一种是 BGR

那么上面这个颜色在这里面就可以写成 0x5D63D1 0xFF5D63D1

2、关于字体

上面配置中的 label_font_face font_face 都可以自定义字体,只要是你电脑中存在的字体都可以,名字不要写错了。 一般字体不需要指定,指定后的字体可能会出现候选框被拉伸成过高的情况,因为不同字体的纵向高度不同,默认字体适配最好。

font-face