VisualBrush Clips Image of Control

The bug If I use a VisualBrush to draw a control, which is not positioned on 0/0 (Bounds X/Y), the drawn control is cut off (clipped), although no clipping, transformation,… is applied to the source-control.

The only way I could make it not clipped was to use RenderTransform on the source control, which breaks the original rendering of the control, so this is no valid workaround.

To Reproduce Steps to reproduce the behavior:

1. Create new Avalonia 11 Preview 5 app called “Project1”
2. Use this AXAML

<Window xmlns="https://github.com/avaloniaui"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
		xmlns:local="using:Project1"
        mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
        x:Class="Project1.MainWindow"
        Title="Project1"
		Background="#666">
        <StackPanel Orientation="Horizontal">
		<Button Name="a" Width="50">aaa</Button>
		<TextBox Name="text" IsReadOnly="False" Background="#444">
			<!--<TextBox.RenderTransform>
				<TranslateTransform X="-50"/>
			</TextBox.RenderTransform>-->
			asdfdddd
		</TextBox>
		<Button Name="b" Width="100" Background="Orange" ClipToBounds="False">
			bbb
		</Button>
		<Button Width="100">ccc</Button>
		<Rectangle Stroke="Red" StrokeThickness="1" Width="200" Height="100">
			<Rectangle.Fill>
				<VisualBrush AlignmentX="Left" AlignmentY="Top" Stretch="None" 
							 Visual="{ResolveByName text}">
				</VisualBrush>
			</Rectangle.Fill>
			
		</Rectangle>
		<Button Width="100">ddd</Button>
	</StackPanel>
</Window>

1. See that in the rectangle, the text input control is cut off by exactly the Bounds.X amount
2. Now uncomment the TextBox.RenderTransform
3. The TextBox is not cut off anymore in the rectangle

You can try to change the size of the first control and you will see it is always cut off by its width amount.

Investigation The issue seems to come from the initial translation in ImmediateRenderer.Rendermethod: https://github.com/AvaloniaUI/Avalonia/blob/1af62aee84bc750ffc442b86a5d777ac397f05c2/src/Avalonia.Base/Rendering/ImmediateRenderer.cs#L86 and then later applied https://github.com/AvaloniaUI/Avalonia/blob/1af62aee84bc750ffc442b86a5d777ac397f05c2/src/Avalonia.Base/Rendering/ImmediateRenderer.cs#L119

It seems to me this initial value for m is unnecessary/wrong, or at least applied in a wrong way.

Expected behavior If no clipping, translations,… are applied to the input visual of VisualBrush, then the whole control should be drawn/visible and not clipped.

Screenshots

Desktop (please complete the following information):

• OS: Windows 11 22H2 Build 22621.1194
• Version: 11 Preview 5

Additional context I discovered this bug while trying to workaround/fix the TabView control in the FluentAvalonia project https://github.com/amwx/FluentAvalonia (in “New Controls” -> “TabView”, try to drag the 2nd tab - it will be cut off).

EDIT: Removed unnecessary use of local:TabViewStackPanel, replaced by normal StackPanel

[Gillibald]

I think the visual should be rendered with its original size but not with the original relative position.

https://github.com/AvaloniaUI/Avalonia/blob/5eeedbbf88787191adb9262b5689d65284a870b2/src/Avalonia.Base/Media/VisualBrush.cs#L98

The brush itself can still be translated to an individual position if needed.

[warappa]

Is there any chance for this to get fixed before v11 as the final release candidate is published?

As mentioned initially, this impacts dragging tabs in FluentAvalonia’s TabView. And IMHO FluentAvalonia is already an awesome demo of what Avalonia can do for Windows style (x-plat) apps, even more so with fewer bugs 😉.