Change FontSize

[Vince]

Hi,

Do you have a code sample how to change the FontSize for a specific row?

[Sivaraman Sivagurunathan]

  

Hi Vince, 

 

Thanks for using Syncfusion Support. 

 

We have checked your query.  

 

We have checked your query. You can customize the font size for the particular row.   

Your requirement can be achieved by writing a custom renderer class and overriding the OnLayout method. 

  

Refer the below KB link for more details.  

                  

KB Link: https://www.syncfusion.com/kb/6063/how-to-customize-the-foreground-color-for-cells-in-a-column-based-on-the-cell-content 

 

The below code illustrates to add or remove the custom render.  

MainActivity  

private SfDataGrid sfGrid; 

 

protected override void OnCreate (Bundle bundle) 

{ 

            base.OnCreate (bundle); 

            sfGrid = new SfDataGrid (BaseContext); 

    sfGrid.ColumnSizer = ColumnSizer.Auto; 

    sfGrid.CellRenderers.Remove("TextView"); 

    sfGrid.CellRenderers.Add("TextView", new CustomGridCell()); 

    sfGrid.ItemsSource = (new OrderInfoRepository ().OrderInfoCollection); 

    sfGrid.AutoGenerateColumns = true; 

    sfGrid.AutoGeneratingColumn += SfGrid_AutoGeneratingColumn; 

    SetContentView(sfGrid); 

} 

private void SfGrid_AutoGeneratingColumn(object sender, AutoGeneratingColumnEventArgs e) 

{ 

    e.Column.LoadUIView = true; 

} 

 

 

public class CustomGridCell : GridCellTextViewRenderer 

{ 

    public CustomGridCell() 

    { 

 

    } 

    protected override void OnLayout(RowColumnIndex rowColumnIndex, View view, int left, int top, int right, int bottom) 

    { 

        base.OnLayout(rowColumnIndex, view, left, top, right, bottom); 

        var gridCell = view as GridCell; 

        var dataColumn = gridCell.DataColumn; 

        var rowData = dataColumn.RowData as OrderInfo; 

 

        if (rowData.OrderID > 100 && rowData.CustomerID == "Tim Adams") 

        { 

            TextView textView = gridCell.GetChildAt(0) as TextView; 

            textView.TextSize = 20; //Device dependent pixels  

        } 

    } 

} 

 

We have prepared a sample based on your requirement and you can download the same from below link.  

 

Sample link: http://www.syncfusion.com/downloads/support/directtrac/135442/ze/GettingStarted_(2)1349556356 

 

Regards, 

Sivaraman 

[Vince]

Thanks Sivaraman, it's working when I use your datamodel.

I use a DataTable instead of a datamodel class. How do I adjust the sample so that it works with a datatable?

[Shivagurunathan Kamalakannan]

Hi Vince, 

 

Your requirement “changing the font size for a specific row ”in a datatable can be achieved in SfDataGrid. By writing a custom renderer(GridCellTextViewRenderer) class and by overriding OnInitializeDisplayView required row’s font size can be customized. 

 

Refer the below code for more details 

 

 

public class MainActivity : Activity 

{ 

   // Set our view from the "main" layout resource 

    private SfDataGrid sfGrid; 

    private ViewModel_DT viewModel; 

    protected override void OnCreate(Bundle bundle) 

    { 

        base.OnCreate(bundle); 

 

        sfGrid = new SfDataGrid(this); 

        viewModel = new ViewModel_DT(); 

        sfGrid.AutoGenerateColumns = false; 

        sfGrid.ItemsSource = viewModel.Records; 

        sfGrid.CellRenderers.Remove("TextView"); 

        sfGrid.CellRenderers.Add("TextView", new GridCellTextViewRendererExt()); 

 

        GridTextColumn column1 = new GridTextColumn() { MappingName = "Column1", LoadUIView=true }; 

        GridTextColumn column2 = new GridTextColumn() { MappingName = "Column2", LoadUIView=true }; 

        GridTextColumn column3 = new GridTextColumn() { MappingName = "Column3", LoadUIView=true }; 

        GridTextColumn column4 = new GridTextColumn() { MappingName = "Column4", LoadUIView=true }; 

        GridTextColumn column5 = new GridTextColumn() { MappingName = "Column5", LoadUIView=true }; 

        GridTextColumn column6 = new GridTextColumn() { MappingName = "Column6", LoadUIView=true }; 

        GridTextColumn column7 = new GridTextColumn() { MappingName = "Column7", LoadUIView=true }; 

        sfGrid.Columns.Add(column1); 

        sfGrid.Columns.Add(column2); 

        sfGrid.Columns.Add(column3); 

        sfGrid.Columns.Add(column4); 

        sfGrid.Columns.Add(column5); 

        sfGrid.Columns.Add(column6); 

        sfGrid.Columns.Add(column7); 

 

        SetContentView(sfGrid); 

    } 

} 

 

public class GridCellTextViewRendererExt:GridCellTextViewRenderer 

{ 

    public GridCellTextViewRendererExt() 

    { 

 

    } 

    public override void OnInitializeDisplayView(DataColumnBase dataColumn, TextView view) 

{ 

    base.OnInitializeDisplayView(dataColumn, view); 

    var rowData = dataColumn.RowData as System.Data.DataRowView; 

    if (rowData != null) 

    { 

        if ((string)rowData.Row.ItemArray[1] == "Sean") 

        { 

            view.TextSize = 20; 

        } 

    } 

} 

} 

 

 

We have prepared a sample based on your requirement and you can download the same from the below link. 

Sample Link: http://www.syncfusion.com/downloads/support/directtrac/general/ze/DataTableSample987275355 

 

Regards, 

Shivagurunathan. K 

[Vince]

Hi Shivagurunathan,

It works. Thanks a lot!

I added also some code to change the TextColor and BackgroundColor of the TextView view. 

if (rowData != null) 

    { 

        if ((string)rowData.Row.ItemArray[1] == "Sean") 

        { 

            view.TextSize = 20; 

            view.SetTextColor(Color.White);

            view.SetBackgroundColor(Color.ParseColor("#FF778898"));

         } 

    } 

Unfortunetly, it does not work. 

Do you have a sample for changing the TextSize, TextColor and BackgroundColor?

[Shivagurunathan Kamalakannan]

Hi Vince, 

Thanks for contacting Syncfusion Support. 

We have checked your query. We could not able to reproduce the issue on our side. It would be helpful to us if you could provide any of the following to resolve the issue. 

• What are the settings that are given to SfDataGrid and its parent?
• Could you please modify the given sample to reproduce the issue in our side so that we can help you faster?

We have prepared a sample based on your requirement and you can download the same from the below link. 

Sample link: http://www.syncfusion.com/downloads/support/directtrac/general/ze/DataTableSample1856543159 

  

Regards, 

Shivagurunathan. K 

[Vince]

Hi Shivagurunathan,

I followed your latest sample and it work now. Thanks!

[Shivagurunathan Kamalakannan]

Hi Vince,  

 

Thanks for your update. Please let us know if you require any further assistance. 

 

Regards, 

Shivagurunathan. K 

[Vince]

Hi Shivagurunathan,

There occurs to be a problem with your latest example. In my app the datagrid appearance is chainged a lot using class GridCellTextViewRendererExt. This goes all well for the first time the datagrid is build up on the screen.

The problem that I am facing now is a scrolling issue. When scrolling the datagrid on the screen class GridCellTextViewRendererExt is triggerd again when reaching the bottom or the top. This results in a messy rendering of the datagrid due to class GridCellTextViewRendererExt.

Is there a way to prevent triggering class GridCellTextViewRendererExt when scrolling the datagrid on the screen?

[Shivagurunathan Kamalakannan]

Hi  Vince, 

  

We have checked your query. The messing of background color for the required row has been reproduced and your requirement can be achieved by setting the else part of the case.  

 

The OnInitializeDisplayView is triggered since the cells are virtualized. If you need not to trigger the OnInitializeDisplayView, then the conditions given will not be checked. 

 

Refer the below code for more details. 

 

 

public override void OnInitializeDisplayView(DataColumnBase dataColumn, TextView view) 

{ 

    base.OnInitializeDisplayView(dataColumn, view); 

    var rowData = dataColumn.RowData as System.Data.DataRowView; 

    if (rowData != null) 

    { 

        if (rowData.Row.ItemArray[1].ToString() == "Sean") 

        { 

            view.TextSize = 20; 

            (view.Parent as View).SetBackgroundColor(Color.Cyan); 

            view.SetTextColor(Color.White); 

        } 

 

        else 

 

        { 

            (view.Parent as View).SetBackgroundColor(Color.Transparent); 

        } 

    } 

} 

 

 

We have prepared a sample based on your requirement and you can download the same from the below link.  

Sample Link: http://www.syncfusion.com/downloads/support/directtrac/general/ze/DataTableSample-1676767757 

 

Regards,  

Shivagurunathan. K 

 

[Vince]

Hi Shivagurunathan,

That is no solution for my app because all the rows are already adjusted in the method OnInitializeDisplayView. Here is my code which I use instead of your IF ELSE statement: 

                    switch ((string)rowData.Row.ItemArray[0])

                    {

                        case "PERSON":

                        case "PARTNER":

                            {

                                if (config.Orientation == Android.Content.Res.Orientation.Portrait)

                                {

                                    view.TextSize = 9;

                                    view.SetSingleLine(true);

                                }

                                view.SetTypeface(view.Typeface, TypefaceStyle.Bold);

                                view.SetTextColor(General.GetAndroidGraphicsColor(Context, Resource.Color.LightGreen));

                                (view.Parent as View).SetBackgroundColor(General.GetAndroidGraphicsColor(Context, Resource.Color.DarkGray));

                                view.SetHorizontallyScrolling(false); //zonder deze toevoeging verdwijnt de tekst in een cell soms

                                break;

                            }

                        case "TAX WORK:":

                        case "TAX SAVINGS:":

                        case "INCOME TAX:":

                            {

                                if (config.Orientation == Android.Content.Res.Orientation.Portrait)

                                {

                                    view.TextSize = 9;

                                    view.SetSingleLine(true);

                                }

                                view.SetTypeface(view.Typeface, TypefaceStyle.Bold);

                                (view.Parent as View).SetBackgroundColor(General.GetAndroidGraphicsColor(Context, Resource.Color.LighterGray));

                                view.SetHorizontallyScrolling(false);

                                break;

                            }

                        default:

                            {

                                view.SetTextColor(General.GetAndroidGraphicsColor(Context, Resource.Color.DarkerGray));

                                view.SetHorizontallyScrolling(false);

                                break;

                            }

                    }

Is there a way to avoid triggering class GridCellTextViewRendererExt when scrolling the datagrid on the screen?

[Vince]

Hi 

I changed the default part of my code by adding code "(view.Parent as View).SetBackgroundColor(Color.White);" as you suggested. It worked. Thanks a lot!

                      default:

                            {

                                view.SetTextColor(General.GetAndroidGraphicsColor(Context, Resource.Color.DarkerGray));

                                (view.Parent as View).SetBackgroundColor(Color.White);

                                view.SetHorizontallyScrolling(false);

                                break;

                            }

[Shivagurunathan Kamalakannan]

Hi Vince,  

 

Thanks for your update. Please let us know if you require any further assistance. 

 

Regards, 

Shivagurunathan. K