Disable scrolling of sfdatagrid and set height of sfdatagrid to height of the content

[Naveen C Ramachandrappa]

Hi,

I am using sfdatagrid in my application. The number of rows in the grid can vary. I have placed sfdatagrid in a stacklayout in scrollview. So, I want to disable scrolling in sfdatagrid and set the height of sfdatagrid to the height of the content so that all the rows are shown and scrolling is not required . Basically I want to scroll only the scroll view which is the parent control but not the scroller in sfdatagrid. Parent Scroll view contains few other controls along with sfdatagrid so that the user can scroll and view. Can this be achieved

[Naveen C Ramachandrappa]

1. In addition to the below, I have an issue wrt sfdatagrid. It loads fine but when I scroll the grid horizontally left and right couple of times, the app crashes throwing the below exception. "System.OverflowException: Negating the minimum value of a twos complement number is invalid.2. I want to set a common color to the complete sfdatagrid and setting sfdatagrid's backgroundcolor is not working and rows are always appearing in white color.

[Ashok N]

Hi Naveen,  

  

Thanks for contacting Syncfusion Support.  

  

You can achieve your requirement by handling  SfDataGrid.SizeChanged event and SfDataGrid should be placed inside ContentView for customizing height. Since HeightRequest will not work in SfDataGrid because SfDataGrid derived from Grid and Grid is ignoring WidthRequest and HeightRequest inside content page, please refer the below Bugzilla link for more details regarding this. Please refer the below code snippet to achieve your requirement  

  

XAML code:  

  

<ContentView x:Name="contentView"   

             HorizontalOptions="StartAndExpand"   

             VerticalOptions="StartAndExpand"  

             WidthRequest="300" HeightRequest="400">  

    <sfgrid:SfDataGrid x:Name="dataGrid"   

            ItemsSource="{Binding OrdersInfo}"   

            AutoGenerateColumns="True"   

            AllowSorting="True"   

            SelectionMode="Single" >  

    </sfgrid:SfDataGrid>  

</ContentView>  

  

C# code:  

  

double totalRowHeight = 0;  

double totalColumnWidth = 0;  

dataGrid.SizeChanged += DataGrid_SizeChanged;  

  

private void DataGrid_SizeChanged(object sender, EventArgs e)  

{  

    if (totalRowHeight == 0 && totalColumnWidth == 0)  

    {  

        for (int i = 0; i <= this.dataGrid.View.Records.Count; i++)  

            totalRowHeight += dataGrid.RowHeight;  

  

        for (int i = 0; i < this.dataGrid.Columns.Count; i++)  

            totalColumnWidth += dataGrid.Columns[i].ActualWidth + (dataGrid.ShowRowHeader ? dataGrid.RowHeaderWidth : 0);  

        contentView.WidthRequest = Math.Min(totalColumnWidth, dataGrid.Width);  

        contentView.HeightRequest = Math.Min(totalRowHeight, dataGrid.Height);  

    }  

}  

  

Sample location: http://www.syncfusion.com/downloads/support/forum/131494/ze/XamarinForms2049610899  

  

Bugzilla link for Grid is ignoring WidthRequest and HeightRequest inside content page  

  

https://bugzilla.xamarin.com/show_bug.cgi?id=37438#c3   

 

We didn’t know how you set the Width and Height to SfDataGrid, so we cannot able to confirm reported System.OverflowException in our side. Please let me if you facing any issues with this solution? That would be more helpful for proceed further. 

  

Regards,  

Ashok  

[Naveen C Ramachandrappa]

Hi,

I have multiple questions.

1. Is it possible to customise sfdata grid to show it in the below format. The text that is masked is the table header. The intersecting points for rows and columns are cut. Is this possible.

2. I want to set a common background for the whole sfdatagrid. How to achieve this.

3. As far as the System.OverflowException is concerned, I do see it occuring once in a while when I scroll the sfdatagrid horizontally couple of times. PFB the code snippet.

xaml:

<Grid  xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="XamarinPOCPEApp.UserControls.PayoutWidget"     

  xmlns:local="clr-namespace: XamarinPOCPEApp;assembly=XamarinPOCPEApp"

  xmlns:sfgrid="clr-namespace:Syncfusion.SfDataGrid.XForms;assembly=Syncfusion.SfDataGrid.XForms">

  <Grid Margin="5,5,5,5" RowSpacing="0">

     <Grid.RowDefinitions>

      <RowDefinition Height="Auto"></RowDefinition>

      <RowDefinition Height="Auto"></RowDefinition>

  </Grid.RowDefinitions>

    

    <BoxView Color="#f2f2f2"  />

    

   <Grid Grid.Row="0">    

    <Label HorizontalTextAlignment="Center" VerticalTextAlignment="Center"  TextColor="#303030" FontSize = "16" Text="Payout Details" />

  </Grid>

  

  

  <sfgrid:SfDataGrid Grid.Row="1"    x:Name="dataGrid" AutoGenerateColumns="False" 

                            ColumnSizer="Auto" ItemsSource="{Binding OrderInfoCollection}" VerticalOptions="FillAndExpand" FrozenColumnsCount="1"  HeightRequest="100"    >

      <sfgrid:SfDataGrid.Columns >

                <sfgrid:GridTextColumn MappingName="TimeFrame" HeaderText="Time Frame" />

                <sfgrid:GridTextColumn  MappingName="YTDEarnings" HeaderText="YTD Earnings" />

                <sfgrid:GridTextColumn MappingName="Advances" HeaderText="Advances" />

                <sfgrid:GridTextColumn MappingName="Adjustments" HeaderText="Adjustments" />

                <sfgrid:GridTextColumn MappingName="PayrollPayment" HeaderText="Payroll Payment" />

            </sfgrid:SfDataGrid.Columns>

    

</sfgrid:SfDataGrid>

  </Grid>

</Grid>

Code behind:

public partial class PayoutWidget : Grid

    {

        double totalRowHeight = 0;

        public PayoutWidget()

        {

            InitializeComponent();

            dataGrid.GridLoaded += DataGrid_GridLoaded;

        }

        private void DataGrid_GridLoaded(object sender, EventArgs e)

        {

            for (int i = 0; i <= this.dataGrid.View.Records.Count; i++)

                totalRowHeight += dataGrid.RowHeight;

            dataGrid.HeightRequest = totalRowHeight;

            

        }

    }

[Ashok N]

Hi Naveen, 

Thanks for your update. 

Query regarding custom border: 

 

You can achieve your requirement by customizing GridVirtualizingCellRenderer and GridColumn. We have prepared the sample based on your requirement and attached in the below link, please check it. 

Sample link: http://www.syncfusion.com/downloads/support/directtrac/general/ze/CustomColumnInForms_(2)1844603463  

Query regarding Record Background Color: 

You can achieve your requirement by using GetRecordBackgroundColor and GetHeaderBackgroundColor override method from DataGridStyle and assigning it to the SfDataGrid.GridStyle property. Please refer the below UG link to get more details regarding SfDataGrid.GridStyle. 

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

Query regarding System.OverflowException: 

We have checked the reported System.OverflowException after scroll the SfDataGrid horizontally couple of times but we are not able to reproduce reported issue. For your reference we have attached the working copy of our sample in the below link. Could you please do revert us by modifying our sample to replicate the issue. Otherwise please share your sample, that would be more helpful for us to proceed further.            

  

Sample link: http://www.syncfusion.com/downloads/support/forum/131494/ze/XamarinForms_(2)-2090071678  

Regards, 

Ashok