基于WPF实现用户头像选择器的示例代码

第基于WPF实现用户头像选择器的示例代码{

DefaultStyleKeyProperty.OverrideMetadata(typeof(CropAvatar),

new

FrameworkPropertyMetadata(typeof(CropAvatar)));

}

public

override

void

OnApplyTemplate()

{

base.OnApplyTemplate();

canvas

=

GetTemplateChild(CanvasTemplateName)

as

Canvas;

canvas.Loaded

+=

Canvas_Loaded;

grid

=

GetTemplateChild(GridTemplateName)

as

Grid;

image

=

GetTemplateChild(ImageTemplateName)

as

Image;

image.MouseDown

+=

Image_MouseDown;

image.MouseMove

+=

Image_MouseMove;

image.MouseUp

+=

Image_MouseUp;

image.MouseLeave

+=

Image_MouseLeave;

path

=

GetTemplateChild(PathTemplateName)

as

Path;

replaceButton

=

GetTemplateChild(ReplaceButtonTemplateName)

as

Button;

replaceButton.Click

+=

ReplaceButton_Click;

addButton

=

GetTemplateChild(AddButtonTemplateName)

as

Button;

addButton.Click

+=

AddButton_Click;

}

private

void

Canvas_Loaded(object

sender,

RoutedEventArgs

e)

{

if

(sender

is

Canvas

canvas)

{

var

width

=

canvas.ActualWidth;

var

height

=

canvas.ActualHeight;

centerX

=

(width

-

path.Width)

/

2.0d;

centerY

=

(height

-

path.Height)

/

2.0d;

canvas.Clip

=

new

RectangleGeometry(new

Rect(centerX,

centerY,

200,

200));

Canvas.SetLeft(path,

centerX);

Canvas.SetTop(path,

centerY);

Canvas.SetLeft(grid,

centerX);

Canvas.SetTop(grid,

centerY);

}

}

private

void

Image_MouseLeave(object

sender,

MouseEventArgs

e)

{

isDown

=

false;

if

(isLeft)

_StartX

=

Canvas.GetLeft(image);

else

_StartY

=

Canvas.GetTop(image);

}

private

void

Image_MouseUp(object

sender,

MouseButtonEventArgs

e)

{

if

(isDown)

{

var

vPoint

=

e.GetPosition(this);

if

(isLeft)

{

_StartX

=

Canvas.GetLeft(image);

initialX

=

voffsetX;

}

else

{

_StartY

=

Canvas.GetTop(image);

initialY

=

voffsetY;

}

}

}

private

void

Image_MouseMove(object

sender,

MouseEventArgs

e)

{

if

(e.LeftButton

==

MouseButtonState.Pressed

isDown)

{

var

vPoint

=

e.GetPosition(this);

if

(isLeft)

{

var

voffset

=

vPoint.X

-

point.X;

vNewStartX

=

_StartX

+

voffset;

var

xPath

=

Canvas.GetLeft(path);

if

(vNewStartX

=

xPath

vNewStartX

=

-(bitmapFrame.Width

-

200

-

xPath))

{

Canvas.SetLeft(image,

vNewStartX);

voffsetX

=

initialX

-

(int)voffset;

voffsetX

=

voffsetX

0

0

:

voffsetX;

crop

=

new

CroppedBitmap(bitmapFrame,

new

Int32Rect(voffsetX,

0,

_size,

_size));

}

}

else

{

var

voffset

=

vPoint.Y

-

point.Y;

vNewStartY

=

_StartY

+

voffset;

var

yPath

=

Canvas.GetTop(path);

if

(vNewStartY

=

yPath

vNewStartY

=

-(bitmapFrame.Height

-

200

-

yPath))

{

Canvas.SetTop(image,

vNewStartY);

voffsetY

=

initialY

-

(int)voffset;

voffsetY

=

voffsetY

0

0

:

voffsetY;

crop

=

new

CroppedBitmap(bitmapFrame,

new

Int32Rect(0,

voffsetY,

_size,

_size));

}

}

OutImageSource

=

crop;

}

}

private

void

Image_MouseDown(object

sender,

MouseButtonEventArgs

e)

{

isDown

=

true;

point

=

e.GetPosition(this);

}

private

void

ReplaceButton_Click(object

sender,

RoutedEventArgs

e)

{

InitialImage();

}

private

void

AddButton_Click(object

sender,

RoutedEventArgs

e)

{

InitialImage();

}

void

InitialImage()

{

vNewStartX

=

0;

vNewStartY

=

0;

var

uri

=

ControlsHelper.ImageUri();

if

(uri

==

null)

return;

var

bitmap

=

new

BitmapImage(uri);

if

(bitmap.Height

bitmap.Width)

{

double

scale

=

(double)bitmap.Width

/

(double)path.Width;

image.Width

=

_size;

image.Height

=

(double)bitmap.Height

/

scale;

isLeft

=

false;

}

else

if

(bitmap.Width

bitmap.Height)

{

double

scale

=

(double)bitmap.Height

/

(double)path.Height;

image.Width

=

(double)bitmap.Width

/

scale;

image.Height

=

_size;

isLeft

=

true;

}

bitmapFrame

=

ControlsHelper.CreateResizedImage(bitmap,

(int)image.Width,

(int)image.Height,

0);

image.Source

=

bitmapFrame;

if

(image.Source

!=

null)

{

replaceButton.Visibility

=

Visibility.Visible;

addButton.Visibility

=

Visibility.Collapsed;

}

Canvas.SetLeft(grid,

centerX);

Canvas.SetTop(grid,

centerY);

_StartX

=

(canvas.ActualWidth

-

image.Width)

/

2.0d;

_StartY

=

(canvas.ActualHeight

-

image.Height)

/

2.0d;

Canvas.SetLeft(image,

_StartX);

Canvas.SetTop(image,

_StartY);

if

(isLeft)

{

initialX

=

(int)(image.Width

-

200)

/

2;

initialY

=

0;

crop

=

new

CroppedBitmap(bitmapFrame,

new

Int32Rect(initialX,

0,

_size,

_size));

}

else

{

initialY

=

(int)(image.Height

-

200)

/

2;

initialX

=

0;

crop

=

new

CroppedBitmap(bitmapFrame,

new

Int32Rect(0,

initialY,

_size,

_size));

}

OutImageSource

=

crop;

}

}

}

3）CropAvatarWindow.xaml使用如下；

ws:Window

x:

xmlns="/winfx/2006/xaml/presentation"

xmlns:x="/winfx/2006/xaml"

xmlns:d="/expression/blend/2008"

xmlns:mc="/markup-compatibility/2006"

xmlns:wpfdev="/WPFDevelopersOrg/WPFDevelopers"

xmlns:ws="/WPFDevelopersOrg.WPFDevelopers.Minimal"

mc:Ignorable="d"

WindowResizeMode="NoResize"

WindowStartupLocation="CenterScreen"

Title="WPF

开发者-头像选择器"

Height="450"

Width="800"

Grid

Grid.ColumnDefinitions

ColumnDefinition/

ColumnDefinition/

/Grid.ColumnDefinitions

Grid.RowDefinitions

RowDefinition/

RowDefinition

Height="Auto"/

/Grid.RowDefinitions

wpfdev:CropAvatar

x:Name="MyCropAvatar"/

Image

Grid.Column="1"

Name="CropAvatarImage"

Source="{Binding

ElementName=MyCropAvatar,Path=OutImageSource}"

Stretch="Fill"

Width="200"

Height="200"

Image.Clip

EllipseGeometry

Center="100,100"

RadiusX="100"

RadiusY="100"/

/Image.Clip

/Image

UniformGrid

Grid.Row="1"

Grid.ColumnSpan="2"

HorizontalAlignment="Center"

VerticalAlignment="Center"

Button

Content="保存"

Click="btnSave_Click"

Margin="4,0"/

Button

Content="关闭"

Click="btnClose_Click"

Margin="4,0"/

/UniformGrid

/Grid

/ws:Window

4）CropAvatarWindow.xaml.cs代码如下；

using

System.Windows;

namespace

WPFDevelopers.Samples.ExampleViews

///

summary

///

CropAvatarWindow.xaml

的交互逻辑

///

/summary

public

partial

class

CropAvatarWindow

{

public

CropAvatarWindow()

{

InitializeComponent();

}

private

void

btnSave_Click(object

sender,

RoutedEventArgs

e)

{

DialogResult

=

true;

}

private

void

btnClose_Click(object

sender,

RoutedEventArgs

e)

{

DialogResult

=

false;

}

}

}

5）CropAvatarExample.xaml使用如下；

UserControl

x:

xmlns="/winfx/2006/xaml/presentation"

xmlns:x="/winfx/2006/xaml"

xmlns:mc="/markup-compatibility/2006"

xmlns:d="/expression/blend/2008"

xmlns:wpfdev="/WPFDevelopersOrg/WPFDevelopers"

xmlns:local="clr-namespace:WPFDevelopers.Samples.ExampleViews"

mc:Ignorable="d"

d:DesignHeight="450"

d:DesignWidth="800"

Grid

Grid.ColumnDefinitions

ColumnDefinition/

ColumnDefinition/

/Grid.ColumnDefinitions

Button

Content="图像选择器"

VerticalAlignment="Center"

HorizontalAlignment="Center"

Click="Button_Click"/

Image

Grid.Co