跳转至

tkflu.designs.control · 通用控件配色

控件通用配色(中性色 / 文本色 / 焦点环)。

数值来源

这一版的数值直接取自设计稿(Figma 导出的 Basic Input.svg), 不再是"按 Fluent 印象估的":

  • 复选框方框 / 单选框圆环的未选中描边 = rgb(0,0,0) + stroke-opacity 0.6063
  • 同一个框的填充 = rgb(0,0,0) + fill-opacity 0.0241
  • 选中填充 = rgb(0,95,184)(浅色强调色)
  • 禁用选中 = rgb(0,0,0) + 0.2169(来自 Lists & Collections.svg)

为什么要保留"颜色 + 透明度"两个字段,而不是先合成成实色

设计稿给的是半透明黑(#000000 @ 0.6),它压在任何背景上都是对的: 放在白色面板上得到 #646464,放在 #2B2B2B 的深色面板上得到 #161616。 一旦提前合成成实色,换到深色主题就全错了。所以这里成对返回, 交给绘制引擎自己去合成(圆角矩形、圆环都支持 *_opacity)。

只有 create_text 没有透明度参数(见 :data:TEXT),文字色必须提前合成。

blend(foreground, alpha, background)

把半透明的 foreground 合成到不透明的 background 上。

:param foreground: 前景色(#rgb / #rrggbb) :param alpha: 前景的不透明度,0–1 :param background: 背景色,必须不透明 :returns: 合成后的实色 #rrggbb

::

>>> blend("#000000", 0.894, "#ffffff")
'#1b1b1b'
源代码位于: tkflu\designs\control.py
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
def blend(foreground, alpha, background):
    """把半透明的 ``foreground`` 合成到不透明的 ``background`` 上。

    :param foreground: 前景色(``#rgb`` / ``#rrggbb``)
    :param alpha: 前景的不透明度,``0``–``1``
    :param background: 背景色,必须不透明
    :returns: 合成后的实色 ``#rrggbb``

    ::

        >>> blend("#000000", 0.894, "#ffffff")
        '#1b1b1b'
    """
    fg = _to_rgb(foreground)
    bg = _to_rgb(background)
    ratio = max(0.0, min(1.0, float(alpha)))
    mixed = tuple(int(round(f * ratio + b * (1.0 - ratio))) for f, b in zip(fg, bg))
    return "#{:02x}{:02x}{:02x}".format(*mixed)

paint(pair, fallback=(None, 0.0))

把 (颜色, 不透明度) 拆成绘制用的两个字段。

:param pair: (color, opacity);None 表示"这一层不画" :param fallback: pair 为空时返回什么 :returns: (color, opacity)

源代码位于: tkflu\designs\control.py
145
146
147
148
149
150
151
152
153
154
def paint(pair, fallback=(None, 0.0)):
    """把 ``(颜色, 不透明度)`` 拆成绘制用的两个字段。

    :param pair: ``(color, opacity)``;``None`` 表示"这一层不画"
    :param fallback: ``pair`` 为空时返回什么
    :returns: ``(color, opacity)``
    """
    if not pair:
        return fallback
    return pair[0], float(pair[1])