Skip to main content
All docs
V25.1
  • DxRibbonTab.Visible Property

    Specifies the tab’s visibility.

    Namespace: DevExpress.Blazor

    Assembly: DevExpress.Blazor.v25.1.dll

    NuGet Package: DevExpress.Blazor

    Declaration

    [Parameter]
    public bool Visible { get; set; }

    Property Value

    Type Description
    Boolean

    true to display the tab; otherwise, false.

    Remarks

    Use the Visible property to show or hide the tab in the Ribbon.

    The following code sample uses the Visible property to manage the visibility of contextual tabs.

    <DxRibbon>
        <DxRibbonTab Text="Picture Format" Contextual="true" Visible="@PictureFormatVisible">...</DxRibbonTab>
        <DxRibbonTab Text="Table Design" Contextual="true" Visible="@TableDesignVisible">...</DxRibbonTab>
        <DxRibbonTab Text="Table Layout" Contextual="true" Visible="@TableLayoutVisible">...</DxRibbonTab>
        <DxRibbonTab Text="Home">...</DxRibbonTab>
        <DxRibbonTab Text="Insert">...</DxRibbonTab>
        ...
    </DxRibbon>
    
    <img src="/images/picture.png" @onfocus="@pictureHasFocus" @onblur="@pictureLostFocus" width="50px" tabindex="0" />
    <img src="/images/table.png" @onfocus="@tableHasFocus" @onblur="tableLostFocus" width="50px" tabindex="0" />
    
    @code {
        bool PictureFormatVisible { get; set; } = false;
        bool TableDesignVisible { get; set; } = false;
        bool TableLayoutVisible { get; set; } = false;
    
        public void pictureHasFocus(FocusEventArgs args) {
            PictureFormatVisible = true;
        }
        public void pictureLostFocus(FocusEventArgs args) {
            PictureFormatVisible = false;
        }
        public void tableHasFocus() {
            TableDesignVisible = true;
            TableLayoutVisible = true;
        }
        public void tableLostFocus(FocusEventArgs args) {
            TableDesignVisible = false;
            TableLayoutVisible = false;
        }
    }
    

    Ribbon Contextual Tabs

    See Also