DrawingVisual эквивалент для UWP

Question

У меня есть растровое изображение человека, и я хотел бы нарисовать прямоугольник над лицом человека. У меня есть координаты прямоугольника (x, y, ширина, высота). Как это:

Если бы я использовал WPF, то я мог бы добиться этого с помощью DrawingVisual и DrawingContext классов. К сожалению, они недоступны в UWP. Доступны ли какие-либо эквивалентные API или, возможно, пакет NuGet для достижения той же функциональности?

Answer 1

Раствор я придумал как охватывающее изображение в Grid и размещения ItemsControl поверх него, который связан с набором прямоугольников и Canvas в качестве шаблона панели:

<Grid> 
    <Image Source="{Binding Image}" /> 
    <ItemsControl ItemsSource="{Binding Rectangles}"> 
     <ItemsControl.ItemsPanel> 
      <ItemsPanelTemplate> 
       <Canvas /> 
      </ItemsPanelTemplate> 
     </ItemsControl.ItemsPanel> 
     <ItemsControl.ItemContainerStyle> 
      <Style TargetType="ContentPresenter"> 
       <Setter Property="Helper:BindingHelper.CanvasLeftBindingPath" Value="Left" /> 
       <Setter Property="Helper:BindingHelper.CanvasTopBindingPath" Value="Top" /> 
      </Style> 
     </ItemsControl.ItemContainerStyle> 
     <ItemsControl.ItemTemplate> 
      <DataTemplate> 
       <Rectangle Width="{Binding Width}" 
          Height="{Binding Height}" 
          Stroke="{Binding Color}" 
          StrokeThickness="6"> 
       </Rectangle> 
      </DataTemplate> 
     </ItemsControl.ItemTemplate> 
    </ItemsControl> 
</Grid> 

С Binding в стиле setter не поддерживается в UWP Мне пришлось использовать привязку привязки. Подробнее об этом можно узнать здесь UWP Binding in Style Setter not working

Answer 2

Я использую пакет «WriteableBitmapEx» Nuget, который решил эту проблему. Более подробная информация http://kaki104.tistory.com/517

Пример кода:

private async void BrowseButton_Click(object sender, RoutedEventArgs e) 
{ 
    //FileOpePicker 
    var openDlg = new FileOpenPicker(); 
    openDlg.FileTypeFilter.Add(".jpg"); 
    openDlg.FileTypeFilter.Add(".jpeg"); 
    openDlg.FileTypeFilter.Add(".png"); 
    //Open file selection window 
    var result = await openDlg.PickSingleFileAsync(); 
    if (result == null || !result.IsAvailable) return; 
    var file = await StorageFile.GetFileFromPathAsync(result.Path); 
    var property = await file.Properties.GetImagePropertiesAsync(); 
    //Create bitmap from image size 
    var writeableBmp = BitmapFactory.New((int)property.Width, (int)property.Height); 
    using (writeableBmp.GetBitmapContext()) 
    { 
     //Load bitmap from image file 
     using (var fileStream = await file.OpenAsync(FileAccessMode.Read)) 
     { 
      writeableBmp = await BitmapFactory.New(1, 1).FromStream(fileStream, BitmapPixelFormat.Bgra8); 
     } 
    } 

    //find face that DetectAsync Face API 
    using (var imageFileStream = await file.OpenStreamForReadAsync()) 
    { 
     var faces = await faceServiceClient.DetectAsync(imageFileStream); 
     if (faces == null) return; 
     //display rect 
     foreach (var face in faces) 
     { 
      writeableBmp.DrawRectangle(face.FaceRectangle.Left, face.FaceRectangle.Top, 
      face.FaceRectangle.Left + face.FaceRectangle.Width, 
      face.FaceRectangle.Top + face.FaceRectangle.Height, Colors.Red); 
     } 
    } 
    FacePhoto.Source = writeableBmp; 
}