This is a migrated thread and some comments may be shown as answers.

How can I make grid rows more compact?

1 Answer 429 Views
GridView
This is a migrated thread and some comments may be shown as answers.
ChrisM
Top achievements
Rank 1
ChrisM asked on 11 Jul 2011, 10:02 AM
Hi, I'm looking for a way to remove excess height in GridView rows. I need to display a lot of rows in as small a vertical space as possible, so ideally, I'd like to adjust the padding that seems to be present in the grid rows (or perhaps it's actually applied in the grid cells; I couldn't be sure when I ran Snoop over the GridView control). This image shows the areas I'd like to reduce, in red. I have attached styles to the GridViewCell and GridViewRow, and set the Margin and Padding to be 0, but to no avail. As I mentioned, I tried to use Snoop to determine which control was applying extra padding to the rows, but couldn't locate it. It seems like a default. I'd like to avoid explicitly setting a height for each row, but that doesn't seem to work anyway (setting the MinHeight and Height to something like 12 causes the row to be 12px high, but the content inside is cut off at the bottom, not vertically centred in the row. And setting VerticalContentAlignment on the row style doesn't work, either).

So, any help with this issue would be much appreciated.

1 Answer, 1 is accepted

Sort by
0
Vanya Pavlova
Telerik team
answered on 11 Jul 2011, 02:04 PM
Hi Chrism,

 
Indeed the recommended approach to reduce the Margin a GridViewCell is by predefining simple proeprties such as  Padding, VerticalContentAlignment, HorizontalContentAlignment, Width, Height etc... You may also reduce the RadGridView's RowHeight and the ColumnWidth of the corresponding control in order to achieve the desired result, please refer to the xaml below:

<Window.Resources>
    <Style TargetType="telerik:GridViewCell">
        <Setter Property="Padding" Value="0"/>
        <Setter Property="FontSize" Value="11"/>
        <Setter Property="Width" Value="13"/>
        <Setter Property="Height" Value="13"/>
        <Setter Property="VerticalContentAlignment" Value="Stretch"/>
        <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
         
        </Style>
         
    </Window.Resources>
    <Grid x:Name="LayoutRoot" DataContext="{Binding Source={StaticResource SampleDataSource}}">
        <telerik:RadGridView IsFilteringAllowed="False"  ColumnWidth="13"  RowHeight="13"  ItemsSource="{Binding Collection}"/>
     
    </Grid>


This will help you to make the cells more compact based on your custom needs. 
Hope this helps!

Regards,
Vanya Pavlova
the Telerik team

Register for the Q2 2011 What's New Webinar Week. Mark your calendar for the week starting July 18th and book your seat for a walk through of all the exciting stuff we will ship with the new release!

Tags
GridView
Asked by
ChrisM
Top achievements
Rank 1
Answers by
Vanya Pavlova
Telerik team
Share this question
or