Skip to main content
All docs
V24.1

TableCellProperties.Borders Property

Specifies the cell’s border settings.

Namespace: DevExpress.Blazor.RichEdit

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

NuGet Package: DevExpress.Blazor.RichEdit

Declaration

public TableCellBorders Borders { get; set; }

Property Value

Type Description
TableCellBorders

An object that contains settings of cell 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 TableCellBorders instance to the Borders property to customize all cell borders simultaneously. The following code example customizes borders of the first row’s cells:

<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);
            foreach (TableCell cell in myTable.Rows[0].Cells)
                await cell.ChangePropertiesAsync(properties => {
                    properties.Borders = new TableCellBorders(BorderLineStyle.Single, 
                                                              System.Drawing.Color.Blue, 25);
                });
            richEdit.DocumentAPI.EndUpdate();
        }
        catch (OperationCanceledException e) {
            Console.WriteLine($"{nameof(OperationCanceledException)} thrown with message: {e.Message}");
        }
    }
}

Customize a Border

Use properties of the TableCellBorders class to access a cell border and customize its settings. The following code example customizes the first row’s bottom border:

<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);
            foreach (TableCell cell in myTable.Rows[0].Cells) {
                await cell.ChangePropertiesAsync(properties => {
                    properties.Borders.Bottom = new TableBorder(BorderLineStyle.Single, 
                                                                System.Drawing.Color.Black, 20 );
                });
            }
            richEdit.DocumentAPI.EndUpdate();
        }
        catch (OperationCanceledException e) {
            Console.WriteLine($"{nameof(OperationCanceledException)} thrown with message: {e.Message}");
        }
    }
}
See Also