We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
  1. Home
  2. Forum
  3. Xamarin.Forms
  4. RowSpacing and backgroundcolor doesnt work

RowSpacing and backgroundcolor doesnt work

I would like to have a space between rows, so I implemented as below with RowSpacing but it doesnt seem to be working.
Also how can I define a BackgroundColor ? If I define on Grid Swiping is not working referring to my old ticket here. If I define directly over sfgrid:SfDataGrid  as below, It has no impact at all

 <sfgrid:SfDataGrid x:Name="grid" ScrollingMode="PixelLine" AbsoluteLayout.LayoutBounds="0,0,1,1" AbsoluteLayout.LayoutFlags="All" BackgroundColor="Gray" RowSpacing="5"
               ItemsSource="{Binding WorkoutSetWeightLogs}"
             VerticalOptions="FillAndExpand" RowHeight="100"
                  AutoGenerateColumns="False"
                  AllowSorting="False"
                     IsEnabled="True"
                  ColumnSizer="Star"
                  AllowSwiping="True"
                  AllowDraggingRow="True"
                  AllowDraggingColumn="False"
                  SelectionMode="None"
                   GridTapped="dataGrid_GridTapped"
                  PropertyChanged="dataGrid_PropertyChanged"
                  SwipeEnded="dataGrid_SwipeEnded"
                 SwipeStarted="dataGrid_SwipeStarted"
        >

 <sfgrid:SfDataGrid.Columns>
          <sfgrid:GridTemplateColumn HeaderFontAttribute="Bold"
                                     HeaderText="SETS"
                                     MappingName="SetNumber">
            <sfgrid:GridTemplateColumn.HeaderCellTextSize>
              <OnIdiom Phone="12"
                       Tablet="15"
                       x:TypeArguments="x:Double" />
            </sfgrid:GridTemplateColumn.HeaderCellTextSize>
            <sfgrid:GridTemplateColumn.CellTemplate>
              <DataTemplate>           
                  <Grid>
                    <Grid.ColumnDefinitions>
                      <ColumnDefinition Width="*"></ColumnDefinition>
                      <ColumnDefinition Width="*"></ColumnDefinition>
                      <ColumnDefinition Width="*"></ColumnDefinition>
                      <!--<ColumnDefinition Width="64"></ColumnDefinition>-->
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                      <RowDefinition Height="64"></RowDefinition>
                    </Grid.RowDefinitions>
                    <!--<controls:NumberLayout NumberText="{Binding SetNumber}" Grid.Row="0" Grid.Column="0" />-->
                    <StackLayout Orientation="Vertical"   Grid.Row="0" Grid.Column="0" VerticalOptions="Center" >
                     

                    </StackLayout>

              </DataTemplate>
            </sfgrid:GridTemplateColumn.CellTemplate>
          </sfgrid:GridTemplateColumn>
        </sfgrid:SfDataGrid.Columns>
      </sfgrid:SfDataGrid >

5 Replies
AN Ashok N Syncfusion Team January 6, 2017 07:28 AM UTC

Hi Emil, 

Thanks for contacting Syncfusion support. 

Query regarding RowSpacing: 
We have checked your query and SfDataGrid.RowSpacing was not work because we are layout our SfDataGrid internally. You can achieve your requirement by  using GridTemplateColumn. We have prepared the sample by using GridTemplateColumn with RowSpacing and is available for download under the following sample link 

Query Regarding Background: 
You can achieve your requirement by writing a Style class overriding from DataGridStyle and assigning it to the SfDataGrid.GridStyle property. Please refer the below UG link for more details about DataGridStyle override 

Query regarding Swiping: 
If you have Last column is GridTemplateColumn and you have load the Control with Layout and inside DataTemplate? We request you to set the Grid.InputTransparent property as “true”. Otherwise Layout will handle the touch. 

Regards, 
Ashok 


EM Emil January 6, 2017 12:40 PM UTC

RowSpacing and Padding is not working unfortunately. I tried to run your sample app as well and you can see in the attached screenshot I dont get neither rowspacing nor any padding 



Attachment: Capture_31d4d053.7z

AN Ashok N Syncfusion Team January 9, 2017 11:18 AM UTC

Hi Emil, 

We were not able to reproduce the reported issue, Padding and RowSpacing are applied properly. For your reference we have prepared the sample with differentiate the Background Color and attached the working copy of our sample, you can download the same from 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.   
   

Regards, 
Ashok 


TA Tarisha May 6, 2018 10:42 AM UTC

Were you able to resolve the RowSpacing issue?  I am not seeing the RowSpace in my SFGridView even after setting the RowSpacing to 10.  Sample attached above does not have anything regarding RowSpacing, it has the solution for background color only.

SK Suriya Kalidoss Syncfusion Team May 7, 2018 12:20 PM UTC

Hi Tarisha, 
 
We have checked your query for “RowSpacing not working”. At present, we do not have support for the row spacing in our control since the grid does not require the spacing most often.  
However, you can work around the same by using our GridTemplateColumn and set the top and bottom padding for the views loaded in the template to achieve your requirement. 
 
In case, if your requirement is not conventionally grid specific and if you are looking for a list component with spacing between items, then you can achieve your requirement by using our SfListView control which has built-in support for the item spacing. Please refer the below code snippets. 
 
Code example 
<syncfusion:SfListView x:Name="listView" ItemSpacing="5,0,0,0" /> 
 
You can also refer the same in the UG documentation. Please refer the below UG link to achieve your requirement. 
 
Regards, 
Suriya K 


Loader.
Up arrow icon