Win10 for Phone 裁剪控件
<Page.BottomAppBar>
<CommandBar x:Name="appBar">
<AppBarButton Label="裁切" Icon="Crop" Click="AppBarButton_Crop_Click">
</AppBarButton>
<AppBarButton Label="完成" Icon="Accept" Click="AppBarButton_Accept_Click">
</AppBarButton>
</CommandBar>
</Page.BottomAppBar> <Grid x:Name="LayoutRoot" Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Image Name="CroppedImage"
Grid.Row=""
CacheMode="BitmapCache" ManipulationMode="All"
PointerPressed="CroppedImage_PointerPressed"
PointerReleased="CroppedImage_PointerReleased"
PointerMoved="CroppedImage_PointerMoved">
<!--<Image.Clip>
<RectangleGeometry x:Name="ClipRect"/>
</Image.Clip>-->
</Image>
<Canvas Name="CropCanvas"
Grid.RowSpan="">
<Rectangle Name="LeftBack"
HorizontalAlignment="Left"
VerticalAlignment="Top"
Fill="#99000000"
IsHitTestVisible="False"/>
<Rectangle Name="TopBack"
HorizontalAlignment="Left"
VerticalAlignment="Top"
Fill="#99000000"
IsHitTestVisible="False"/>
<Rectangle Name="RightBack"
HorizontalAlignment="Left"
VerticalAlignment="Top"
Fill="#99000000"
IsHitTestVisible="False"/>
<Rectangle Name="BottomBack"
HorizontalAlignment="Left"
VerticalAlignment="Top"
Fill="#99000000"
IsHitTestVisible="False"/>
<TextBlock Name="SizeLabel"
Width=""
TextAlignment="Right"
FontSize=""
Foreground="Gray"
IsHitTestVisible="False"
FontFamily="{StaticResource PhoneFontFamilyNormal}"/>
<Rectangle Name="TL"
Height=""
HorizontalAlignment="Left"
VerticalAlignment="Top"
Width=""
StrokeThickness=""
Stroke="Transparent"
IsHitTestVisible="False"
Fill="Transparent"
Canvas.Left="{x:Bind PinTL.Left,Mode=OneWay}"
Canvas.Top="{x:Bind PinTL.Top,Mode=OneWay}"/>
<Rectangle Name="TR"
Height=""
HorizontalAlignment="Left"
VerticalAlignment="Top"
Width=""
StrokeThickness=""
Stroke="Transparent"
IsHitTestVisible="False"
Fill="Transparent"
Canvas.Left="{x:Bind PinTR.Left,Mode=OneWay}"
Canvas.Top="{x:Bind PinTR.Top,Mode=OneWay}"/>
<Rectangle Name="BL"
Height=""
HorizontalAlignment="Left"
VerticalAlignment="Top"
Width=""
StrokeThickness=""
Stroke="Transparent"
IsHitTestVisible="False"
Fill="Transparent"
Canvas.Left="{x:Bind PinBL.Left,Mode=OneWay}"
Canvas.Top="{x:Bind PinBL.Top,Mode=OneWay}"/>
<Rectangle Name="BR"
Height=""
HorizontalAlignment="Left"
VerticalAlignment="Top"
Width=""
StrokeThickness=""
Stroke="Transparent"
IsHitTestVisible="False"
Fill="Transparent"
Canvas.Left="{x:Bind PinBR.Left,Mode=OneWay}"
Canvas.Top="{x:Bind PinBR.Top,Mode=OneWay}"/>
</Canvas>
</Grid>
#region 常量
private Rectangle activePin; private const double doublePinSize = ; private const double halfPinSize = ; private bool isNew; private double minHeight; private double minWidth; private bool moveRect; private Point offset; private PinRect PinBL; private PinRect PinBR; private const double pinSize = ; private PinRect PinTL; private PinRect PinTR; private int realHeight; private int realWidth; private double scale; private int startX; private int startY; private Point tapDiff; #endregion
BitmapImage mSourceBitmap;
public PhotoChooserPage()
{
this.InitializeComponent(); SizeChangedEventHandler sizeChangedEventHandler = null; this.tapDiff = new Point(, );
this.scale = ;
this.minWidth = ;
this.minHeight = ;
this.PinTL = new PinRect();
this.PinBL = new PinRect();
this.PinTR = new PinRect();
this.PinBR = new PinRect();
this.TL.DataContext = this.PinTL;
this.BL.DataContext = this.PinBL;
this.TR.DataContext = this.PinTR;
this.BR.DataContext = this.PinBR;
Image croppedImage = this.CroppedImage;
if (sizeChangedEventHandler == null)
{
sizeChangedEventHandler = (object s, SizeChangedEventArgs e) => this.InitImage();
}
croppedImage.SizeChanged += sizeChangedEventHandler; }
private void InitImage()
{
if (this.isNew)
{
this.isNew = false;
GeneralTransform visual = this.CroppedImage.TransformToVisual(Window.Current.Content);
this.offset = visual.TransformPoint(new Point(, ));
Size renderSize = this.CroppedImage.RenderSize;
this.scale = renderSize.Width / (double)mSourceBitmap.PixelWidth;
double num = this.scale * ;
ForUserInit();
}
}
void ForUserInit()
{
this.minWidth = ;
this.minHeight = ; Size renderSize = this.CroppedImage.RenderSize;
double left = ;
double right = ; if (renderSize.Width > )
left = (renderSize.Width - ) / ; if (renderSize.Height > )
right = (renderSize.Height - ) / ; double x = this.offset.X + left;
double y = this.offset.Y + right; //左上角
this.PinTL.RealLeft = x;
this.PinTL.RealTop = y; //左下角
this.PinBL.RealLeft = x;
this.PinBL.RealTop = y + this.minHeight - ; //右上角
this.PinTR.RealLeft = x + this.minWidth - ;
this.PinTR.RealTop = y; //右下角
this.PinBR.RealLeft = x + this.minWidth - ;
this.PinBR.RealTop = y + this.minHeight - ;
this.CroppedImage_PointerMoved(null, null);
} protected override void OnNavigatedTo(NavigationEventArgs e)
{
if (e.NavigationMode == NavigationMode.New)
{
// 如果用户选择了图片，则显示在屏幕上
mSourceBitmap = e.Parameter as BitmapImage;
//CroppedImage
CroppedImage.Source = mSourceBitmap;
isNew = true;
}
} private void CroppedImage_PointerPressed(object sender, PointerRoutedEventArgs e)
{
Point position = e.GetCurrentPoint(this.CroppedImage).Position;
this.activePin = null;
this.moveRect = false;
if (this.IsRectTapped(position.X + this.offset.X, position.Y + this.offset.Y))
{
this.moveRect = true;
}
if (this.IsPinTapped(this.PinTL, position.X + this.offset.X, position.Y + this.offset.Y))
{
this.activePin = this.TL;
}
if (this.IsPinTapped(this.PinTR, position.X + this.offset.X, position.Y + this.offset.Y))
{
this.activePin = this.TR;
}
if (this.IsPinTapped(this.PinBL, position.X + this.offset.X, position.Y + this.offset.Y))
{
this.activePin = this.BL;
}
if (this.IsPinTapped(this.PinBR, position.X + this.offset.X, position.Y + this.offset.Y))
{
this.activePin = this.BR;
}
} private void CroppedImage_PointerReleased(object sender, PointerRoutedEventArgs e)
{
this.moveRect = false;
this.activePin = null;
} private void CroppedImage_PointerMoved(object sender, PointerRoutedEventArgs e)
{
Point position;
if (e != null)
{
position = e.GetCurrentPoint(this.CroppedImage).Position;
}
else
{
Point point = new Point();
position = point;
}
Point point1 = position;
double x = point1.X + this.offset.X + this.tapDiff.X;
double y = point1.Y + this.offset.Y + this.tapDiff.Y;
double realLeft = this.PinBR.RealLeft - this.PinTL.RealLeft;
double realTop = this.PinBR.RealTop - this.PinTL.RealTop; if (this.activePin == null)
{
if (this.moveRect)
{
if (x < this.offset.X)
{
x = this.offset.X;
}
Size renderSize = this.CroppedImage.RenderSize;
if (x > this.offset.X + renderSize.Width - realLeft - )
{
Size size = this.CroppedImage.RenderSize;
x = this.offset.X + size.Width - realLeft - ;
}
if (y < this.offset.Y)
{
y = this.offset.Y;
}
Size renderSize1 = this.CroppedImage.RenderSize;
if (y > this.offset.Y + renderSize1.Height - realTop - )
{
Size size1 = this.CroppedImage.RenderSize;
y = this.offset.Y + size1.Height - realTop - ;
}
this.PinTL.RealLeft = x;
this.PinTL.RealTop = y;
this.PinBL.RealLeft = x;
this.PinBL.RealTop = y + realTop;
this.PinBR.RealLeft = x + realLeft;
this.PinBR.RealTop = y + realTop;
this.PinTR.RealLeft = x + realLeft;
this.PinTR.RealTop = y;
}
}
else
this.MoveInRatio(x, ); Point imageSize = this.GetImageSize();
this.LeftBack.SetValue(Canvas.LeftProperty, this.offset.X);
this.LeftBack.SetValue(Canvas.TopProperty, this.offset.Y);
this.LeftBack.Height = Math.Max(, Math.Ceiling(imageSize.Y));
this.LeftBack.Width = Math.Max(, (double)this.PinTL.Left - this.offset.X); this.RightBack.SetValue(Canvas.LeftProperty, (double)this.PinBR.Left + );
this.RightBack.SetValue(Canvas.TopProperty, this.offset.Y);
this.RightBack.Height = Math.Max(, Math.Ceiling(imageSize.Y));
this.RightBack.Width = Math.Max(, Math.Ceiling(imageSize.X) + this.offset.X - - (double)this.PinBR.Left); this.TopBack.SetValue(Canvas.LeftProperty, (double)this.PinTL.Left);
this.TopBack.SetValue(Canvas.TopProperty, this.offset.Y);
this.TopBack.Height = Math.Max(, (double)this.PinTL.Top - this.offset.Y);
this.TopBack.Width = Math.Max(, (double)(this.PinBR.Left - this.PinTL.Left) + ); this.BottomBack.SetValue(Canvas.LeftProperty, (double)this.PinTL.Left);
this.BottomBack.SetValue(Canvas.TopProperty, (double)this.PinBR.Top + );
this.BottomBack.Height = Math.Max(, Math.Ceiling(imageSize.Y) + this.offset.Y - - (double)this.PinBR.Top);
this.BottomBack.Width = Math.Max(, (double)(this.PinBR.Left - this.PinTL.Left) + ); realLeft = this.PinBR.RealLeft - this.PinTL.RealLeft;
realTop = this.PinBR.RealTop - this.PinTL.RealTop; this.startX = (int)Math.Round((this.PinTL.RealLeft - this.offset.X) / this.scale);
this.startY = (int)Math.Round((this.PinTL.RealTop - this.offset.Y) / this.scale);
this.realWidth = (int)Math.Round((realLeft + ) / this.scale);
this.realHeight = (int)Math.Round((realTop + ) / this.scale);
}
private Point GetImageSize()
{
Size renderSize = this.CroppedImage.RenderSize;
if (renderSize.Height == )
{
Size size = this.CroppedImage.RenderSize;
if (size.Width == )
{
return new Point(this.CroppedImage.ActualWidth, this.CroppedImage.ActualHeight);
}
}
Size renderSize1 = this.CroppedImage.RenderSize;
Size size1 = this.CroppedImage.RenderSize;
return new Point(renderSize1.Width, size1.Height);
}
private bool IsPinTapped(PinRect pin, double left, double top)
{
bool flag;
if (left < pin.RealLeft - || left > pin.RealLeft + || top < pin.RealTop - )
{
flag = false;
}
else
{
flag = top <= pin.RealTop + ;
}
bool flag1 = flag;
if (flag1)
{
this.tapDiff = new Point(pin.RealLeft - left, pin.RealTop - top);
}
return flag1;
}
private bool IsRectTapped(double left, double top)
{
Rect rect = new Rect(this.PinTL.RealLeft, this.PinTL.RealTop, this.PinBR.RealLeft + , this.PinBR.RealTop + );
bool flag = rect.Contains(new Point(left, top));
if (flag)
{
this.tapDiff = new Point(this.PinTL.RealLeft - left, this.PinTL.RealTop - top);
}
return flag;
}
private void MoveInRatio(double y, double rate)
{
if (this.activePin.Equals(this.BR))
{
double x = y;
double realLeft = (x + - this.PinTL.RealLeft) / rate + this.PinTL.RealTop - ;
Size renderSize = this.CroppedImage.RenderSize;
if (x > this.offset.X + renderSize.Width - )
{
Size size = this.CroppedImage.RenderSize;
x = this.offset.X + size.Width - ;
realLeft = (x + - this.PinTL.RealLeft) / rate + this.PinTL.RealTop - ;
}
Size renderSize1 = this.CroppedImage.RenderSize;
if (realLeft > this.offset.Y + renderSize1.Height - )
{
Size size1 = this.CroppedImage.RenderSize;
realLeft = this.offset.Y + size1.Height - ;
x = (realLeft + - this.PinTL.RealTop) * rate + this.PinTL.RealLeft - ;
}
if (x < this.PinTL.RealLeft + this.minWidth - )
{
x = this.PinTL.RealLeft + this.minWidth - ;
realLeft = this.PinTL.RealTop + this.minHeight - ;
}
this.PinTR.RealLeft = x;
this.PinBL.RealTop = realLeft;
this.PinBR.RealLeft = x;
this.PinBR.RealTop = realLeft;
}
if (this.activePin.Equals(this.TR))
{
double realTop = y;
double num = this.PinBL.RealTop - (realTop + - this.PinBL.RealLeft) / rate + ;
Size renderSize2 = this.CroppedImage.RenderSize;
if (realTop > this.offset.X + renderSize2.Width - )
{
Size size2 = this.CroppedImage.RenderSize;
realTop = this.offset.X + size2.Width - ;
num = this.PinBL.RealTop - (realTop + - this.PinBL.RealLeft) / rate + ;
}
if (num < this.offset.Y)
{
num = this.offset.Y;
realTop = (this.PinBL.RealTop - num + ) * rate + this.PinBL.RealLeft - ;
}
if (realTop < this.PinBL.RealLeft + this.minWidth - )
{
realTop = this.PinBL.RealLeft + this.minWidth - ;
num = this.PinBL.RealTop - this.minHeight + ;
}
this.PinBR.RealLeft = realTop;
this.PinTL.RealTop = num;
this.PinTR.RealLeft = realTop;
this.PinTR.RealTop = num;
}
if (this.activePin.Equals(this.TL))
{
double realLeft1 = y;
double realTop1 = this.PinBR.RealTop - (this.PinBR.RealLeft + - realLeft1) / rate + ;
if (realLeft1 > this.PinBR.RealLeft + - this.minWidth)
{
realLeft1 = this.PinBR.RealLeft + - this.minWidth;
realTop1 = this.PinBR.RealTop + - this.minHeight;
}
if (realTop1 < this.offset.Y)
{
realTop1 = this.offset.Y;
realLeft1 = this.PinBR.RealLeft + - (this.PinBR.RealTop - realTop1 + ) * rate;
}
if (realLeft1 < this.offset.X)
{
realLeft1 = this.offset.X;
realTop1 = this.PinBR.RealTop - (this.PinBR.RealLeft + - realLeft1) / rate + ;
}
this.PinBL.RealLeft = realLeft1;
this.PinTR.RealTop = realTop1;
this.PinTL.RealLeft = realLeft1;
this.PinTL.RealTop = realTop1;
}
if (this.activePin.Equals(this.BL))
{
double x1 = y;
double num1 = (this.PinTR.RealLeft + - x1) / rate + this.PinTR.RealTop - ;
if (x1 > this.PinTR.RealLeft + - this.minWidth)
{
x1 = this.PinTR.RealLeft + - this.minWidth;
num1 = this.PinTR.RealTop + this.minHeight - ;
}
Size renderSize3 = this.CroppedImage.RenderSize;
if (num1 > this.offset.Y + renderSize3.Height - )
{
Size size3 = this.CroppedImage.RenderSize;
num1 = this.offset.Y + size3.Height - ;
x1 = this.PinTR.RealLeft - (num1 + - this.PinTR.RealTop) * rate + ;
}
if (x1 < this.offset.X)
{
x1 = this.offset.X;
num1 = (this.PinTR.RealLeft + - x1) / rate + this.PinTR.RealTop - ;
}
this.PinTL.RealLeft = x1;
this.PinBR.RealTop = num1;
this.PinBL.RealLeft = x1;
this.PinBL.RealTop = num1;
}
}
public static WriteableBitmap writeableBmp;
private async void AppBarButton_Crop_Click(object sender, RoutedEventArgs e)
{ } private void AppBarButton_Accept_Click(object sender, RoutedEventArgs e)
{ }
Win10 for Phone 裁剪控件的更多相关文章
- Android开发技巧——定制仿微信图片裁剪控件
拍照--裁剪,或者是选择图片--裁剪,是我们设置头像或上传图片时经常需要的一组操作.上篇讲了Camera的使用,这篇讲一下我对图片裁剪的实现. 背景 下面的需求都来自产品. 裁剪图片要像微信那样,拖动 ...
- [UWP]如何实现UWP平台最佳图片裁剪控件
前几天我写了一个UWP图片裁剪控件ImageCropper(开源地址),自认为算是现阶段UWP社区里最好用的图片裁剪控件了,今天就来分享下我编码的过程. 为什么又要造轮子 因为开发需要,我们需要使用一 ...
- win10 uwp 绘图 Line 控件使用
本文主要讲一个在绘图中,我们会有一个基础的控件,Line.控件的基本使用和他能做出的我们很多时候需要的界面. 虽然是一个简单控件,但是可以做出很诡异的很好看的UI. 首先,我们要知道,Line就是画直 ...
- 基于PhotoView的头像/圆形裁剪控件
常见的图片裁剪有两种,一种是图片固定,裁剪框移动放缩来确定裁剪区域,早期见的比较多,缺点在于不能直接预览裁剪后的效果:还有一种现在比较普遍了,就是裁剪框固定,直接拖动缩放图片,便于预览裁剪结果. 我做 ...
- Win10系列：JavaScript 控件的使用
向页面中添加的控件可分为两种类型:标准的HTML控件和WinJS库控件.其中标准的HTML控件是指HTML标准中定义的基本控件,如按钮和复选框:WinJS库控件是为开发基于JavaScript 的Wi ...
- 在win10 + ie11上使用控件
1.1. 在Win10+IE11上提示创建文件错误的问题 解决方法: 1.打开Internet选项 2.取消勾选启用保护模式 选择"不再显示此消息"
- Win10 UI入门 圆形控件
动态模版绑定 http://blog.csdn.net/XXChen2/article/details/4552554
- 【Win10】SplitView控件
SplitView是Win10中的新控件. 用于呈现两部分视图. 一个视图是主要内容,另一个视图是用于导航.(也就是通常说的汉堡菜单.) 主要结构: <SplitView> <Spl ...
- WPF自定义控件与样式(11)-等待/忙/正在加载状态-控件实现
一．前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要有三种实现方式 ...
随机推荐
- putty快速设置本地代理
sudo plink -D 127.0.0.1:8888 -l root -P 443 -pw xxx 104.xxx.xxx.xxx
- php在centos下的脚本没有解析的问题
如题,参考了许多,比如:http://serverfault.com/questions/523131/php5-is-installed-but-apache-is-displaying-php-a ...
- ndk学习10: linux文件系统
画了一天的思维导图,好累啊 一.概述 二.文件IO 三.缓冲区输入输出 四.高级IO 五.文件和目录 来自为知笔记(Wiz)
- zabbix3.0报错记录
一.问题描述 在zabbix_server添加变量时,出现了以下的报错,
- Unity3d 怪物死亡燃烧掉效果
效果 BurnToFadeOut.shader代码 Shader "BurnToFadeOut" { Properties { _StartColor ("Start C ...
- Effective C++ -----条款22：将成员变量声明为private
切记将成员变量声明为private.这可赋予客户访问数据的一致性.可细微划分访问控制.允诺约束条件获得保证,并提供class作者以充分的实现弹性. protected并不比public更具有封装性.
- Mac会给你一些欣喜
Mac会给你一些欣喜 以前一直没有用过Mac,一直都是用Windows的电脑,只是偶尔会去用Ubuntu这样的Linux系统.Mac OS 确实是一只可以给你欣喜的系统. 上周拿到公司分发的Mac,到 ...
- ExpandableListView的用法
ExpandableListView组件是android中一个比较常用的组件,当点击一个父item的时候可以将它的子item显示出来,像手机QQ中的好友列表就是实现的类型效果.使用Expandable ...
- 【leetcode】Remove Nth Node From End of List（easy）
Given a linked list, remove the nth node from the end of list and return its head. For example, Give ...
- 【leetcode】Next Permutation（middle）
Implement next permutation, which rearranges numbers into the lexicographically next greater permuta ...