Transparet datagrid

[Carlos Frederico Silva Rodrigues]

Hi, it's possible configure a total DataGrid transparent?

I would like to see every cell in WHITE TEXTCOLOR with TRANSPARENT BACKGROUNDCOLOR.

The DataGrid is placed inside a GREEN FRAME and, even with the property <syncfusion:SfDataGrid BackgroundColor="Transparent"......./> i see DataGrid BACKGROUNDCOLOR WHITE.

Please, could you help me?

Thanks in advance.

Frederico Rodrigues

[Shivagurunathan Kamalakannan]

Hi Carlos Frederico Silva Rodrigues, 

 

Thanks for contacting Syncfusion Support, 

 

Yes, You can configure the SfDataGrid with transparent color. You can customize the record background color and the record foreground color by writing a custom style class deriving from DataGridStyle and assigning it to the SfDataGrid.GridStyle property. 

 

Override the GetRecordBackgroundColor and GetRecordForegroundColor to achieve your requirement. 

 

Refer the UG for more details. 

UG link: https://help.syncfusion.com/xamarin/sfdatagrid/styles 

 

The below code example illustrates how to achieve your requirement in SfDataGrid.  

 

 

public partial class MainPage : ContentPage 

{ 

    public MainPage() 

     { 

       InitializeComponent(); 

       dataGrid.BackgroundColor = Color.Transparant; 

       dataGrid.GridStyle = new CustomStyle(); 

     } 

} 

public class CustomStyle:DataGridStyle 

{ 

    public CustomStyle() 

     { 

 

     } 

    public override Color GetRecordBackgroundColor() 

     { 

        return Color.Transparent; 

     } 

    public override Color GetRecordForegroundColor() 

     { 

        return Color.White; 

     } 

} 

 

 

 

 

<Frame BackgroundColor="Green"> 

    <sfgrid:SfDataGrid x:Name="dataGrid" BackgroundColor="Transparent" 

                           ItemsSource="{Binding OrdersInfo}" AutoGenerateColumns="False"> 

 

        <sfgrid:SfDataGrid.Columns x:TypeArguments="syncfusion.columns"> 

        <sfgrid:GridTextColumn MappingName="OrderID" HeaderText="Order ID"/> 

        <sfgrid:GridTextColumn MappingName="CustomerID" HeaderText="Header Text"/> 

        <sfgrid:GridTextColumn MappingName="FirstName" HeaderText="First Name"/> 

        <sfgrid:GridTextColumn MappingName="LastName" HeaderText="Last Name"/> 

        <sfgrid:GridTextColumn MappingName="ShipCity" HeaderText="Ship City"/> 

        </sfgrid:SfDataGrid.Columns> 

 

    </sfgrid:SfDataGrid> 

</Frame> 

 

 

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/SfDataGridSample1687621416 

 

 

Regards, 

Shivagurunathan. K 

 

[Carlos Frederico Silva Rodrigues]

Hi, thanks.

I did it.

[Shivagurunathan Kamalakannan]

Hi Carlos Frederico Silva Rodrigues, 

 

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

 

Regards, 

Shivagurunathan. K