Skip to main content
All docs
V25.1
  • DxWindow.AllowDrag Property

    Specifies whether users can drag the Window.

    Namespace: DevExpress.Blazor

    Assembly: DevExpress.Blazor.v25.1.dll

    NuGet Package: DevExpress.Blazor

    Declaration

    [DefaultValue(true)]
    [Parameter]
    public bool AllowDrag { get; set; }

    Property Value

    Type Default Description
    Boolean true

    true to enable window dragging; otherwise, false.

    Remarks

    Set the AllowDrag property to true to allow users to drag and drop the window by its header. You can disable the AllowDragByHeaderOnly option to allow dragging by every window element – header, body, or footer.

    The following events allow you to process drag actions:

    <div class="d-flex justify-content-center p-3" @ref=@popupTarget>
        <DxButton RenderStyle="ButtonRenderStyle.Secondary" Click="@TogglePopupVisibilityAsync">@GetButtonText()</DxButton>
    </div>
    <DxWindow AllowDrag=true
              AllowDragByHeaderOnly="allowDragByHeaderOnly"
              @ref=@windowRef
              DragCompleted="OnWindowDragCompleted"
              ShowCloseButton="true"
              HeaderText="Window" BodyText="@Constants.Text"
              Width="max(25vw, 250px)"
              SizeMode="Params.SizeMode"
              @bind-Visible="windowVisible">
    </DxWindow>
    @code {
    int? positionX, positionY;
    bool windowVisible;
    bool allowDragByHeaderOnly = true;
    DxWindow windowRef;
    ElementReference popupTarget;
    async Task OnWindowDragCompleted(WindowDragCompletedEventArgs args) {
        (positionX, positionY) = (args.End.X, args.End.Y);
        await SavePositionToLocalStorageAsync(args.End);
    }
    string GetButtonText() => !windowVisible ? "SHOW A WINDOW" : "CLOSE A WINDOW";
    }
    

    Run Demo: Window - Dragging

    See Also