我试图将白色圆圈类型的形状与从相机拍摄的图像重叠，或者从图库中拍摄的图像，下面是代码，我执行此步骤.xam代码并且其cs代码也给出了图像也提供了forrefrences enter image description here
<Grid Name="SignUpView">
<Grid.Background>
<ImageBrush ImageSource="Assets/info_bg.png"/>
</Grid.Background>
<Grid.RowDefinitions>
<RowDefinition x:Name="rowDefHeadingGrid" Height="2.8*"/>
<RowDefinition x:Name="rowDefFormFillGrid" Height="4.4*"/>
<RowDefinition x:Name="rowDefFooterGrid" Height="0.8*"/>
</Grid.RowDefinitions>
<Grid Grid.Row="0" Background="#339FFE">
<StackPanel Orientation="Vertical" HorizontalAlignment="Center" Width="354" Height="336">
<Image Source="Assets\back_bg.png" Name="backImg" Width="40" Height="35" Margin="-280,16,0,0" />
<TextBlock Text="Sign up" Foreground="White" FontSize="22" Margin="69,-36,192,145"/>
<Image Source="Assets\pro_pic_box.png" Width="115" Height="95" Margin="117,-218,100,-30" />
<Canvas>
<Image Name="imageControl" Source="Assets\pro_pic.png" Margin="161,-107,10,10" Height="60" Width="50"/>
<Image Source="Assets\ic_profile_pic_edit.png" Margin="205,-77,10,10" Height="13" Width="13" Tapped="cameraClick">
<FlyoutBase.AttachedFlyout>
<MenuFlyout Placement="Bottom">
<MenuFlyout.MenuFlyoutPresenterStyle>
<Style TargetType="MenuFlyoutPresenter">
<Setter Property="Margin" Value="53,-10,0,0" />
<Setter Property="Background" Value="#E84C3D" />
<Setter Property="FontSize" Value="7" />
<Setter Property="BorderBrush" Value="Transparent" />
<Setter Property="MaxWidth" Value="160"/>
</Style>
</MenuFlyout.MenuFlyoutPresenterStyle>
<MenuFlyoutItem Text="Open Camera" Click="camOpen" FontSize="10" Padding="3,3,3,3" />
<MenuFlyoutItem Text="Choose from Gallery" Click="chooseGall" FontSize="10" Padding="3,3,3,3"/>
<MenuFlyoutItem Text="Cancel" Click="MenuFlyoutItem_Click" FontSize="10" Padding="3,3,3,3"/>
</MenuFlyout>
</FlyoutBase.AttachedFlyout>
</Image>
<StackPanel>
<CaptureElement Height="450" Name="captureElement"/>
</StackPanel>
<TextBlock FontSize="9" Margin="50,5,5,5" HorizontalAlignment="Center" Name="loading" VerticalAlignment="Center">Loading...</TextBlock>
</Canvas>
<TextBox x:Name="emailBox1" Text="user name" TextAlignment="Center" Foreground="White" BorderThickness="0,0,0,2" BorderBrush="White" Background="#339EFC" HorizontalAlignment="Left" Height="30" Width="260" Margin="55,-60,0,0" TextWrapping="Wrap" VerticalAlignment="Center" FontSize="14" FontFamily="Segoe UI Light" />
</StackPanel>
</Grid>
的.cs
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices.WindowsRuntime;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;
using Windows.Media.Capture;
using Windows.Media.MediaProperties;
using Windows.UI.Popups;
using Windows.Storage;
using Windows.Storage.Streams;
using Windows.Graphics.Imaging;
using Windows.UI.Xaml.Media.Imaging;
using Windows.Storage.Pickers;
using System.Threading.Tasks;
namespace CustomSplash
{
public sealed partial class signup : Page
{
public signup()
{
this.InitializeComponent();
}
private void cameraClick(object sender, TappedRoutedEventArgs e)
{
FlyoutBase.ShowAttachedFlyout(sender as FrameworkElement);
}
private async void camOpen(object sender, RoutedEventArgs e)
{
CameraCaptureUI captureUI = new CameraCaptureUI();
captureUI.PhotoSettings.Format = CameraCaptureUIPhotoFormat.Jpeg;
captureUI.PhotoSettings.CroppedSizeInPixels = new Size(200, 200);
StorageFile photo = await captureUI.CaptureFileAsync(CameraCaptureUIMode.Photo);
if (photo != null)
{
await ProcessFile(photo);
await photo.MoveAsync(KnownFolders.PicturesLibrary);
}
}
private async void chooseGall(object sender, RoutedEventArgs e)
{
var openPicker = new FileOpenPicker
{
ViewMode = PickerViewMode.Thumbnail,
SuggestedStartLocation = PickerLocationId.PicturesLibrary
};
openPicker.FileTypeFilter.Add(".jpg");
var photo = await openPicker.PickSingleFileAsync();
if (photo != null)
{
await ProcessFile(photo);
}
}
private void MenuFlyoutItem_Click(object sender, RoutedEventArgs e)
{
imageControl.Source= new BitmapImage(new Uri("ms-appx:///Assets/pro_pic.png", UriKind.Absolute));
}
private async Task ProcessFile(StorageFile photo)
{
IRandomAccessStream stream = await photo.OpenAsync(FileAccessMode.Read);
BitmapDecoder decoder = await BitmapDecoder.CreateAsync(stream);
SoftwareBitmap softwareBitmap = await decoder.GetSoftwareBitmapAsync();
SoftwareBitmap softwareBitmapBGR8 = SoftwareBitmap.Convert(softwareBitmap, BitmapPixelFormat.Bgra8, BitmapAlphaMode.Premultiplied);
SoftwareBitmapSource bitmapSource = new SoftwareBitmapSource();
await bitmapSource.SetBitmapAsync(softwareBitmapBGR8);
imageControl.Source = bitmapSource;
}
}
}
答案 0 :(得分：0)
只需使用Ellipse填充ImageBrush而不是使用imageControl。使用ImageBrush设置Ellipse的fill属性，当您更改图片时，请更新ImageBrush的ImageSource属性。
根据您的代码更改了代码，如下所示：
<!--<Image Name="imageControl" Source="Assets\pro_pic.png" Margin="161,-107,10,10" Height="60" Width="50"/>-->
<Ellipse Height="50" Width="50" StrokeThickness="2" Margin="161,-107,10,10" >
<Ellipse.Fill>
<ImageBrush x:Name="imageControl" ImageSource="Assets\pro_pic.png" />
</Ellipse.Fill>
</Ellipse>
的.cs
private async Task ProcessFile(StorageFile photo)
{
IRandomAccessStream stream = await photo.OpenAsync(FileAccessMode.Read);
BitmapDecoder decoder = await BitmapDecoder.CreateAsync(stream);
SoftwareBitmap softwareBitmap = await decoder.GetSoftwareBitmapAsync();
SoftwareBitmap softwareBitmapBGR8 = SoftwareBitmap.Convert(softwareBitmap, BitmapPixelFormat.Bgra8, BitmapAlphaMode.Premultiplied);
SoftwareBitmapSource bitmapSource = new SoftwareBitmapSource();
await bitmapSource.SetBitmapAsync(softwareBitmapBGR8);
imageControl.ImageSource= bitmapSource;
//imageControl.Source = bitmapSource;
}