UWP创建动态矩形

Question

我是UWP新手，我的第一个任务是裁剪想象，现在我试图找到如何创建一个动态矩形来裁剪想像 p.s.我为这个坏语法感到抱歉。

我的程序必须有按钮，打开该文件，然后在屏幕上必须是动态的矩形用户可以更改或移动，当用户按下“保存”按钮，图像将裁剪为矩形大小 有我的C＃代码 谢谢）

namespace Crop1 
{ 
    public sealed partial class MainPage : Page 
    { 
     public MainPage() 
     { 
      this.InitializeComponent(); 
     } 

     SoftwareBitmap softwareBitmap; 
     private async void OpenFile(object sender, RoutedEventArgs e) 
     { 
      FileOpenPicker fileOpenPicker = new FileOpenPicker(); 
      fileOpenPicker.SuggestedStartLocation = PickerLocationId.PicturesLibrary; 
      fileOpenPicker.FileTypeFilter.Add(".jpg"); 
      fileOpenPicker.ViewMode = PickerViewMode.Thumbnail; 

      var inputFile = await fileOpenPicker.PickSingleFileAsync(); 

      if (inputFile == null) 
      { 
       // The user cancelled the picking operation 
       return; 
      } 

      using (IRandomAccessStream stream = await inputFile.OpenAsync(FileAccessMode.Read)) 
      { 
       // Create the decoder from the stream 
       BitmapDecoder decoder = await BitmapDecoder.CreateAsync(stream); 

       // Get the SoftwareBitmap representation of the file 
       softwareBitmap = await decoder.GetSoftwareBitmapAsync(); 
      } 
      if (softwareBitmap.BitmapPixelFormat != BitmapPixelFormat.Bgra8 || 
    softwareBitmap.BitmapAlphaMode == BitmapAlphaMode.Straight) 
      { 
       softwareBitmap = SoftwareBitmap.Convert(softwareBitmap, BitmapPixelFormat.Bgra8, BitmapAlphaMode.Premultiplied); 
      } 

      var source = new SoftwareBitmapSource(); 
      await source.SetBitmapAsync(softwareBitmap); 

      // Set the source of the Image control 
      //imageControl.Source = source; 

      p1rect1.Fill = new ImageBrush 
      { 
       ImageSource = source 
      }; 
     } 

     private async void Save(object sender, RoutedEventArgs e) 
     { 
      FileSavePicker fileSavePicker = new FileSavePicker(); 
      fileSavePicker.SuggestedStartLocation = PickerLocationId.PicturesLibrary; 
      fileSavePicker.FileTypeChoices.Add("JPEG files", new List<string>() { ".jpg" , ".png"}); 
      fileSavePicker.SuggestedFileName = "image"; 

      var outputFile = await fileSavePicker.PickSaveFileAsync(); 

      if (outputFile == null) 
      { 
       // The user cancelled the picking operation 
       return; 
      } 
      // SoftwareBitmap softwareBitmap; 
      // BitmapDecoder decoder = await BitmapDecoder.CreateAsync(imageControl); 



      SaveSoftwareBitmapToFile(softwareBitmap, outputFile); 

     } 
     private async void SaveSoftwareBitmapToFile(SoftwareBitmap softwareBitmap, StorageFile outputFile) 
     { 
      using (IRandomAccessStream stream = await outputFile.OpenAsync(FileAccessMode.ReadWrite)) 
      { 
       // Create an encoder with the desired format 
       BitmapEncoder encoder = await BitmapEncoder.CreateAsync(BitmapEncoder.JpegEncoderId, stream); 

       // Set the software bitmap 
       encoder.SetSoftwareBitmap(softwareBitmap); 

       //// Set additional encoding parameters, if needed 
       //encoder.BitmapTransform.ScaledWidth = 320; 
       //encoder.BitmapTransform.ScaledHeight = 240; 
       // encoder.BitmapTransform.Rotation = Windows.Graphics.Imaging.BitmapRotation.Clockwise90Degrees; 
       encoder.BitmapTransform.InterpolationMode = BitmapInterpolationMode.Fant; 
       encoder.IsThumbnailGenerated = true; 

       try 
       { 
        await encoder.FlushAsync(); 
       } 
       catch (Exception err) 
       { 
        switch (err.HResult) 
        { 
         case unchecked((int)0x88982F81): //WINCODEC_ERR_UNSUPPORTEDOPERATION 
                 // If the encoder does not support writing a thumbnail, then try again 
                 // but disable thumbnail generation. 
          encoder.IsThumbnailGenerated = false; 
          break; 
         default: 
          throw err; 
        } 
       } 

       if (encoder.IsThumbnailGenerated == false) 
       { 
        await encoder.FlushAsync(); 
       } 


      } 
     } 
    } 
} 

Answer 1

您需要在指针移动时创建一个动态矩形。因此，您可以为您的根面板控件注册指针相关事件。

然后，您可以使用RenderTargetBitmap类生成剪切后的图片并保存。

我做了一个代码示例，供您参考：

<Canvas PointerMoved="Grid_PointerMoved" PointerReleased="Grid_PointerReleased" PointerPressed="Grid_PointerPressed"> 
    <Image x:Name="image"> 
    </Image> 
    <Rectangle x:Name="rect" StrokeThickness="4" Stroke="#FFEA18A7" Visibility="Collapsed"/> 
</Canvas> 

PointerPoint Point1, Point2; 
    SoftwareBitmap softwareBitmap; 
    private async void OpenFile() 
    { 
     FileOpenPicker fileOpenPicker = new FileOpenPicker(); 
     fileOpenPicker.SuggestedStartLocation = PickerLocationId.PicturesLibrary; 
     fileOpenPicker.FileTypeFilter.Add(".jpg"); 
     fileOpenPicker.ViewMode = PickerViewMode.Thumbnail; 

     var inputFile = await fileOpenPicker.PickSingleFileAsync(); 

     if (inputFile == null) 
     { 
      // The user cancelled the picking operation 
      return; 
     } 

     using (IRandomAccessStream stream = await inputFile.OpenAsync(FileAccessMode.Read)) 
     { 
      // Create the decoder from the stream 
      BitmapDecoder decoder = await BitmapDecoder.CreateAsync(stream); 

      // Get the SoftwareBitmap representation of the file 
      softwareBitmap = await decoder.GetSoftwareBitmapAsync(); 
     } 
     if (softwareBitmap.BitmapPixelFormat != BitmapPixelFormat.Bgra8 || 
softwareBitmap.BitmapAlphaMode == BitmapAlphaMode.Straight) 
     { 
      softwareBitmap = SoftwareBitmap.Convert(softwareBitmap, BitmapPixelFormat.Bgra8, BitmapAlphaMode.Premultiplied); 
     } 

     var source = new SoftwareBitmapSource(); 
     await source.SetBitmapAsync(softwareBitmap); 

     image.Source = source; 
    } 

    private void Grid_PointerPressed(object sender, PointerRoutedEventArgs e) 
    { 
     Point1 = e.GetCurrentPoint(image); 
    } 

    private void Grid_PointerMoved(object sender, PointerRoutedEventArgs e) 
    { 
     Point2 = e.GetCurrentPoint(image); 
    } 

    private async void Grid_PointerReleased(object sender, PointerRoutedEventArgs e) 
    { 
     Point2 = e.GetCurrentPoint(image); 
     rect.Visibility = Visibility.Visible; 
     rect.Width = (int)Math.Abs(Point2.Position.X - Point1.Position.X); 
     rect.Height = (int)Math.Abs(Point2.Position.Y - Point1.Position.Y); 
     rect.SetValue(Canvas.LeftProperty, (Point1.Position.X < Point2.Position.X) ? Point1.Position.X : Point2.Position.X); 
     rect.SetValue(Canvas.TopProperty, (Point1.Position.Y < Point2.Position.Y) ? Point1.Position.Y : Point2.Position.Y); 
     await Task.Delay(100); 
     RectangleGeometry geometry = new RectangleGeometry(); 
     geometry.Rect = new Rect(Point1.Position,Point2.Position); 
     image.Clip = geometry; 
    } 

    private async void Save() 
    { 
     RenderTargetBitmap bitmap = new RenderTargetBitmap(); 
     await bitmap.RenderAsync(image); 
     var pixelbuffer = await bitmap.GetPixelsAsync(); 
     var savefolder = ApplicationData.Current.LocalFolder; 
     var savefile = await savefolder.CreateFileAsync("snapshot.png",CreationCollisionOption.GenerateUniqueName); 
     using (var filestream = await savefile.OpenAsync(FileAccessMode.ReadWrite)) 
     { 
      var encoder = await BitmapEncoder.CreateAsync(BitmapEncoder.PngEncoderId,filestream); 
      encoder.SetPixelData(BitmapPixelFormat.Bgra8,BitmapAlphaMode.Ignore,(uint)bitmap.PixelWidth,(uint)bitmap.PixelHeight,DisplayInformation.GetForCurrentView().LogicalDpi,DisplayInformation.GetForCurrentView().LogicalDpi,pixelbuffer.ToArray()); 
      await encoder.FlushAsync(); 
     } 
    }