La classe RenderTargetBitmap introdotta già ai tempi di Windows 8, è spesso stata utilizzata per renderizzare come immagini (e salvarle) porzioni di UI in XAML per creare, ad esempio, delle live tile dai contenuti personalizzati. Questa classe, però, non funziona con tutti i controlli che sono esposti dal Windows Runtime, come può essere il caso del nuovo InkCanvas introdotto da Windows 10.
La classe InkCanvas, in particolare, espone già il metodo SaveAsync all'interno della proprietà StrokeContainer, ma l'output dell'immagine sarà un ISF (Ink Stroke Format), oppure una GIF con ISF: la loro particolarità, in entrambi i casi, è che riducono la qualità dell'immagine durante il salvataggio per poter ridurre al minimo le dimensioni.
Per ovviare a questo problema e mantenere la risoluzione originale che si vede all'interno dell'applicazione UWP, viene comodo sfruttare la classe CanvasDevice contenuta nel pacchetto di NuGet di Microsoft Win2d.uwp che permette di salvare qualsiasi tipo di contenuto, così come lo faceva la RenderTargetBitmap. Un esempio di codice è mostrato di seguito:
private async void OnSaveButtonClick(object sender, RoutedEventArgs e) { CanvasDevice device = CanvasDevice.GetSharedDevice(); CanvasRenderTarget renderTarget = new CanvasRenderTarget(device, (int)MyCanvas.ActualWidth, (int)MyCanvas.ActualHeight, 96); using (var ds = renderTarget.CreateDrawingSession()) { ds.Clear(Colors.White); ds.DrawInk(MyCanvas.InkPresenter.StrokeContainer.GetStrokes()); } StorageFolder storageFolder = ApplicationData.Current.LocalFolder; StorageFile file = await storageFolder.CreateFileAsync("myImage.jpg", CreationCollisionOption.ReplaceExisting); using (var fileStream = await file.OpenAsync(FileAccessMode.ReadWrite)) await renderTarget.SaveAsync(fileStream, CanvasBitmapFileFormat.Jpeg, 1f); }
Una volta ottenuto il canvas da salvare, nel nostro caso l'oggetto InkCanvas, sarà sufficiente aggiungere alla superficie dell'immagine, tramite il metodo DrawInk, tutti gli stroke avendo cura di eliminare il background bianco di default del canvas. Recuperato lo StorageFile dove si vuole salvare l'immagine, si può creare la JPG con il metodo SaveAsync.
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Creare una libreria CSS universale: i bottoni
Creare una libreria CSS universale: Clip-path
Rendere le variabili read-only in una pipeline di Azure DevOps
Gestione CSS in Blazor con .NET 9
Gestire i dati con Azure Cosmos DB Data Explorer
Conoscere il rendering Server o WebAssembly a runtime in Blazor
Supporto ai tipi DateOnly e TimeOnly in Entity Framework Core
Utilizzare Copilot con Azure Cosmos DB
Configurare il nome della run di un workflow di GitHub in base al contesto di esecuzione
Utilizzare Azure AI Studio per testare i modelli AI
Creare una libreria CSS universale - Rotazione degli elementi
Fissare una versione dell'agent nelle pipeline di Azure DevOps
I più letti di oggi
- .NET Conference Italia 2024 - Milano
- Develop and distribute Azure Functions using K8s and CI/CD
- Disponibile la versione finale di Hyper-V: la virtualizzazione per Windows Server 2008
- Speciale Mastering Entity Framework
- Velocity arriva alla CTP3
- Silverlight Summer: un'estate speciale piena di Style per i controlli Silverlight!
- Disponibile la versione beta di Silverlight 4.0
- Mono 0.13: ora anche web services
- .NET Alerts Software Development Kit