When a Translation of X/Y is applied to an image in xaml, the image is translated, but the background and clickable area is not. This is causing wonky issues with Touch, as the orignal location accepts touch's, but not the new image location. This is only for Android; iOS and Windows seem to be fine.
Steps to Reproduce
Create a brand new MAUI project
Copy the following in the MainPage.xaml
<Grid
Padding="30,0"
RowSpacing="25"
RowDefinitions="*, Auto, Auto, Auto">
<Image
Grid.Row="0"
Source="dotnet_bot.png"
HeightRequest="100"
WidthRequest="200"
VerticalOptions="Start"
HorizontalOptions="Center"
Aspect="AspectFit"
TranslationX="50"
TranslationY="100"
BackgroundColor="Lime"
SemanticProperties.Description="dot net bot in a race car number eight">
<Image.GestureRecognizers>
<TapGestureRecognizer
Tapped="OnCounterClicked" />
</Image.GestureRecognizers>
</Image>
<Label
Grid.Row="1"
Text="Hello, World!"
Style="{StaticResource Headline}"
SemanticProperties.HeadingLevel="Level1" />
<Label
Grid.Row="2"
Text="Welcome to .NET Multi-platform App UI"
Style="{StaticResource SubHeadline}"
SemanticProperties.HeadingLevel="Level2"
SemanticProperties.Description="Welcome to dot net Multi platform App U I" />
<Button
Grid.Row="3"
x:Name="CounterBtn"
Text="Click me"
SemanticProperties.Hint="Counts the number of times you click"
Clicked="OnCounterClicked"
HorizontalOptions="Fill" />
</Grid>
Run on Android.
Tap on the image
Expected Results:
Image has a Lime green background.
Tapping the image increases count, just like tapping the button would.
Actual Result:
Lime Background is in original position before Translation.
Tapping the image does nothing; Tap is tied to background.
Link to public reproduction project repository
None, simple enough to recreate from base project
Version with bug
8.0.20 SR4
Is this a regression from previous behavior?
Yes, this used to work in Xamarin.Forms
Last version that worked well
Unknown/Other
Affected platforms
Android
Affected platform versions
All
Did you find any workaround?
Not yet. I could try wrapping the image in a border/grid/contentview and then doing the translation, but would prefer not to add extra layouts if possible. Could also add extra rows/columns to grid to avoid using translations.
Verified on VS 17.10.0 Preview 4.0(8.0.20). Repro on Android 14.0-API34, not repro on Windows 11, iOS 17.2 and MacCatalyst with below Project:
21868.zip
Description
When a Translation of X/Y is applied to an image in xaml, the image is translated, but the background and clickable area is not. This is causing wonky issues with Touch, as the orignal location accepts touch's, but not the new image location. This is only for Android; iOS and Windows seem to be fine.
Steps to Reproduce
Copy the following in the MainPage.xaml
Expected Results:
Actual Result:
Link to public reproduction project repository
None, simple enough to recreate from base project
Version with bug
8.0.20 SR4
Is this a regression from previous behavior?
Yes, this used to work in Xamarin.Forms
Last version that worked well
Unknown/Other
Affected platforms
Android
Affected platform versions
All
Did you find any workaround?
Not yet. I could try wrapping the image in a border/grid/contentview and then doing the translation, but would prefer not to add extra layouts if possible. Could also add extra rows/columns to grid to avoid using translations.