Skip to main content

DevExpress v24.2 Update — Your Feedback Matters

Our What's New in v24.2 webpage includes product-specific surveys. Your response to our survey questions will help us measure product satisfaction for features released in this major update and help us refine our plans for our next major release.

Take the survey Not interested

AreaSeriesStyle.Alpha Property

Gets or sets the transparency (alpha channel) of the filled area. This is a bindable property.

Namespace: DevExpress.Maui.Charts

Assembly: DevExpress.Maui.Charts.dll

NuGet Package: DevExpress.Maui.Charts

#Declaration

C#
public float Alpha { get; set; }

#Property Value

Type Default Description
Single -1

A value between 0 (transparent) and 1 (opaque) that specifies the area transparency.

#Remarks

Assign an AreaSeriesStyle object to the Style property of the area series. Use this object’s properties to customize the following:

Area Series Appearance

<dxc:AreaSeries MarkersVisible="true">
    <!--Series Data-->

    <dxc:AreaSeries.Style>
        <dxc:AreaSeriesStyle Stroke="#009688" StrokeThickness="3"
                             Fill="#009688" Alpha="0.4"
                             MarkerSize="10">
            <dxc:AreaSeriesStyle.MarkerStyle>
                <dxc:MarkerStyle Fill="#009688"/>
            </dxc:AreaSeriesStyle.MarkerStyle>
        </dxc:AreaSeriesStyle>
    </dxc:AreaSeries.Style>
</dxc:AreaSeries>

#Transparency Gradient

You can apply a transparency gradient to the area fill color. To do this, assign a TransparencyGradient object to the AreaSeriesStyle.FillEffect property and specify alpha channels that define how the visible area color intensity changes from the baseline to the series line. This setting has a higher priority than Alpha.

Area Series Transparency Gradient

<dxc:AreaSeries>
    <!--Series Data-->

    <dxc:AreaSeries.Style>
        <dxc:AreaSeriesStyle Fill="#009688">
            <dxc:AreaSeriesStyle.FillEffect>
                <dxc:TransparencyGradient BaselineAlpha="0.6" SeriesLineAlpha="0"/>
            </dxc:AreaSeriesStyle.FillEffect>
        </dxc:AreaSeriesStyle>
    </dxc:AreaSeries.Style>
</dxc:AreaSeries>
See Also