Skip to main content
All docs
V25.1
  • TableProperties.Borders Property

    Specifies the table’s border settings.

    Namespace: DevExpress.Blazor.RichEdit

    Assembly: DevExpress.Blazor.RichEdit.v25.1.dll

    NuGet Package: DevExpress.Blazor.RichEdit

    Declaration

    public TableBorders Borders { get; set; }

    Property Value

    Type Description
    TableBorders

    An object that contains settings of table borders.

    Remarks

    The Rich Text Editor component allows you to specify border settings for the following document elements:

    Table
    The Table.Borders property allows you to access table borders and obtain their settings. Pass a TableProperties object to the Table.ChangePropertiesAsync method to customize table borders.
    Table Cell
    The TableCell.Borders property allows you to access table cell borders and obtain their settings. Pass a TableCellProperties object to the TableCell.ChangePropertiesAsync method to customize cell borders.

    Note

    Cell border settings take priority over table border settings.

    Customize All Borders

    Assign a TableBorders instance to the Borders property to customize all table borders simultaneously. The following code example hides all borders in the table:

    <DxRichEdit @ref="richEdit" />
    
    @code {
        DxRichEdit richEdit;
        protected override async Task OnAfterRenderAsync(bool firstRender) {
            if (firstRender)
                try {
                    await InitializeDocument();
                }
                catch (TaskCanceledException) { }
            await base.OnAfterRenderAsync(firstRender);
        }
    
        async Task InitializeDocument() {
          /* Surround the code that contains an asynchronous operation with a try-catch block to handle
          the OperationCanceledException. This exception is thrown when an asynchronous operation is canceled. */
            try {
                var columnCount = 4;
                var rowCount = 5;
                richEdit.DocumentAPI.BeginUpdate();
                // Creates a table
                Table myTable = await richEdit.DocumentAPI.Tables.CreateAsync(0, columnCount, rowCount);
                for (int i = rowCount-1; i >= 0 ; i--)
                    for (int j = columnCount-1; j >=0 ; j--) {
                        var cellPosition = myTable.Rows[i].Cells[j].Interval.Start;
                        await richEdit.DocumentAPI.AddTextAsync(cellPosition, "sample text");
                    }
                // Customizes the table
                myTable = await richEdit.DocumentAPI.Tables.GetAsync(0);
                await myTable.ChangePropertiesAsync(properties => {
                    properties.Borders = new TableBorders(BorderLineStyle.Dashed,
                                                          System.Drawing.Color.Black, 20);
                    properties.Width = new TableWidth(TableWidthType.Percent, 100);
                });
                richEdit.DocumentAPI.EndUpdate();
            }
            catch (OperationCanceledException e) {
                Console.WriteLine($"{nameof(OperationCanceledException)} thrown with message: {e.Message}");
            }
        }
    }
    

    Customize a Border

    Use properties of the TableBorders class to access a table border and customize its settings. The following code example customizes all table borders separately:

    Customize Table Borders

    <DxRichEdit @ref="richEdit" />
    
    @code {
        DxRichEdit richEdit;
        protected override async Task OnAfterRenderAsync(bool firstRender) {
            if (firstRender)
                try {
                    await InitializeDocument();
                }
                catch (TaskCanceledException) { }
            await base.OnAfterRenderAsync(firstRender);
        }
    
        async Task InitializeDocument() {
        /* Surround the code that contains an asynchronous operation with a try-catch block to handle
        the OperationCanceledException. This exception is thrown when an asynchronous operation is canceled. */
            try {
                var columnCount = 4;
                var rowCount = 5;
                richEdit.DocumentAPI.BeginUpdate();
                // Creates a table
                Table myTable = await richEdit.DocumentAPI.Tables.CreateAsync(0, columnCount, rowCount);
                for (int i = rowCount-1; i >= 0 ; i--)
                    for (int j = columnCount-1; j >=0 ; j--) {
                        var cellPosition = myTable.Rows[i].Cells[j].Interval.Start;
                        await richEdit.DocumentAPI.AddTextAsync(cellPosition, "sample text");
                    }
                // Customizes the table
                TableBorder outerBorder = new TableBorder(BorderLineStyle.Dashed,
                                                          System.Drawing.Color.DarkBlue, 50);
                TableBorder innerBorder = new TableBorder(BorderLineStyle.None,
                                                          System.Drawing.Color.Black, 20);
                myTable = await richEdit.DocumentAPI.Tables.GetAsync(0);
                await myTable.ChangePropertiesAsync(properties => {
                    properties.Borders.Bottom = outerBorder;
                    properties.Borders.Top = outerBorder;
                    properties.Borders.Left = outerBorder;
                    properties.Borders.Right = outerBorder;
                    properties.Borders.InsideHorizontal = innerBorder;
                    properties.Borders.InsideVertical = innerBorder;
                    properties.Width = new TableWidth(TableWidthType.Percent, 100);
                });
                richEdit.DocumentAPI.EndUpdate();
            }
            catch (OperationCanceledException e) {
                Console.WriteLine($"{nameof(OperationCanceledException)} thrown with message: {e.Message}");
            }
        }
    }
    
    See Also