How set Format for DataGridDateColumn and DataGridNumericalColumn in UI for Xamarin

This is a migrated thread and some comments may be shown as answers.

How set Format for DataGridDateColumn and DataGridNumericalColumn

8 Answers 111 Views

DataGrid

This is a migrated thread and some comments may be shown as answers.

8 Answers, 1 is accepted

Accepted

answered on 02 May 2018, 10:23 PM

Hi,

You can set string/content formats using the CellContentFormat property of the Column, see the TextColumn article and review the available properties. You'll find similar documentation for the other column types.

As for the Selection styling, use the SelectionStyle property of the DataGrid:

<dataGrid:RadDataGrid.SelectionStyle>

<dataGrid:DataGridBorderStyle BackgroundColor="" BorderColor="" BorderThickness=""/>

</dataGrid:RadDataGrid.SelectionStyle>

Take a look at the SDKBrowser example application for more implementations of DataGrid features.

Regards,
Lance | Tech Support Engineer, Sr.
Progress Telerik

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items

Accepted

answered on 03 May 2018, 03:59 PM

Hi Massimiliano,

It's not a special format, you can use the same XAML string format style you'd normally use. If you're not familiar with .NET string format or XAML syntax, you can read about it in the Microsoft documentation or search How to use string format in XAML.

For example here's Currency with no decimal places:

CellContentFormat="{}{0:C0}"

For your second issue about the GridLinesVisibility, I'm not sure exactly what you mean by "in the header but not the source code". Please open a support ticket and share the code you're using along with a screenshot of what you're seeing so that we may investigate that DataGrid implementation directly.

Regards,
Lance | Tech Support Engineer, Sr.
Progress Telerik

answered on 03 May 2018, 07:56 PM

Hello Massimiliano,

Thank you for taking a photo of the DataGrid at runtime, his is indeed not the expected behavior of the DataGrid.

In order for us to help you get the this resolved, open a support ticket using this link and attach all the code files for that view (you can attach a ZIP file to a support ticket).

Once I (or my colleagues) see your ticket we'll attempt to replicate it on our side using your code. We'll then be able to better determine what might be causing it and consider potential solutions.

Regards,
Lance | Tech Support Engineer, Sr.
Progress Telerik

answered on 09 May 2018, 02:06 PM

Hello,

Although you can pass a value to CellContentFormat, the actual format value isn't a feature of the DataGrid or Telerik UI for Xamarin, but rather a .NET feature. You can use any approach that work in .NET Core for the string format.

For this type of format, you can't use a traditional XAML syntax. You can however use a DataGridTemplateColumn and use a value converter to get a custom result. I wrote a small example,

NOTE: since my PC's Culture uses the "-$ " format by default, I switched to using parenthesis in my demo. Here's a screenshot at run-time:

Before getting started, be sure to look at the list of values in the table under the Remarks section in the Microsoft Documentation you linked to. You'll see a list of values:

I used 15, you can choose the one that you want to use instead.

internal class GpdConverter : IValueConverter

{

public object Convert(object value, Type targetType, object parameter, CultureInfo culture)

{

if (value is double number)

{

// See the table of Values under the Remarks section for the code number (this example uses "15")

// https://docs.microsoft.com/en-us/dotnet/api/system.globalization.numberformatinfo.currencynegativepattern?view=netcore-2.0#remarks

return $"{number.ToString("C", culture), 15}";

}

return value;

}

public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)

{

throw new NotImplementedException();

}

<ContentPage ...>

<ContentPage.Resources>

<ResourceDictionary>

<portable:GpdConverter x:Key="GpdConverter" />

</ResourceDictionary>

</ContentPage.Resources>

<telerikDataGrid:RadDataGrid x:Name="dataGrid"

AutoGenerateColumns="False">

<telerikDataGrid:RadDataGrid.Columns>

<telerikDataGrid:DataGridTemplateColumn HeaderText="Template Column">

<telerikDataGrid:DataGridTemplateColumn.CellContentTemplate>

<DataTemplate>

<Label Text="{Binding Gdp, Converter={StaticResource GpdConverter}}"

Margin="0, 5, 0, 5"

HorizontalOptions="Center"

VerticalTextAlignment="Center"/>

</DataTemplate>

</telerikDataGrid:DataGridTemplateColumn.CellContentTemplate>

</telerikDataGrid:DataGridTemplateColumn>

</telerikDataGrid:RadDataGrid.Columns>

</telerikDataGrid:RadDataGrid>

</ContentPage>

public partial class StartPage : ContentPage

{

public StartPage()

{

InitializeComponent();

dataGrid.ItemsSource = new ObservableCollection<CountryProva>

{

new CountryProva("Mozambique", 24692000, -101.34),

new CountryProva("Paraguay", 6725000, -65.25),

new CountryProva("Turkmenistan", 5663000, 58.78),

new CountryProva("Mongolia", 3027000, -65.25),

new CountryProva("Japan", 127000000, -478),

new CountryProva("Bulgaria", 7128000, -101.34),

new CountryProva("Chad", 14450000, -101.34),

new CountryProva("Netherlands", 17020000, -101.34)

};

}

public class CountryProva

{

public CountryProva(string name, double population, double gdp)

{

Name = name;

Population = population;

Gdp = gdp;

}

public string Name { get; set; }

public double Population { get; set; }

public double Gdp { get; set; }

}

If you have any further questions or problem with this, open a support ticket and we'll investigate further.

Regards,
Lance | Tech Support Engineer, Sr.
Progress Telerik