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

How to show chinese characters

8 Answers 283 Views
DataGrid
This is a migrated thread and some comments may be shown as answers.
Kevin
Top achievements
Rank 1
Kevin asked on 30 Nov 2017, 09:37 AM

I am just doing some test with this control. I found an issue that Grid header text can't show chinese characters correctly.

Here is my XAML.

 

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:telerikPrimitives="clr-namespace:Telerik.XamarinForms.Primitives;assembly=Telerik.XamarinForms.Primitives"
             xmlns:telerikDataControls="clr-namespace:Telerik.XamarinForms.DataControls;assembly=Telerik.XamarinForms.DataControls"
             xmlns:telerikChart="clr-namespace:Telerik.XamarinForms.Chart;assembly=Telerik.XamarinForms.Chart"
             xmlns:telerikInput="clr-namespace:Telerik.XamarinForms.Input;assembly=Telerik.XamarinForms.Input"
             xmlns:telerikGauges="clr-namespace:Telerik.XamarinForms.DataVisualization.Gauges;assembly=Telerik.XamarinForms.DataVisualization"
             xmlns:telerikDataGrid="clr-namespace:Telerik.XamarinForms.DataGrid;assembly=Telerik.XamarinForms.DataGrid"
             x:Class="TelerikXamarinApp2.Portable.StartPage">
    <StackLayout>
        <Label Text="You are ready to use all controls from UI for XamarinForms suite." HorizontalOptions="Center" VerticalOptions="Center"/>
        <telerikInput:RadMaskedInput></telerikInput:RadMaskedInput>
        <!--<telerikInput:RadCalendar></telerikInput:RadCalendar>-->
        <telerikDataGrid:RadDataGrid x:Name="DataGrid" UserEditMode="Cell" AutoGenerateColumns="False">
            <telerikDataGrid:RadDataGrid.Columns>
                <telerikDataGrid:DataGridTextColumn PropertyName="Country"
                                            HeaderText="国家">
                    <telerikDataGrid:DataGridTextColumn.CellContentStyle>
                        <telerikDataGrid:DataGridTextCellStyle TextColor="Green" 
                                                       FontSize="15" 
                                                       SelectedTextColor="Orange"  />
                    </telerikDataGrid:DataGridTextColumn.CellContentStyle>
                </telerikDataGrid:DataGridTextColumn>
                <telerikDataGrid:DataGridTextColumn PropertyName="Capital"
                                                HeaderText="Capital">
                    <telerikDataGrid:DataGridTextColumn.CellContentStyle>
                        <telerikDataGrid:DataGridTextCellStyle TextColor="Green" 
                                                           FontSize="15" 
                                                           SelectedTextColor="Orange"  />
                    </telerikDataGrid:DataGridTextColumn.CellContentStyle>
                </telerikDataGrid:DataGridTextColumn>
            </telerikDataGrid:RadDataGrid.Columns>
        </telerikDataGrid:RadDataGrid>
    </StackLayout>
</ContentPage>

Please give me some advice.

Thanks.

Kevin

 

8 Answers, 1 is accepted

Sort by
0
Stefan Nenchev
Telerik team
answered on 04 Dec 2017, 01:36 PM
Hello, Kevin,

I have managed to reproduce the behavior and logged it as a bug at our end. Here is the public item which you can follow - DataGrid: [Android][UWP]Some languages are not properly rendered by SkiaSharp elements. You can subscribe to the item in order to automatically receive notifications when some updates are available.

Basically, the issue is present in Android and UWP and not in iOS because the first two platforms we are using SkiaSharp to render the elements within the RadDataGrid. In iOS, on the other hand, we are creating native UILabels. As a workaround, you can set a template to the Header of the column instead of the HeaderText. For example:

<telerikDataGrid:DataGridTextColumn.HeaderContentTemplate>
    <DataTemplate>
        <Label Text="国家"></Label>
    </DataTemplate>
</telerikDataGrid:DataGridTextColumn.HeaderContentTemplate>

Have a great week.

Regards,
Stefan Nenchev
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
0
Petrushka
Top achievements
Rank 1
answered on 29 Mar 2019, 05:40 AM

<grid:RadDataGrid.GroupDescriptors>
    <common:PropertyGroupDescriptor PropertyName="DeptChnName"/>
</grid:RadDataGrid.GroupDescriptors>

 

The Grouping header text also cannot display chinese characters. See the attached file.

0
Stefan Nenchev
Telerik team
answered on 02 Apr 2019, 08:31 AM
Hi, Petrushka,

Indeed, this would be the case with the group headers as well. I have increased the priority of the issue at our end according to your report. In the meantime, here is what you can do in order to show the correct values:

<telerikGrid:RadDataGrid.GroupHeaderTemplate>
    <DataTemplate>
        <Label Text="{Binding Group.Key}"/>
    </DataTemplate>
</telerikGrid:RadDataGrid.GroupHeaderTemplate>

Have a great rest of the week.

Regards,
Stefan Nenchev
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
0
Petrushka
Top achievements
Rank 1
answered on 03 Apr 2019, 01:08 AM

Thanks!!!  <GroupHeaderTemplate> helps!

Another question: when RadDataGrid has more than 6 columns, scroll the grid right and left. The column headers does not display properly. How to fix it?

 

0
Stefan Nenchev
Telerik team
answered on 04 Apr 2019, 06:28 AM
Hello, Petrushka,

Can you please share more information on the issue as I was not able to reproduce it? On which platform do you observe it? What is the exact setup at your end. I have attached a sample which shows a RadDataGrid control with more than 6 columns and the undesired behavior is not reproduced. Do you use the latest version of the Telerik UI for Xamarin suite?

Regards,
Stefan Nenchev
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
0
Petrushka
Top achievements
Rank 1
answered on 09 Apr 2019, 01:39 AM

1. https://drive.google.com/open?id=1oJql7FaRcspFDrHwsZL3iICwaL5UHsDg

2. https://drive.google.com/open?id=1S70VxBlqTLWtNDbo6tPmj87t15tcqCt0

The links are video and my example project.

The column headers does not display properly when scroll the grid right and left.

0
Stefan Nenchev
Telerik team
answered on 11 Apr 2019, 01:19 PM
Hello,

Thank you for the project and the video. I was able to reproduce the behavior with it. Actually, after some further investigation, I came across the following thread where a solution to the problem is provided - https://www.telerik.com/forums/can-you-turn-off-ui-virtualization#rHyX0PVnskCX4l0Lmy7kZg. Basically, you can take the following approach in order to avoid the issue:

<telerikDataGrid:DataGridTemplateColumn HeaderText="Col1">
            <telerikDataGrid:DataGridTemplateColumn.HeaderStyle>
                <telerikDataGrid:DataGridColumnHeaderStyle BackgroundColor="{StaticResource colorBackgroundGrey}"
                                                                       BorderColor="{StaticResource colorBorder}"
                                                                       BorderThickness="1"
                                                                       OptionsButtonTextColor="Transparent" />
            </telerikDataGrid:DataGridTemplateColumn.HeaderStyle>
            <telerikDataGrid:DataGridTemplateColumn.HeaderContentTemplate>
                <DataTemplate>
                    <Label Text="{Binding HeaderText}"
                           Margin="8,8,8,8"
                           VerticalOptions="Center"
                           LineBreakMode="WordWrap"
                           WidthRequest="100"
                           TextColor="{StaticResource textColorPrimary}" />
                </DataTemplate>
            </telerikDataGrid:DataGridTemplateColumn.HeaderContentTemplate>

We have the issue logged as a bug and you can track its progress on the following link - https://feedback.telerik.com/xamarin/1366379-datagrid-columnheaders-are-inaccurately-visualized-when-headercontenttemplate-is-set-and-horizontal-scrolling-is-performed. I have increased its priority as per your report.

I hope the information provided will be useful.

Have a great rest of the week.

Regards,
Stefan Nenchev
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
0
Petrushka
Top achievements
Rank 1
answered on 12 Apr 2019, 11:16 AM

The information provided is very useful.

Binding label's text property to the HeaderText works.

Thanks!!!

Tags
DataGrid
Asked by
Kevin
Top achievements
Rank 1
Answers by
Stefan Nenchev
Telerik team
Petrushka
Top achievements
Rank 1
Share this question
or