WinUI | ComponentOne
Controls / FlexGrid / Styling and Appearance / Text
In This Topic
    Text
    In This Topic

    FlexGrid lets you customize the overall look of the text in grid, not to just increase its aesthetic value but also increases its readability.

    The FlexGrid control lets you change the font, set margin, wrap text, display trimmed text, align text and add text effects.

    The following code shows how to style the text in WinUI FlexGrid.

    C#
    Copy Code
    public sealed partial class CellAppearance : Window
    {
        public CellAppearance()
        {
            this.InitializeComponent();
            // bind flexgrid with DataSource
            var data = Customer.GetCustomerList(100);
            flexGrid1.ItemsSource = data;
            // Use CellFactory to change cell appearance
            flexGrid1.CellFactory = new MyCellFactory();
            flexGrid1.Columns[4].DataMap = new GridDataMap() { ItemsSource = Customer.GetCountries(), DisplayMemberPath = "Value", SelectedValuePath = "Key" };
    
    
            flexGrid1.Columns[2].Width = new GridLength(70);
    
            // Set currency format
            flexGrid1.Columns[2].Format = "C2";
    
            // Set number format
            flexGrid1.Columns[3].Format = "N1";
    
            //Set short date format
            flexGrid1.Columns[5].Format = "D";
    
            // Set time format
            flexGrid1.Columns[6].Format = "t";
        }
    
        public class MyCellFactory : GridCellFactory
        {
            public override void PrepareCell(GridCellType cellType, GridCellRange range, GridCellView cell, Thickness internalBorders)
            {
                if (cellType == GridCellType.Cell && range.Column == 3 && range.Row == 2)
                {
                    // Changing Cell[2,3] BackColor, ForeColor and Font and Border 
                    var cellValue = Grid[2, 3] as int?;
                    if (cellValue.HasValue)
                    {
                        cell.Background = new SolidColorBrush(Colors.Green);
                        cell.Foreground = new SolidColorBrush(Colors.Red);
                        cell.FontFamily = new FontFamily("verdana");
                        cell.FontStyle = FontStyle.Italic;
                        cell.FontSize = 18;
                        cell.BorderBrush = new SolidColorBrush(Colors.Red);
                        cell.BorderThickness = new Thickness(2, 2, 2, 2);
                    }
                }
            }
            public override void BindCellContent(GridCellType cellType, GridCellRange range, FrameworkElement cellContent)
            {
                base.BindCellContent(cellType, range, cellContent);
    
                if (range.Column == 2 && range.Row == 2)
                {
                    var label = cellContent as TextBlock;
                    if (label != null)
                    {
    
                        // Change Font
                        label.FontStyle = FontStyle.Italic;
                        label.FontSize = 18;
                        label.FontStretch = FontStretch.ExtraExpanded;
                        label.FontFamily = new FontFamily("Arial");
    
                        // Set Margin
                        label.Margin = new Thickness(10, 0, 0, 0);
    
                        // Wrap Text
                        label.TextWrapping = TextWrapping.WrapWholeWords;
    
                        // Display Trimmed Text
                        label.TextTrimming = TextTrimming.CharacterEllipsis;
    
                        // Align Text
                        label.TextAlignment = TextAlignment.Center;
    
                        // Text Effect
                        label.TextDecorations = TextDecorations.Strikethrough;
    
                    }
                }
            }
    
        }
    }