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

Rows Height

11 Answers 923 Views
GridView
This is a migrated thread and some comments may be shown as answers.
Andrea Marchetti
Top achievements
Rank 1
Andrea Marchetti asked on 20 May 2010, 08:54 AM
I need to create a grid with very near and very small rows.
I have succeeded in reducing the height of the rows. I don't succeed in systematizing the alignment of the content. The lines are truncated me. Can you help me?

Thanks

Code :

 <UserControl.Resources>
  <Style x:Key="GridViewRowStyle1" TargetType="{x:Type telerik:GridViewRow}">
   <Setter Property="Height" Value="15"/>
   <Setter Property="MinHeight" Value="15"/>
   <Setter Property="VerticalAlignment" Value="Top"/>
  </Style>

 </UserControl.Resources>
   ....
            <telerik:RadGridView x:Name="GridViewAnaClienti" IsReadOnly="True"  Grid.Row="2" BorderThickness="1" FontSize="9"
                    RowStyle="{StaticResource GridViewRowStyle1}" >
    <telerik:RadGridView.Columns>
                    <telerik:GridViewDataColumn Header="Codice" Width="80" DataMemberBinding="{Binding Codice}"  />
                    <telerik:GridViewDataColumn Header="Ragione Sociale" MinWidth="280" DataMemberBinding="{Binding RagioneSociale}"/>
                    <telerik:GridViewDataColumn Header="Indirizzo" MinWidth="270" DataMemberBinding="{Binding Indirizzo1}"/>
   ...
                </telerik:RadGridView.Columns>
   </telerik:RadGridView> 
   ...
 </UserControl>


attached file: example of the result

11 Answers, 1 is accepted

Sort by
0
Kalin Milanov
Telerik team
answered on 20 May 2010, 01:26 PM
Hello Andrea Marchetti,

This issue has already been addressed and is available in our latest internal build. You can update to this version and use the RowHeight property of the RadGridView to set the row height. There is no need to set styles and templates to achieve that anymore.

Regards,
Kalin Milanov
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
Sergey
Top achievements
Rank 1
answered on 13 Sep 2016, 05:52 AM
RowHeight property doesn't affect rows if ExpressionDark theme is used, and some other themes also have this issue
0
Dilyan Traykov
Telerik team
answered on 13 Sep 2016, 01:59 PM
Hello Sergey,

I'm attaching a sample project where the RowHeight property is respected in both parent and child RadGridView instances. Could you please have a look at it and let me know whether I've missed something of importance?

Regards,
Dilyan Traykov
Telerik by Progress
Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
0
Sergey
Top achievements
Rank 1
answered on 14 Sep 2016, 07:38 AM

Hi, yes, there is no issues in your sample, but I have made some modifications:

- Added dynamic theme changing (still no issues)

- Added 'lightweght' styles - to improve performance, they are described in documentation of RadGridView in "How to.." chapter.

Then I have issues after theme switching - see attached modified sample.

I found a way and fixed this issues too, but then I have a described problem with RowHeight.

P.S.:

I cannot attach zip sample, because of restrictions, so I can only attach a screenshots

0
Sergey
Top achievements
Rank 1
answered on 14 Sep 2016, 07:49 AM

Here is a description of Lightweight templates:

http://www.telerik.com/blogs/how-to-boost-radgridview-performance-for-wpf-and-silverlight-using-lightweight-templates

 

0
Dilyan Traykov
Telerik team
answered on 14 Sep 2016, 09:44 AM
Hello Sergey,

The reason you're observing this behavior is because you're basing your styles on static resources which do not get updated when you switch the themes. This can be overcome by adding the following lines to your ApplyTheme method right after you've added the resource dictionaries to the MergedDictionaries collection:

Application.Current.Resources[typeof(GridViewRow)] = new Style(typeof(GridViewRow)) { BasedOn = (Style)Application.Current.Resources["GridViewRowCoreStyle"] };
            Application.Current.Resources[typeof(TreeListViewRow)] = new Style(typeof(TreeListViewRow)) { BasedOn = (Style)Application.Current.Resources["TreeListViewRowCoreStyle"] };
            Application.Current.Resources[typeof(GridViewCell)] = new Style(typeof(GridViewCell)) { BasedOn = (Style)Application.Current.Resources["GridViewCellCoreStyle"] };

I'm also attaching a sample project to demonstrate the approach I have in mind. Please let me know if this works for you.

Regards,
Dilyan Traykov
Telerik by Progress
Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
0
Sergey
Top achievements
Rank 1
answered on 14 Sep 2016, 11:02 AM

Hi, thank you for reply,

yes, this works fine, but let me show an issue with RowHeight in your sample project:

Let set RowHeight="20" instead of RowHeight="60"

Some themes (and expression dark) does not apply the value "20",

   but apply if you remove lightweight templates, see screenshot.

Windows8Touch theme apply value "20" in all templates, but not apply in edit mode, see screenshot;

In my application I expect if I set RowHeight="20" then it should be 20 in all themes and modes; 25 is too much if you want to see many rows on screen without scrolling.

Best regards,

Sergey

0
Dilyan Traykov
Telerik team
answered on 14 Sep 2016, 02:54 PM
Hello Sergey,

This does seem to be a bug on our side and I have thus logged a bug report in our feedback portal to which you can subscribe in order to get updated about any changes in its status. As a thank you for your help, I've awarded you with some Telerik points.

What you can do for the time being is explicitly set the MinHeight property for the Style to 0​:

<Style TargetType="telerik:GridViewRow" BasedOn="{StaticResource GridViewRowCoreStyle}">
    <Setter Property="MinHeight" Value="0" />
</Style>

Then, in the ThemeManager class you will need to reapply the style as well:

var gridViewRowStyle = new Style(typeof(GridViewRow)) { BasedOn = (Style)Application.Current.Resources["GridViewRowCoreStyle"] };
var setter = new Setter(ContentControl.MinHeightProperty, 0.0);
var setters = new SetterBaseCollection();
gridViewRowStyle.Setters.Add(setter);
 
Application.Current.Resources[typeof(GridViewRow)] = gridViewRowStyle;

If you want to additionally limit the height for the editing elements, I'm you will need to modify the default styles for those controls as well. In the case of the Windows8Touch TextBox, this can be done like so:

<Style BasedOn="{StaticResource TextBoxStyle}" TargetType="TextBox">
    <Setter Property="Padding" Value="0" />
</Style>

I hope you find all of this helpful. Do let me know if any other questions or concerns arise.

Regards,
Dilyan Traykov
Telerik by Progress
Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
0
Sergey
Top achievements
Rank 1
answered on 15 Sep 2016, 05:20 AM
Hi, Thank you for help!
0
Sergey
Top achievements
Rank 1
answered on 13 Dec 2016, 08:31 AM

Hi again,

I have some issue with row height: all solutions above are works, but when we go in edit mode, row height become bigger. It would be nice that edit mode do not affect it or how to setup row height in edit mode?

0
Dilyan Traykov
Telerik team
answered on 14 Dec 2016, 04:25 PM
Hello Sergey,

In addition to removing the MinHeight constraint of the GridViewRow element, you will need to remove that same constraint for the TextBox element. This can be done like so:

<Style TargetType="telerik:GridViewRow" BasedOn="{StaticResource GridViewRowCoreStyle}">
    <Setter Property="MinHeight" Value="0" />
    <Style.Resources>
        <Style BasedOn="{StaticResource TextBoxStyle}" TargetType="TextBox">
            <Setter Property="Padding" Value="0" />
            <Setter Property="MinHeight" Value="0" />
        </Style>
    </Style.Resources>
</Style>

Please let me know if this works for you.

Regards,
Dilyan Traykov
Telerik by Progress
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
GridView
Asked by
Andrea Marchetti
Top achievements
Rank 1
Answers by
Kalin Milanov
Telerik team
Sergey
Top achievements
Rank 1
Dilyan Traykov
Telerik team
Share this question
or