Windows Phone에서 이미지를 동그라미로 표시

Question

WP (7.1 + 8) 앱을 만들면 Google+에서와 같이 원 안에 이미지를 표시해야합니다.
나는 다음과 같은 코드를 통해 작업을 수행하기 위해 GradientBrush를 사용하는 솔루션을 발견 : -

BitmapImage bitmapImage = new BitmapImage(); 
bitmapImage.UriSource = new Uri("http://url-of-the-image", UriKind.Absolute); 
image.CacheMode = new BitmapCache(); 
image.Source = bitmapImage; 
image.Stretch = Stretch.UniformToFill; 
image.VerticalAlignment = System.Windows.VerticalAlignment.Center; 

//Setting up the mask 
RadialGradientBrush opacityMask = new RadialGradientBrush(); 
GradientStop gs1 = new GradientStop(); 
GradientStop gs2 = new GradientStop(); 
GradientStop gs3 = new GradientStop(); 
gs1.Color = Color.FromArgb(255, 0, 0, 0); 
gs1.Offset = 0.0; 
gs2.Color = Color.FromArgb(255, 0, 0, 0); 
gs2.Offset = 0.999; 
gs3.Color = Color.FromArgb(0, 0, 0, 0); 
gs3.Offset = 1.0; 
opacityMask.GradientStops.Add(gs1); 
opacityMask.GradientStops.Add(gs2); 
opacityMask.GradientStops.Add(gs3); 
image.OpacityMask = opacityMask; 

나는 성능 영향 일 무슨 나는 이미지의 많은 수에서이 작업을 수행하기 위해 필요한 경우 알고 싶어요 , say 50.

Answer 1

클리핑을 사용하여 컨트롤의 부분 영역을 표시합니다.

<Image Source="YouImage.jpg"> 
    <Image.Clip> 
     <EllipseGeometry Center="50,50" RadiusX="50" RadiusY="50" /> 
    </Image.Clip> 
</Image> 

편의를 위해 Center, RadiusX 및 RadiusY를 변경하십시오.

Answer 2

요구 사항에 맞는 다음 코드 스 니펫을 사용하십시오.

<Ellipse Height="300" Width="300"> 
     <Ellipse.Fill> 
      <ImageBrush ImageSource="images/WmDev.jpg" AlignmentX="Center" AlignmentY="Center" /> 
     </Ellipse.Fill> 
</Ellipse> 

희망 하시겠습니까?

Answer 3

당신이 다음 here 는 XAML 솔루션이 될 것입니다 모양을 가질 수 더 자세하게보고 싶다면 이미 여전히 대답이다이 질문에,

<Image Source=”{Binding Converter={StaticResource ContactPictureConverter}}” Width=”48″ Height=”48″ Stretch=”Fill” 
> 

<Image.Clip> 

<EllipseGeometry Center=”24,24″ RadiusX=”24″ RadiusY=”24″ /> 

</Image.Clip> 

</Image>