In case there are more columns inside the DataGrid, a horizontal scrollbar appears when a user swipes left. However, sometimes it' not clear there are more columns further on the left. For example, when you define a column's width with a big value or when the number of first 5 columns fit perfectly with a device's width totally by coincidence. In those cases, it'll be helpful to display horizontal scrollbar by default so the user knows there're more information on the left. (Very similar to a vertical scrollbar)
If you use a TrueType font for the DataGrid column's OptionsButtonFontFamily, it is not respected and falls back to a default OS font.
The only workaround at this time is to create a custom column HeaderTemplate with a custom options button and hide the default options button.
<dataGrid:RadDataGrid x:Name="dataGrid" ...>
<dataGrid:RadDataGrid.Columns>
<dataGrid:DataGridTextColumn x:Name="productNameColumn" PropertyName="ProductName">
<dataGrid:DataGridTextColumn.HeaderContentTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Label Text="Name" TextColor="Black"/>
<Label FontFamily="MyCustomFont.ttf#MyCustomFont"
Text=""
TextColor="Orange" HorizontalOptions="End" HorizontalTextAlignment="End" Grid.Column="1">
<Label.GestureRecognizers>
<TapGestureRecognizer Tapped="TapGestureRecognizer_Tapped"/>
</Label.GestureRecognizers>
</Label>
</Grid>
</DataTemplate>
</dataGrid:DataGridTextColumn.HeaderContentTemplate>
<dataGrid:DataGridTextColumn.HeaderStyle>
<dataGrid:DataGridColumnHeaderStyle OptionsButtonFontSize="0" FilterIndicatorFontSize="0"/>
</dataGrid:DataGridTextColumn.HeaderStyle>
</dataGrid:DataGridTextColumn>
</dataGrid:RadDataGrid.Columns>
</dataGrid:RadDataGrid>
In the code-behind, we use reflection to access the column's command context and invoke the options menu via DataGrid command service.
public partial class YourPage : ContentPage
{
private readonly MethodInfo generateOptionsTapContextMethodInfo;
public YourPage()
{
InitializeComponent();
this.generateOptionsTapContextMethodInfo = this.dataGrid.GetType().GetMethod(
"GenerateFilteringCommandContext",
BindingFlags.NonPublic | BindingFlags.Instance);
}
private void TapGestureRecognizer_Tapped(object sender, EventArgs e)
{
if (this.generateOptionsTapContextMethodInfo != null)
{
// Get a reference to the column, this is needed to invoke a command
var context = this.generateOptionsTapContextMethodInfo.Invoke(
this.dataGrid,
new object[] { this.productNameColumn });
// Invoke the command service that opens the options button
this.dataGrid.CommandService.ExecuteDefaultCommand(
Telerik.XamarinForms.DataGrid.Commands.DataGridCommandId.OptionsTap,
context);
}
}
}
<Style TargetType="telerikGrid:DataGridColumn">
<Setter Property="HeaderStyle">
<telerikGrid:DataGridColumnHeaderStyle TextFontSize="11" TextFontAttributes="Bold" BorderThickness="1" BorderColor="LightGray"/>
</Setter>
<Setter Property="CellContentStyle">
<telerikGrid:DataGridTextCellStyle FontSize="10"/>
</Setter>
</Style>
When you edit a value of a certain item of the DataGrid and keyboard is displayed, while the focus is still in the input and the row is scrolled away, the keyboard will stay open on Android.
In addition, if you return back to the edited cell, the row will display as if it were on focus, the cell shows the editor underline, the keyboard is still open, but there will be no focus. You will be required to click on the cell to get focus again.
Lastly, only on Android 5.1, if the edited value is a number, when you scroll the cell out of view, the keyboard changes from the numerical to alphanumerical (default).
You can reproduce this by changing input language to any region that uses a comma decimal separator (e.g. Duetsch). The comma is ignored, ultimately corrupting the data
If you define a PropertyGroupDescriptor in XAML or in page constructor and the PropertyName is set to a nested property, the grouping is not applied.
Grouping by a nested property works correctly when called from the Filtering UI or on a button click action.
I have designed datagrid like weekly signin details
But i required datagrid with sub header like ,
Please provide better solution to design for sub header with main header