Skip to main content
All docs
V25.1
  • DxFlyout.HeaderText Property

    Specifies the text displayed in the flyout window’s header.

    Namespace: DevExpress.Blazor

    Assembly: DevExpress.Blazor.v25.1.dll

    NuGet Package: DevExpress.Blazor

    Declaration

    [Parameter]
    public string HeaderText { get; set; }

    Property Value

    Type Description
    String

    The header’s text.

    Remarks

    Set the HeaderVisible property to true to show the header in the flyout window. Use the HeaderText property to specify the header’s text.

    <style>
        .header-footer-style {
            font-style: italic;
        }
    </style>
    
    <DxButton Id="targetButton" Click="() => IsOpen = !IsOpen">Show a flyout window</DxButton>
    <DxFlyout @bind-IsOpen=IsOpen PositionTarget="#targetButton" Width=400
        BodyText="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
                incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
                exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."
        HeaderVisible="true" HeaderText="Header" HeaderCssClass="header-footer-style"
        FooterVisible="true" FooterText="Footer" FooterCssClass="header-footer-style">
    </DxFlyout>
    
    @code {
        bool IsOpen { get; set; } = false;
    }
    
    See Also