WindowsPhone8中实现圆形图片的生成显示

时间:2023-03-08 22:26:52

原文 WindowsPhone8中实现圆形图片的生成显示

很多软件中(比如QQ)用到了许多圆形图片,作为用户头像等等,原始图片往往是方形的,那么怎么样将方形的图片显示成圆形呢?

一种方法是当背景为固定纯色的时候,可以使用同背景色的边框遮罩,这种方法适用性小,这里不再赘述。

我的做法是使用ArcSegment的功能来实现圆形图片的显示,ArcSegment派生自PathSegment,“~派生自 PathSegment 的类(例如 ArcSegment、BezierSegment 和 LineSegment),表示特定类型的几何图形段。”

WindowsPhone8中实现圆形图片的生成显示

PathSegment微软文档介绍

思路来源于这篇文章:WP8实现图片任意形状剪裁(C#代码实现)

主要实现代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
PathGeometry pg = new PathGeometry();
PathFigure pf1 = new PathFigure();
pf1.StartPoint = new Point(0, height / 2);
pf1.Segments.Add(new ArcSegment()
{
    IsLargeArc = true,
    Point = new Point(width, height / 2),
    Size = new Size(width / 4, height / 4),
});
pg.Figures.Add(pf1);
PathFigure pf2 = new PathFigure();
pf2.StartPoint = new Point(0, height / 2);
pf2.Segments.Add(new ArcSegment()
{
    SweepDirection = SweepDirection.Clockwise,
    IsLargeArc = true,
    Point = new Point(width, height / 2),
    Size = new Size(width / 4, height / 4),
});
pg.Figures.Add(pf2);
image.Clip = pg;

封装好的一个圆形图片控件:

CircleImage

使用方法

1:添加CircleImage.dll引用

2:xmlns:CircleImage="clr-namespace:CircleImage;assembly=CircleImage"

3:<CircleImage:CircleImage Source="test.jpg" Width="400" Height="400"/>