从文件选取器将图像加载到 Canvas 控件
Load an Image to a Canvas Control from a File Picker
我在带有 Win2D 的 UWP 应用程序中尝试做的事情:
用户按下按钮添加图像并选择他们的文件。
该文件作为 Canvas 控件的资源加载。
然后图像被渲染到当前绘图会话
点击按钮时:
private async void btnAddPicture_Click(object sender, RoutedEventArgs e)
{
var picker = new Windows.Storage.Pickers.FileOpenPicker();
picker.FileTypeFilter.Add(".png");
picker.FileTypeFilter.Add(".jpg");
picker.FileTypeFilter.Add(".jpeg");
overlayPictureFile = await picker.PickSingleFileAsync();
if (overlayPictureFile == null)
{
txbNotification.Text = "File Picking cancelled";
return;
}
else
{
txbNotification.Text = "Picture Loaded";
}
using (IRandomAccessStream stream = await overlayPictureFile.OpenAsync(FileAccessMode.Read))
{
var device = new CanvasDevice();
createdBitmap = await CanvasBitmap.LoadAsync(device, stream);
}
}
绘图函数中:
void CanvasControl_Draw(CanvasControl sender, CanvasDrawEventArgs args)
{
if (createdBitmap != null)
{
args.DrawingSession.DrawImage(createdBitmap, Drawing.FindDefaultRect());
}
drawingCanvas.Invalidate();
}
一切都会编译,但当我按下按钮添加图像时,它会在这里中断。
#if DEBUG && !DISABLE_XAML_GENERATED_BREAK_ON_UNHANDLED_EXCEPTION
UnhandledException += (sender, e) =>
{
if (global::System.Diagnostics.Debugger.IsAttached) global::System.Diagnostics.Debugger.Break();
};
#endif
我已经在其中加载了一些图像,但这些都是程序的一部分,并且是在使用这些创建 canvas 之前创建的。不确定如何处理用户选择的内容。
private void drawingCanvas_CreateResources(CanvasControl sender, Microsoft.Graphics.Canvas.UI.CanvasCreateResourcesEventArgs args)
{
args.TrackAsyncAction(CreateResourcesAsync(sender).AsAsyncAction());
}
private async Task CreateResourcesAsync(CanvasControl sender)
{
logo = await CanvasBitmap.LoadAsync(sender, new Uri("ms-appx:///Assets/Pictures/Logo_BlackBorders.png"));
}
更新:
我目前正在画画的地方。这是我要添加图像的 canvas。
void CanvasControl_Draw(CanvasControl sender, CanvasDrawEventArgs args)
{
//Drawing a bunch of stuff
}
private void drawingCanvas_CreateResources(CanvasControl sender, Microsoft.Graphics.Canvas.UI.CanvasCreateResourcesEventArgs args)
{
args.TrackAsyncAction(CreateResourcesAsync(sender).AsAsyncAction());
}
private async Task CreateResourcesAsync(CanvasControl sender)
{
logo = await CanvasBitmap.LoadAsync(sender, new Uri("ms-appx:///Assets/Pictures/Logo.png"));
}
Load an Image to a Canvas Control from a File Picker
对于您的场景,您可以获得 CanvasDrawingSession
with CreateDrawingSession
method. And then use this drawingsession to draw picked image to current CanvasControl
。
例如。
private async void btnAddPicture_Click(object sender, RoutedEventArgs e)
{
var picker = new Windows.Storage.Pickers.FileOpenPicker();
picker.FileTypeFilter.Add(".png");
picker.FileTypeFilter.Add(".jpg");
picker.FileTypeFilter.Add(".jpeg");
var overlayPictureFile = await picker.PickSingleFileAsync();
if (overlayPictureFile == null)
{
return;
}
else
{
}
using (IRandomAccessStream stream = await overlayPictureFile.OpenAsync(FileAccessMode.Read))
{
//get canvascontrol's Device property.
CanvasDevice device = drawingCanvas.Device;
createdBitmap = await CanvasBitmap.LoadAsync(device, stream);
//use device property to make renderer
var renderer = new CanvasRenderTarget(device,
createdBitmap.SizeInPixels.Width,
createdBitmap.SizeInPixels.Height, createdBitmap.Dpi);
//make ds with above renderer.
using (var ds = renderer.CreateDrawingSession())
{
ds.DrawImage(createdBitmap, 0, 0);
}
}
}
我在带有 Win2D 的 UWP 应用程序中尝试做的事情: 用户按下按钮添加图像并选择他们的文件。 该文件作为 Canvas 控件的资源加载。 然后图像被渲染到当前绘图会话
点击按钮时:
private async void btnAddPicture_Click(object sender, RoutedEventArgs e)
{
var picker = new Windows.Storage.Pickers.FileOpenPicker();
picker.FileTypeFilter.Add(".png");
picker.FileTypeFilter.Add(".jpg");
picker.FileTypeFilter.Add(".jpeg");
overlayPictureFile = await picker.PickSingleFileAsync();
if (overlayPictureFile == null)
{
txbNotification.Text = "File Picking cancelled";
return;
}
else
{
txbNotification.Text = "Picture Loaded";
}
using (IRandomAccessStream stream = await overlayPictureFile.OpenAsync(FileAccessMode.Read))
{
var device = new CanvasDevice();
createdBitmap = await CanvasBitmap.LoadAsync(device, stream);
}
}
绘图函数中:
void CanvasControl_Draw(CanvasControl sender, CanvasDrawEventArgs args)
{
if (createdBitmap != null)
{
args.DrawingSession.DrawImage(createdBitmap, Drawing.FindDefaultRect());
}
drawingCanvas.Invalidate();
}
一切都会编译,但当我按下按钮添加图像时,它会在这里中断。
#if DEBUG && !DISABLE_XAML_GENERATED_BREAK_ON_UNHANDLED_EXCEPTION
UnhandledException += (sender, e) =>
{
if (global::System.Diagnostics.Debugger.IsAttached) global::System.Diagnostics.Debugger.Break();
};
#endif
我已经在其中加载了一些图像,但这些都是程序的一部分,并且是在使用这些创建 canvas 之前创建的。不确定如何处理用户选择的内容。
private void drawingCanvas_CreateResources(CanvasControl sender, Microsoft.Graphics.Canvas.UI.CanvasCreateResourcesEventArgs args)
{
args.TrackAsyncAction(CreateResourcesAsync(sender).AsAsyncAction());
}
private async Task CreateResourcesAsync(CanvasControl sender)
{
logo = await CanvasBitmap.LoadAsync(sender, new Uri("ms-appx:///Assets/Pictures/Logo_BlackBorders.png"));
}
更新: 我目前正在画画的地方。这是我要添加图像的 canvas。
void CanvasControl_Draw(CanvasControl sender, CanvasDrawEventArgs args)
{
//Drawing a bunch of stuff
}
private void drawingCanvas_CreateResources(CanvasControl sender, Microsoft.Graphics.Canvas.UI.CanvasCreateResourcesEventArgs args)
{
args.TrackAsyncAction(CreateResourcesAsync(sender).AsAsyncAction());
}
private async Task CreateResourcesAsync(CanvasControl sender)
{
logo = await CanvasBitmap.LoadAsync(sender, new Uri("ms-appx:///Assets/Pictures/Logo.png"));
}
Load an Image to a Canvas Control from a File Picker
对于您的场景,您可以获得 CanvasDrawingSession
with CreateDrawingSession
method. And then use this drawingsession to draw picked image to current CanvasControl
。
例如。
private async void btnAddPicture_Click(object sender, RoutedEventArgs e)
{
var picker = new Windows.Storage.Pickers.FileOpenPicker();
picker.FileTypeFilter.Add(".png");
picker.FileTypeFilter.Add(".jpg");
picker.FileTypeFilter.Add(".jpeg");
var overlayPictureFile = await picker.PickSingleFileAsync();
if (overlayPictureFile == null)
{
return;
}
else
{
}
using (IRandomAccessStream stream = await overlayPictureFile.OpenAsync(FileAccessMode.Read))
{
//get canvascontrol's Device property.
CanvasDevice device = drawingCanvas.Device;
createdBitmap = await CanvasBitmap.LoadAsync(device, stream);
//use device property to make renderer
var renderer = new CanvasRenderTarget(device,
createdBitmap.SizeInPixels.Width,
createdBitmap.SizeInPixels.Height, createdBitmap.Dpi);
//make ds with above renderer.
using (var ds = renderer.CreateDrawingSession())
{
ds.DrawImage(createdBitmap, 0, 0);
}
}
}