3

私は 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;

50 などの多数の画像に対してこれを行う必要がある場合、パフォーマンスにどのような影響があるかを知りたいです。

4

3 に答える 3

16

クリッピングを使用して、コントロールの部分領域を表示します。

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

Center、RadiusX、RadiusY を都合のよいように変更します。

于 2013-08-26T06:59:41.283 に答える
3

要件に合わせて、次のコード スニペットを使用します。

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

それが役に立てば幸い。

于 2013-08-26T05:31:32.427 に答える
0

この質問は既に回答されています。詳細を確認したい場合は、こちらをご覧ください 。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>
于 2014-03-26T22:13:38.443 に答える