Avalonia.Controls.TreeDataGrid icon indicating copy to clipboard operation
Avalonia.Controls.TreeDataGrid copied to clipboard

Cell Editing Template doesn't work with Control Themes

Open ClassyCircuit opened this issue 1 year ago • 1 comments
trafficstars

If I apply a control theme to the data template that is used for cell editing, then the text becomes hidden during editing. Even if there aren't any styles applied to it.

viewmodel:

Source = new FlatTreeDataGridSource<ParamViewModel>(_collection)
{
    Columns =
    {
        new TemplateColumn<ParamViewModel>(
            header: "Enabled",
            cellTemplateResourceKey: "EnabledCell",
            width: new GridLength(1, GridUnitType.Auto)),
        new TemplateColumn<ParamViewModel>(
            header: "Key",
            cellTemplateResourceKey: "KeyCell",
            cellEditingTemplateResourceKey: "KeyCellEdit",
            width: new GridLength(1, GridUnitType.Auto),
            options: new TemplateColumnOptions<ParamViewModel>
            {
                CompareAscending = ParamViewModel.SortAscending,
                CompareDescending = ParamViewModel.SortDescending,
                IsTextSearchEnabled = true,
                TextSearchValueSelector = x => x.Key
            }),
        new TemplateColumn<ParamViewModel>(
            header: "Value",
            cellTemplateResourceKey: "ValueCell",
            cellEditingTemplateResourceKey: "ValueCellEdit",
            width: new GridLength(1, GridUnitType.Auto)),
        new TemplateColumn<ParamViewModel>(
            header: "Description",
            cellTemplateResourceKey: "DescriptionCell",
            cellEditingTemplateResourceKey: "DescriptionCellEdit",
            width: new GridLength(1, GridUnitType.Auto)),
    },
};

View:

<UserControl.Resources>
<ControlTheme x:Key="CellTextBlock" TargetType="TextBlock">
	<Setter Property="Margin" Value="10,0,10,0"/>
</ControlTheme>

<ControlTheme x:Key="CellTextBox" TargetType="TextBox">
	<Setter Property="VerticalAlignment" Value="Center"/>
</ControlTheme>

</UserControl.Resources>
 <TreeDataGrid
	CanUserResizeColumns="True"
	Source="{Binding QueryParamsSource}">
	<TreeDataGrid.Resources>
		<DataTemplate x:Key="EnabledCell" DataType="vm:ParamViewModel">
			<CheckBox IsChecked="{Binding IsEnabled}" HorizontalAlignment="Center"/>
		</DataTemplate>
		<DataTemplate x:Key="KeyCell" DataType="vm:ParamViewModel">
			<TextBlock Text="{Binding Key}" Theme="{StaticResource CellTextBlock}"/>
		</DataTemplate>
		<DataTemplate x:Key="KeyCellEdit" DataType="vm:ParamViewModel">
			<TextBox Text="{Binding Key, Mode=TwoWay}" Theme="{StaticResource CellTextBox}"/>
		</DataTemplate>
		<DataTemplate x:Key="ValueCell" DataType="vm:ParamViewModel">
			<TextBlock Text="{Binding Value}" Theme="{StaticResource CellTextBlock}"/>
		</DataTemplate>
		<DataTemplate x:Key="ValueCellEdit" DataType="vm:ParamViewModel">
			<TextBox Text="{Binding Value, Mode=TwoWay}" Theme="{StaticResource CellTextBox}"/>
		</DataTemplate>
		<DataTemplate x:Key="DescriptionCell" DataType="vm:ParamViewModel">
			<TextBlock Text="{Binding Description}" Theme="{StaticResource CellTextBlock}"/>
		</DataTemplate>
		<DataTemplate x:Key="DescriptionCellEdit" DataType="vm:ParamViewModel">
			<TextBox Text="{Binding Description, Mode=TwoWay}" Foreground="Red" Theme="{StaticResource CellTextBox}"/>
		</DataTemplate>

	</TreeDataGrid.Resources>
</TreeDataGrid>

Even if I remove all setters from both control themes, it doesn't matter, the result is the same, here is a short gif showing what happens when I enter edit mode:

celledit_bug

As you can see, text can be changed, but it is hidden during editing. I tried setting Foreground property to Black, but that didn't change anything.

ClassyCircuit avatar Feb 06 '24 20:02 ClassyCircuit

In debugger, I found out that default textbox styling looks like this:

image

and my textbox with a control theme applied looks like this:

image

I thought control themes, by default, inherited from already defined control themes? But it looks like it just completely ignores the themes applied by default to the textbox. How can I force it to inherit from already existing themes? I only wish to customize a few properties, I don't want to re-write the whole textbox from scratch.

ClassyCircuit avatar Feb 07 '24 06:02 ClassyCircuit