Xamarin.Forms | ComponentOne
Controls / FlexGrid / Features / Formatting Columns
In This Topic
    Formatting Columns
    In This Topic

    You can convert the raw values appearing in any column of the FlexGrid into different formats. FlexGrid supports standard .NET format strings used to display numeric values as local currency, percentages, dates, and more. Formatting only applies to display value of a cell and does not affect the underlying data.

    Formatting Numbers and Dates

    You can specify a column's format by setting its Format property to a valid string. The string should contain one or two characters from a known list of formats. The first character specifies the format (format specifier) while the second optional character specifies precision (precision specifier). For example, the following format string converts a raw value to display local currency up to 2 decimal places.

    The following code example demonstrates how to specify a column's format in C# and XAML. The example uses the sample created in the Quick start section.

    In Code

    C#
    Copy Code
    grid.Columns["OrderTotal"].Format = "N2";
    

    In XAML

    XAML
    Copy Code
    <c1:FlexGrid.Columns>
        <c1:GridColumn Binding="OrderTotal" Format="N2"/>
    </c1:FlexGrid.Columns>
    

    The following table shows all the numeric format strings that FlexGrid currently supports. Note that these format strings are not case sensitive.

    Format Specifier Name Precision Specifier Example
    "C" or "c" Currency Number of decimal digits 123.4567 (C2) à $123.46
    "D" or "d" Decimal Minimum number of digits 1234 (D6) à 001234
    "E" or "e" Exponential Number of decimal digits 1,234 (E2) à 1.23E3
    "F" or "f" Fixed Point Number of decimal digits -1234.56 (F4) à -1234.5600
    "G" or "g" General Number of significant digits 123.45 (G4) à 123.5
    "N" or "n" Number Desired number of decimal places 1234 (N1) à 1234.0
    "P" or "p" Percent Desired number of decimal places 1 (P2) à 100.00%
    "X" or "x" Hexadecimal Desired number of digits in the result 123 (X2) à 7B

    The following table shows the date/time format strings that FlexGrid currently supports.

    Format Specifier Description Example
    "d" Short date pattern

    3/31/2016

    31/3/2016 (FR}

    2016/3/31 (JP)

    "D" Long date pattern Thursday, March 31, 2016
    "f" Full date, short time pattern Thursday, March 31, 2016 12:00 AM
    "F" Full date, full time pattern Thursday, March 31, 2016 12:00:00 AM
    "g" General date, short time pattern 3/31/2016 12:00 AM
    "G" General date, long time pattern 3/31/2016 12:00:00 AM
    "M" or "m" Month, day pattern March 31
    "t" Short time pattern 12:00 AM
    "T" Long time pattern 12:00:00 AM
    "u" Universal sortable pattern 2016-03-31 12:00:00Z
    "U" Universal full pattern Thursday, March 31, 2016 12:00:00 AM
    "Y" or "y" Year, month pattern March, 2016

    Custom Date/Time Format Strings

    FlexGrid also supports custom date and time format strings that allow you to display date and time values in numerous ways. For example, the format string below converts the previous format (M/dd/yyyy) to "yyyy-MM" format.

    In Code

    C#
    Copy Code
    grid.Columns["Hired"].Format = "yyyy-MM";
    

    In XAML

    XAML
    Copy Code
    <c1:FlexGrid.Columns>
        <c1:GridColumn Binding="Hired" Format="yyyy-MM"/>
    </c1:FlexGrid.Columns>
    

    The following table lists some common format specifier for creating custom date and time strings.

    Format Specifier Description Example
    "d" Day of the month 1
    "dd" Day of the month 01
    "ddd" Abbreviated day of the week Mon
    "dddd" Full day of the week Monday
    "h" The hour using 12-hour clock 1
    "hh" The hour using 12-hour clock 01
    "H" The hour using 24-hour clock 13
    "HH" The hour using 24-hour clock 13
    "m" Minute of time 1
    "mm" Minute of time 01
    "M" Month number 1
    "MM" Month number 01
    "MMM" Abbreviated month name Mar
    "MMMM" Full month name March
    "s" Second of time 1
    "ss" Second of time 01
    "tt" The AM/PM Designator AM
    "yy" Abbreviated year 16
    "yyyy" Full year 2016
    "\" Escape character H\H à 13H
    Any other character The character is copied to the result string yyyy-MM à 2016-03

    Formatting Other Data Types

    If you need to format a column that is not numerical or date/time, refer to Custom Cells and Data Mapping topics.