I have a .NET MAUI drawing view with the background set to white in the following code on a separate XAML page apart from the previous page where the result is displayed. The problem is though for some reason, I keep getting a grey background on the finished image after submitting the drawing view. Here is the code for the .net MAUI drawing view:
<control:LandscapeContentPage
....
xmlns:views="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
....
>
....
<views:DrawingView x:Name="signatureView"
Lines="{Binding SignatureLines}"
HorizontalOptions="FillAndExpand"
VerticalOptions="FillAndExpand"
BackgroundColor="White"
LineColor="Black"
LineWidth="2"
DrawingLineCompletedCommand="{Binding LineCompletedCommand}"
IsMultiLineModeEnabled="true"
ShouldClearOnFinish="false" />
...
</control:LandscapeContentPage>
Here is the underlying view model code for creating a line and then saving the drawing view image via a button click:
//Drawing the line on the drawing view:
private async void OnLineCompletedCommand(IDrawingLine line)
{
SignatureLines.Add(line);
#if ANDROID
var stream = await SignatureView.GetImageStream(500, 500);
SignatureBytes = ((MemoryStream)stream).ToArray();
#elif IOS
var imageData = await SignatureView.GetImageStream(500, 500);
var imageNsData = NSData.FromStream(imageData);
var nsStream = imageNsData.AsStream();
var stream = new MemoryStream();
nsStream.CopyTo(stream);
SignatureBytes = stream.ToArray();
#endif
SignatureImage = new Image();
SignatureImage.Source = ImageSource.FromStream(() => stream);
}
//Saving the image
private async Task OnSubmitCommand()
{
if (!Busy)
{
Busy = true;
if (_sessionGUID.HasValue)
{
DisplayNotSignedError = (SignatureLines == null || SignatureLines.ToList().Count == 0);
DisplaySignatureError = !(SelectedParent.Key > 0 || (SelectedParent.Key <= 0 && !string.IsNullOrEmpty(OtherSignature)));
if (!DisplaySignatureError && !DisplayNotSignedError)
{
await _dataService.Sessions.AddOrUpdateParentSignature(_sessionGUID.Value, SelectedParent.Key > 0 ? SelectedParent.Value : OtherSignature, SignatureBytes);
await _navigationService.TryNavigateBackAsync(Constants.ATrack.SESSION_GUID, _sessionGUID.Value);
}
}
Busy = false;
}
}
Here are the results I get after using the aforementioned code. Notice how the background is grey when the image is submitted and the page is navigated back to the previous one:
Image of signature image with Grey back ground
I thought that just by simply setting the background image to either white or transparent would resolve this issue, but this did not help. Any advice on how to fix this would be much appreciated.
>Solution :
GetImageStream has an argument that specifies the background color
GetImageStream(IEnumerable<IDrawingLine> lines,
Size imageSize,
Brush? background,
CancellationToken token = default) =>