How can i change opacity and color of GradientStop?

How-to Discussions
1

Hi, help me please!

How can i change alpha channel of DividerColor in GradientStop?

I want something like this:

<Rectangle ux:Class="Divider" Height="0.1">
    <float4 ux:Global="DividerColor" ux:Value="#a542db" />
    <LinearGradient StartPoint="0,0" EndPoint="1,0">
        <GradientStop Offset="0.0" Color="DividerColor" /> <!-- alpha is 0 -->
        <GradientStop Offset="0.5" Color="DividerColor" /> <!-- alpha is 1 -->
        <GradientStop Offset="1.0" Color="DividerColor" /> <!-- alpha is 0 -->
    </LinearGradient>
</Rectangle>

This is don’t work…

And GradientStop don’t have Opacity property.

        <float3 ux:Global="DividerColor" ux:Value="#a542db" />
        <!--...-->
        <GradientStop Offset="0.0" Color="DividerColor,1.0" />
        <GradientStop Offset="0.0" Color="DividerColor + 1.0" />
        <GradientStop Offset="0.0" Color="{DividerColor},1.0" />
        <GradientStop Offset="0.0" Color="float4(DividerColor,1.0)" />

Can i append float to float3 and get float4?

Or can i create custom function for ux expressions like this?

2

Fuse has extended color literals (with alpha). For example #rrggbb(aa)

So rewrite your UX like that:

<float4 ux:Global="DividerColor0" ux:Value="#a542db00" />
<float4 ux:Global="DividerColor1" ux:Value="#a542dbff" />

<Rectangle ux:Class="Divider" Height="0.1">
    <LinearGradient StartPoint="0,0" EndPoint="1,0">
        <GradientStop Offset="0.0" Color="DividerColor0"/> <!-- alpha is 0 -->
        <GradientStop Offset="0.5" Color="DividerColor1"/> <!-- alpha is 1 -->
        <GradientStop Offset="1.0" Color="DividerColor0"/> <!-- alpha is 0 -->
    </LinearGradient>
</Rectangle>
3

Hi!

Starting in Fuse 0.31.2 you should be able to do Color="DividerColor * (1,1,1,0)" to cancel out the alpha channel.

4

maxgraey, Anders Lassen,

Thanks!) The problem is solved!