Add support for ARGB colors

[robiot]

152 #142

[romaomb]

Hey @enyancc or @ferretwithaberet, any idea on when this would land? It's rather funny to see things like that when running Flutter:

[ferretwithaberet]

Hey @enyancc or @ferretwithaberet, any idea on when this would land? It's rather funny to see things like that when running Flutter:

I will check it soon when I will have time. At the moment I have exams.

[robiot]

If anyone wants an explanation of how it works: First it gets the hex without the #, gets the first 2 characters and converts it to decimal (16 radix)

parseInt("FF345678".substring(0, 2), 16)
>> 255 // Because FF is 255

Then it divides the number by 255 which is the max hex value in decimal.

parseInt("FF345678".substring(0, 2), 16) / 255
>> 0.8588235294117647 // Something like this

But that's a lot of decimals, so it rounds it to just 2 decimals.

Math.round(parseInt("DB345678".substring(0, 2), 16) * 100 / 255) / 100
0.86

The * 100 and / 100 is there so it rounds it to 2 decimals.

https://gist.github.com/lopspower/03fb1cc0ac9f32ef38f4

[ferretwithaberet]

If anyone wants an explanation of how it works: First it gets the hex without the #, gets the first 2 characters and converts it to decimal (16 radix)

parseInt("FF345678".substring(0, 2), 16)
>> 255 // Because FF is 255

Then it divides the number by 255 which is the max hex value in decimal.

parseInt("FF345678".substring(0, 2), 16) / 255
>> 0.8588235294117647 // Something like this

But that's a lot of decimals, so it rounds it to just 2 decimals.

Math.round(parseInt("DB345678".substring(0, 2), 16) * 100 / 255) / 100
0.86

The * 100 and / 100 is there so it rounds it to 2 decimals.

https://gist.github.com/lopspower/03fb1cc0ac9f32ef38f4

Doesn't it interfere with the RGBA(#RRGGBBAA) format?

[robiot]

If anyone wants an explanation of how it works: First it gets the hex without the #, gets the first 2 characters and converts it to decimal (16 radix)

parseInt("FF345678".substring(0, 2), 16)
>> 255 // Because FF is 255

Then it divides the number by 255 which is the max hex value in decimal.

parseInt("FF345678".substring(0, 2), 16) / 255
>> 0.8588235294117647 // Something like this

But that's a lot of decimals, so it rounds it to just 2 decimals.

Math.round(parseInt("DB345678".substring(0, 2), 16) * 100 / 255) / 100
0.86

The * 100 and / 100 is there so it rounds it to 2 decimals. https://gist.github.com/lopspower/03fb1cc0ac9f32ef38f4

Doesn't it interfere with the RGBA(#RRGGBBAA) format?

Yeah :(, it will not work with that. But there is no way for the extension itself to know if it is rgba or argb. :\

[ferretwithaberet]

If anyone wants an explanation of how it works: First it gets the hex without the #, gets the first 2 characters and converts it to decimal (16 radix)

parseInt("FF345678".substring(0, 2), 16)
>> 255 // Because FF is 255

Then it divides the number by 255 which is the max hex value in decimal.

parseInt("FF345678".substring(0, 2), 16) / 255
>> 0.8588235294117647 // Something like this

But that's a lot of decimals, so it rounds it to just 2 decimals.

Math.round(parseInt("DB345678".substring(0, 2), 16) * 100 / 255) / 100
0.86

The * 100 and / 100 is there so it rounds it to 2 decimals. https://gist.github.com/lopspower/03fb1cc0ac9f32ef38f4

Doesn't it interfere with the RGBA(#RRGGBBAA) format?

Yeah :(, it will not work with that. But there is no way for the extension itself to know if it is rgba or argb. :\

I want to change the extension's options for this, the user will set options per workspace and per language. This will at least make it more bearable, but again at the moment I got exams. If someone would contribute that it'd be awesome!

Also, when I will have more time available again I might rewrite this extension or start a new extension myself which will give more context to the strategy functions to allow for more granular control over what to color.

[robiot]

Even though it might not support RGBA, it adds support for ARGB which will make flutter developers happy. I think that you should merge this for now since it does not negatively affect anyone, then modify it to work with RGBA in the future. @ferretwithaberet

[ferretwithaberet]

Even though it might not support RGBA, it adds support for ARGB which will make flutter developers happy. I think that you should merge this for now since it does not negatively affect anyone, then modify it to work with RGBA in the future. @ferretwithaberet

It's not that it does not support RGBA, it replaces the RGBA support with ARGB support. I will try to add an option in the settings of the extension, per workspace, soon to let you choose what to use RGBA or ARGB. Or maybe an option to only replace it in the flutter files. This will serve as a temporary fix until it will be properly implemented. Again, if someone can do that I am more than happy to merge it, otherwise you will need to wait for me to implement it.

[robiot]

Now you can specify if you wish to use ARGB or not by setting color-highlight.useARGB to true.

[robiot]

Hey @ferretwithaberet. Could you review the code? :)

[ferretwithaberet]

LGTM! 👍🏻

[ValentinVignal]

Is it released? It seems like the latest update is 2.5.0 which was on the 13/09/2021

https://marketplace.visualstudio.com/items?itemName=naumovs.color-highlight