Skip to content

Commit f56f1b4

Browse files
apmanapman
authored
[MacOS] Fix DataGrid rows when columns are sized to fill the space (#174)
1 parent 28263b9 commit f56f1b4

File tree

4 files changed

+92
-46
lines changed

4 files changed

+92
-46
lines changed

‎samples/SampleApp/DemoPages/DataGridDemo.axaml

Lines changed: 80 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -11,43 +11,84 @@
1111
<vm:DataGridViewModel />
1212
</Design.DataContext>
1313

14-
<StackPanel Margin="20" Spacing="30">
15-
<DataGrid ItemsSource="{Binding Items}"
16-
Height="150"
17-
IsReadOnly="False">
18-
<DataGrid.Columns>
19-
<DataGridTemplateColumn Header="">
20-
<DataGridTemplateColumn.CellTemplate>
21-
<DataTemplate>
22-
<Svg Path="/Assets/Computer.svg" Width="16" Height="16" Css=".st0 {fill: #3B86EA}" />
23-
</DataTemplate>
24-
</DataGridTemplateColumn.CellTemplate>
25-
</DataGridTemplateColumn>
26-
<DataGridTextColumn Header="Type" Binding="{Binding ItemType}" />
27-
<DataGridTextColumn Header="Common Name" Binding="{Binding CommonName}" />
28-
<DataGridTextColumn Header="Account Name" Binding="{Binding AccountName}" />
29-
<DataGridTextColumn Header="Last Modified" Binding="{Binding LastModified}" IsReadOnly="True" />
30-
</DataGrid.Columns>
31-
</DataGrid>
32-
<StackPanel Spacing="10">
33-
<TextBlock>With <TextBlock Classes="code" Text="Classes='cell-selectable-style'" /></TextBlock>
34-
<DataGrid ItemsSource="{Binding Items}"
35-
Classes="cell-selectable-style"
36-
IsReadOnly="False">
37-
<DataGrid.Columns>
38-
<DataGridTemplateColumn Header="">
39-
<DataGridTemplateColumn.CellTemplate>
40-
<DataTemplate>
41-
<Svg Path="/Assets/Computer.svg" Width="16" Height="16" Css=".st0 {fill: #3B86EA}" />
42-
</DataTemplate>
43-
</DataGridTemplateColumn.CellTemplate>
44-
</DataGridTemplateColumn>
45-
<DataGridTextColumn Header="Type" Binding="{Binding ItemType}" />
46-
<DataGridTextColumn Header="Common Name" Binding="{Binding CommonName}" />
47-
<DataGridTextColumn Header="Account Name" Binding="{Binding AccountName}" />
48-
<DataGridTextColumn Header="Last Modified" Binding="{Binding LastModified}" IsReadOnly="True" />
49-
</DataGrid.Columns>
50-
</DataGrid>
51-
</StackPanel>
52-
</StackPanel>
14+
<TabControl TabStripPlacement="Top" Margin="20">
15+
<TabItem Header="DataGrid">
16+
<StackPanel Margin="20" Spacing="30">
17+
<DataGrid ItemsSource="{Binding Items}"
18+
Height="150"
19+
IsReadOnly="False">
20+
<DataGrid.Columns>
21+
<DataGridTemplateColumn Header="">
22+
<DataGridTemplateColumn.CellTemplate>
23+
<DataTemplate>
24+
<Svg Path="/Assets/Computer.svg" Width="16" Height="16" Css=".st0 {fill: #3B86EA}" />
25+
</DataTemplate>
26+
</DataGridTemplateColumn.CellTemplate>
27+
</DataGridTemplateColumn>
28+
<DataGridTextColumn Header="Type" Binding="{Binding ItemType}" Width="*" />
29+
<DataGridTextColumn Header="Common Name" Binding="{Binding CommonName}" Width="*" />
30+
<DataGridTextColumn Header="Account Name" Binding="{Binding AccountName}" Width="*" />
31+
<DataGridTextColumn Header="Last Modified" Binding="{Binding LastModified}" IsReadOnly="True" Width="*" />
32+
</DataGrid.Columns>
33+
</DataGrid>
34+
<StackPanel Spacing="10">
35+
<TextBlock>With <TextBlock Classes="code" Text="Classes='cell-selectable-style'" /></TextBlock>
36+
<DataGrid ItemsSource="{Binding Items}"
37+
Classes="cell-selectable-style"
38+
IsReadOnly="False">
39+
<DataGrid.Columns>
40+
<DataGridTemplateColumn Header="">
41+
<DataGridTemplateColumn.CellTemplate>
42+
<DataTemplate>
43+
<Svg Path="/Assets/Computer.svg" Width="16" Height="16" Css=".st0 {fill: #3B86EA}" />
44+
</DataTemplate>
45+
</DataGridTemplateColumn.CellTemplate>
46+
</DataGridTemplateColumn>
47+
<DataGridTextColumn Header="Type" Binding="{Binding ItemType}" Width="*" />
48+
<DataGridTextColumn Header="Common Name" Binding="{Binding CommonName}" Width="*" />
49+
<DataGridTextColumn Header="Account Name" Binding="{Binding AccountName}" Width="*" />
50+
<DataGridTextColumn Header="Last Modified" Binding="{Binding LastModified}" IsReadOnly="True" Width="*" />
51+
</DataGrid.Columns>
52+
</DataGrid>
53+
</StackPanel>
54+
</StackPanel>
55+
</TabItem>
56+
<TabItem Header="Non-Distributed Columns">
57+
<StackPanel Margin="20" Spacing="10">
58+
<TextBlock><Bold>NOTE:</Bold> When none of the columns are sized to fill the width of the table (<TextBlock Classes="code" Text="Width='*'" />), the right row margins are too large</TextBlock>
59+
<DataGrid ItemsSource="{Binding Items}">
60+
<DataGrid.Columns>
61+
<DataGridTemplateColumn Header="">
62+
<DataGridTemplateColumn.CellTemplate>
63+
<DataTemplate>
64+
<Svg Path="/Assets/Computer.svg" Width="16" Height="16" Css=".st0 {fill: #3B86EA}" />
65+
</DataTemplate>
66+
</DataGridTemplateColumn.CellTemplate>
67+
</DataGridTemplateColumn>
68+
<DataGridTextColumn Header="Type" Binding="{Binding ItemType}" />
69+
<DataGridTextColumn Header="Common Name" Binding="{Binding CommonName}" />
70+
<DataGridTextColumn Header="Account Name" Binding="{Binding AccountName}" />
71+
<DataGridTextColumn Header="Last Modified" Binding="{Binding LastModified}" IsReadOnly="True" />
72+
</DataGrid.Columns>
73+
</DataGrid>
74+
<TextBlock>This can be fixed by applying <TextBlock Classes="code" Text="Classes='MacOS_NonDistributed_Columns'" />:</TextBlock>
75+
<DataGrid ItemsSource="{Binding Items}"
76+
Classes="MacOS_NonDistributed_Columns">
77+
<DataGrid.Columns>
78+
<DataGridTemplateColumn Header="">
79+
<DataGridTemplateColumn.CellTemplate>
80+
<DataTemplate>
81+
<Svg Path="/Assets/Computer.svg" Width="16" Height="16" Css=".st0 {fill: #3B86EA}" />
82+
</DataTemplate>
83+
</DataGridTemplateColumn.CellTemplate>
84+
</DataGridTemplateColumn>
85+
<DataGridTextColumn Header="Type" Binding="{Binding ItemType}" />
86+
<DataGridTextColumn Header="Common Name" Binding="{Binding CommonName}" />
87+
<DataGridTextColumn Header="Account Name" Binding="{Binding AccountName}" />
88+
<DataGridTextColumn Header="Last Modified" Binding="{Binding LastModified}" IsReadOnly="True" />
89+
</DataGrid.Columns>
90+
</DataGrid>
91+
</StackPanel>
92+
</TabItem>
93+
</TabControl>
5394
</UserControl>

‎samples/SampleApp/DemoPages/DataGridGroupedDemo.axaml

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -33,9 +33,9 @@
3333
</DataTemplate>
3434
</DataGridTemplateColumn.CellTemplate>
3535
</DataGridTemplateColumn>
36-
<DataGridTextColumn Header="Common Name" Binding="{Binding CommonName}" x:DataType="local:DataGridItem" />
37-
<DataGridTextColumn Header="Account Name" Binding="{Binding AccountName}" x:DataType="local:DataGridItem" />
38-
<DataGridTextColumn Header="Last Modified" Binding="{Binding LastModified}" IsReadOnly="True" x:DataType="local:DataGridItem" />
36+
<DataGridTextColumn Header="Common Name" Binding="{Binding CommonName}" x:DataType="local:DataGridItem" Width="*" />
37+
<DataGridTextColumn Header="Account Name" Binding="{Binding AccountName}" x:DataType="local:DataGridItem" Width="*" />
38+
<DataGridTextColumn Header="Last Modified" Binding="{Binding LastModified}" IsReadOnly="True" x:DataType="local:DataGridItem" Width="*" />
3939
</DataGrid.Columns>
4040
</DataGrid>
4141
<TextBlock>
@@ -64,9 +64,9 @@
6464
</DataTemplate>
6565
</DataGridTemplateColumn.CellTemplate>
6666
</DataGridTemplateColumn>
67-
<DataGridTextColumn Header="Common Name" Binding="{Binding CommonName}" x:DataType="local:DataGridItem" />
68-
<DataGridTextColumn Header="Account Name" Binding="{Binding AccountName}" x:DataType="local:DataGridItem" />
69-
<DataGridTextColumn Header="Last Modified" Binding="{Binding LastModified}" IsReadOnly="True" x:DataType="local:DataGridItem" />
67+
<DataGridTextColumn Header="Common Name" Binding="{Binding CommonName}" x:DataType="local:DataGridItem" Width="*" />
68+
<DataGridTextColumn Header="Account Name" Binding="{Binding AccountName}" x:DataType="local:DataGridItem" Width="*" />
69+
<DataGridTextColumn Header="Last Modified" Binding="{Binding LastModified}" IsReadOnly="True" x:DataType="local:DataGridItem" Width="*" />
7070
</DataGrid.Columns>
7171
</DataGrid>
7272

‎src/Devolutions.AvaloniaTheme.MacOS/Accents/ThemeResources.axaml

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -391,6 +391,7 @@
391391
<x:Double x:Key="DataGridSortChevronSize">7</x:Double>
392392
<Thickness x:Key="DataGridRowPadding">6 0</Thickness>
393393
<Thickness x:Key="DataGridRowMargin">8 0</Thickness>
394+
<Thickness x:Key="DataGridDistributedColumnsRowMargin">8 0 18 0</Thickness>
394395
<Thickness x:Key="DataGridGroupHeaderBorderThickness">1</Thickness>
395396
<Thickness x:Key="DataGridGroupHeaderBorderThicknessGridLinesVisible">0 1</Thickness>
396397
<Thickness x:Key="DataGridGroupHeaderMargin">8 2</Thickness>

‎src/Devolutions.AvaloniaTheme.MacOS/Controls/DataGrid.axaml

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -371,7 +371,6 @@
371371
<DataGridFrozenGrid Name="PART_Root"
372372
ColumnDefinitions="Auto,*"
373373
RowDefinitions="*,Auto,Auto">
374-
375374
<Border Name="ItemBorder"
376375
Background="{TemplateBinding Background}"
377376
Grid.RowSpan="2"
@@ -380,7 +379,12 @@
380379
<MultiBinding Converter="{x:Static DevoMultiConverters.OptionsToChoiceConverter}"
381380
ConverterParameter="None,All,Horizontal,Vertical">
382381
<Binding RelativeSource="{RelativeSource FindAncestor, AncestorType=DataGrid}" Path="GridLinesVisibility" />
382+
<MultiBinding Converter="{x:Static DevoMultiConverters.ClassToChoiceConverter}"
383+
ConverterParameter="MacOS_NonDistributed_Columns">
384+
<Binding RelativeSource="{RelativeSource FindAncestor, AncestorType=DataGrid}" Path="Classes" />
383385
<Binding Source="{StaticResource DataGridRowMargin}" />
386+
<Binding Source="{StaticResource DataGridDistributedColumnsRowMargin}" />
387+
</MultiBinding>
384388
<Binding Source="{StaticResource DataGridGroupHeaderMarginGridLinesVisible}" />
385389
</MultiBinding>
386390
</Border.Margin>

0 commit comments

Comments
 (0)