如何将三位十六进制字符串转换为flutter中的颜色

Question

我想把“#0ff”这个十六进制字符串转换成Color

我已经搜索过但我只找到了长度为6位的十六进制字符串的答案

如果我喜欢这个

Color(0xFF0ff)

它什么也不显示

提前致谢！

Answer 1

Web 通过三种方式定义颜色：显式颜色名称、3 个十六进制数字或 6 个十六进制数字。

如果有 3 位数字，则应将每个数字“加倍”（作为字符，而不是值），因此 #abc 将被读作 #aabbcc。为什么？它很短，有助于选择更少的颜色（过去我们有 8 或 16 位颜色），并且屏幕可能不那么准确。

您的

#0ff

应读作

#00ffff

。

注意：这些 3 位数颜色现在被认为是已过时，请参阅 https://html.spec.whatwg.org/multipage/common-microsyntaxes.html#simple-colour，但仍在许多地方使用（例如# fff 代表白色）。

Answer 2

GC“接受”的答案在很多方面都是不正确的，事实上，他唯一正确的事情是#0ff = #00ffff。

首先，CSS 和网页内容颜色的当前标准在这里：

https://www.w3.org/TR/css-color-3/#numerical

#0ff

是一个完全合法且并未过时的颜色定义。

为网络定义 sRGB 颜色的允许形式是：

* { color: #f00; }                /* #rgb */
* { color: #ff0000; }             /* #rrggbb */
* { color: rgb(255,0,0); }        /* each value is 0-255 */
* { color: rgb(100%, 0%, 0%); }   /* each value is 0%-100% */
* { color: hsl(0, 100%, 50%); }   /* red using hsl "hue sat lightness" */
* { color: "red"; }               /* color keyword */

上面未显示：透明度或 alpha 语法。

弦理论

对于列表中的前两个，颜色值被解析为 STRING 数据类型而不是数值。

如果我喜欢这个颜色（0xFF0ff）它什么也不显示

当您

Color(0xFF0ff)

时，它是无效的并被忽略。

0x123456

是一个十六进制的数值，它等于整数值

1193046

，将其写为对CSS类型的颜色定义有效的字符串，您需要将其写为

#123456

三人为伴，六人为克隆人。或者西斯。或者什么...

在“三位数”格式中，每个十六进制值都是重复的（克隆哈哈），因此#abc 变为#aabbcc。

对于数学定义，

0xCC = 0xC * 0x10 + 0xC

所以如果我们有十六进制数字 0xABC：

0xAABBCC = 0xA * 0x110000 + 0xB * 0x1100 + 0xC * 0x11

因此，如果您正在使用数字数据类型，请使用

x = 0x123456

，但如果您要将字符串发送到其他一些API，则

x = '#123456' 

...并且还要记住，如果您需要接受

'#123456'

，那么除非你将它转换为数字，否则它将是一个字符串，在 JS 中使用

parseInt(x,base);

很容易，其中基数当然是 16。

旁注评论不同的答案：

GC 说道：

为什么？它很短，有助于选择更少的颜色（过去我们有 8 或 16 位颜色），并且屏幕可能不那么准确。

这些都不相关。 #rgb 和 #rrggbb 自 90 年代中期一开始就已成为 CSS 标准，并且 #rgb ALWAYS 扩展到 #rrggbb，无论系统功能如何，并且在 90 年代中期每通道 8 位（又名 24 位颜色）过去是常态，今天仍然如此。

此外，颜色是设计和呈现的一部分，设计应该抽象为CSS，而不是在用于内容结构的HTML中。

HTML 规范想要“简化”颜色声明的事实更多地与解析 DOM 的效率有关，而不是你提到的。颜色根本不应该在 HTML 中，它们应该在 CSS 中，我向你保证 #rgb 并不是“过时的”，它很大程度上是一个月前批准的最新 CSS 颜色标准的一部分，链接在本文开头.

“实际原因”是三位数颜色更容易使用

#fea

比

#fcecb0

更容易记住，但它们的外观几乎相同。

当您需要精确匹配 8 位 sRGB 颜色（例如图像中的颜色）时，完整的 #rrggbb 非常有用。否则，使用#rgb代替#rrggbb没有问题，并且有很多理由这样做，但这些都与位深度无关，也与仍然存在的“屏幕精度”无关用户现在可以像以前一样进行调整和校准。