1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247 |
<?xml version= "1.0"
encoding= "utf-8" ?> <s:Application xmlns:fx= "http://ns.adobe.com/mxml/2009" xmlns:astion= "astions.*" minWidth= "955"
minHeight= "600" creationComplete= "init()"
xmlns:astion1= "astion.*" > <fx:Declarations> <!-- 将非可视元素(例如服务、值对象)放在此处 --> <s:Parallel id= "imgEffect"
target= "{showPic}" > <s:Move xFrom= "0"
xTo= "0"
yFrom= "0" yTo= "0" duration= "1000"
/> <s:Scale scaleXFrom= "1.0"
scaleXTo= "1.5"
scaleYFrom= "1.0"
scaleYTo= "1.5"
duration= "1000"
/> </s:Parallel> </fx:Declarations> <fx:Script> <![CDATA[ import
mx.controls.Alert; import
mx.events.MoveEvent; import
mx.graphics.ImageSnapshot; import
mx.graphics.codec.JPEGEncoder; private
var _file:FileReference; // 单个图片列表 private
var _fileList:FileReferenceList // 批量图片列表 private
var isChoice: Boolean ; // 是否裁剪图片 // private var imgData:BitmapData; // 图片bitmap数据 private
function init(): void { _file = new
FileReference(); _fileList = new
FileReferenceList(); _file.addEventListener(Event.SELECT, onSelect); _file.addEventListener(Event.COMPLETE, completeHandle); box.visible = false ; isChoice = false ; group_all.visible = false ; } // 单击选择时 private
function select(): void { var
allTypes:FileFilter = new
FileFilter( "图片类型(*.jpg; *.jpeg; *.png; *.gif)" , "*.jpg; *.jpeg; *.png; *.gif" ); _file.browse([allTypes]); } // 图片被选中时 private
function onSelect(e:Event): void { _file.load(); } // 图片加载完成时 private
function completeHandle(e:Event): void { showPic.source = _file.data; showPic.width = 400 ; showPic.height = 400 ; } // 图片裁剪 private
function cut(): void { if ( showPic.source != null ) { isChoice = true ; box.visible = true ; group_all.visible = true ; uncheckArea(); } } // 裁剪图片时,未选中部分变暗 private
function uncheckArea(): void
{ // 盒子的宽度 var
boxWidth: int
= box.boxWidth; // 盒子的高度 var
boxHeight: int
= box.boxHeight; // 盒子的坐标 var
originX: int
= box.x; var
originY: int
= box.y; // 图片显示区域的高,宽 var
imgHeight: int
=showPic.height; var
imgWidth: int
= showPic.width; //bg_1 加上10PX像素文字的高度 bg_1.height = originY - 30 ; bg_1.width = imgWidth; bg_1.x = 0 ; bg_1.y = 0 ; // bg_2 bg_2.height = boxHeight; bg_2.width = imgWidth - (originX + boxWidth); bg_2.x = originX + boxWidth; bg_2.y = originY- 30 ; // bg_3 减去10PX像素文字的高度 减去 30PX按钮栏的高度 bg_3.height = imgHeight - (originY +boxHeight- 30 ); bg_3.width = bg_1.width = imgWidth; bg_3.x = 0 ; bg_3.y = originY + boxHeight - 30 ; // bg_4 bg_4.height = boxHeight; bg_4.width = originX; bg_4.x = 0 ; bg_4.y = originY - 30 ; // bg_2.height = bg_4.height = imgHeight - (bg_3.height + bg_1.height); } // 单击预览时. 返回被选中的区域 bitmapdata; private
function preview():BitmapData { showSmallPic.source = "" ; var
bmpData:BitmapData = ImageSnapshot.captureBitmapData(showPic); var
re:Rectangle = new
Rectangle(box.x, box.y, box.boxWidth, box.boxHeight); var
byte:ByteArray = bmpData.getPixels(re); // 已经定义为全局变量,方便数据的存储操作。 // var imgData:BitmapData = new BitmapData(box.boxWidth, box.boxHeight); var
imgData:BitmapData = new
BitmapData(box.boxWidth, box.boxHeight); //当前的bytearray.position为最大长度,要设为从0开始读取 byte.position = 0 ; var
imgRe:Rectangle = new
Rectangle( 0 , 0 , box.boxWidth, box.boxHeight); imgData.setPixels(imgRe, byte); showSmallPic.source = new
Bitmap(imgData); return
imgData; /* var bmpData_2:BitmapData = new BitmapData(100, 100); var p:Point = new Point(40, 40); var area:Rectangle = new Rectangle(0, 0, 100, 100); // bmpData_2.draw(bmpData, new Matrix()); bmpData_2.copyPixels(bmpData, area, p); var bmp:Bitmap = new Bitmap(bmpData_2); showSmallPic.source = bmp; */ } // 图片保存 private
function save(): void { var
imgData:BitmapData = preview(); if (!isChoice) { Alert.show( "没有预览图片" , "提示信息" ); return ; } if (imgData != null ) { var
file:FileReference = new
FileReference(); var
date: Date = new Date (); var
ba:ByteArray = new
JPEGEncoder().encode(imgData); file.save(ba, date.fullYear.toString() + date.month.toString() + date.day.toString() + date.milliseconds.toString() + ".jpg" ); } else
{ Alert.show( "保存出错!请重试" , "提示信息" ); } } protected
function showPic_clickHandler(event:MouseEvent): void { // TODO Auto-generated method stub // imgEffect.play(null, false); showPic.width = 400 ; showPic.height = 400 ; showPic.setStyle( "backgroundAlpha" , 0.6 ); showPic.graphics.lineStyle( 1 , 0 , 100 ); showPic.graphics.lineTo( 100 , 0 ); showPic.graphics.lineTo( 100 , 50 ); showPic.graphics.lineTo( 0 , 50 ); showPic.graphics.lineTo( 0 , 0 ); } // 图片修改时防止操作图片的界限 protected
function box_moveHandler(): void { // 当选区X坐标小于图片的X坐标时 左部 if (box.x < showPic.x) { box.x = showPic.x; } // 当选区Y坐标小于图片的Y坐标时 顶部 if (box.y < (showPic.y + 30
)) { box.y = showPic.y + 30 ; } // 当选区X坐标 大于图片X坐标时 右部 if ((box.x + box.boxWidth) > (showPic.x + showPic.width)) { box.x = showPic.x + showPic.width - box.boxWidth } // 当选区Y坐标大于图片Y坐标时 底部 if ((box.y + box.boxHeight) > (showPic.y + showPic.height + 30 )) { box.y = showPic.y + showPic.height - box.boxHeight + 30 ; } // 当选区的高度大于图片的高度时 if (box.boxHeight > showPic.height) { box.boxHeight = showPic.height; } // 当选区的宽度大于图片的宽度时 if (box.boxWidth > showPic.width) { box.boxWidth = showPic.width; } // 未选中区域变色 uncheckArea(); } ]]> </fx:Script> <s:layout> <s:BasicLayout /> </s:layout> <s:Group id= "group_all"
depth= "2" y= "30" x= "0" > <s:Rect id= "bg_1"
x= "0" y= "0" width= "100"
height= "80" > <s:fill> <s:SolidColor color= "#333"
alpha= "0.6"
/> </s:fill> </s:Rect> <s:Rect id= "bg_2"
x= "0" y= "0" width= "100"
height= "80" > <s:fill> <s:SolidColor color= "#333"
alpha= "0.6"
/> </s:fill> </s:Rect> <s:Rect id= "bg_3"
x= "0" y= "0" width= "100"
height= "80" > <s:fill> <s:SolidColor color= "#333"
alpha= "0.6"
/> </s:fill> </s:Rect> <s:Rect id= "bg_4"
x= "0" y= "0" width= "100"
height= "80" > <s:fill> <s:SolidColor color= "#333"
alpha= "0.6"
/> </s:fill> </s:Rect> </s:Group> <astion1:ScaleBox id= "box"
x= "130" y= "180" width= "40" height= "40"
depth= "3" move= "box_moveHandler()"
resize= "box_moveHandler()"
/> <mx:VBox verticalGap= "0"
borderVisible= "false" > <mx:HBox> <s:Button label = "选择图片"
click= "select()"
width= "80" height= "30"
useHandCursor= "true"
buttonMode= "true"
styleName= "btnStyle"
/> <s:Button label = "图片裁剪"
click= "cut()"
width= "80" height= "30"
useHandCursor= "true"
buttonMode= "true"
styleName= "btnStyle"
/> <s:Button label = "预览"
click= "preview()"
width= "80" height= "30"
useHandCursor= "true"
buttonMode= "true"
styleName= "btnStyle"
/> <s:Button label = "另存本地"
click= "save()"
width= "80" height= "30"
useHandCursor= "true"
buttonMode= "true"
styleName= "btnStyle"
/> </mx:HBox> <mx:HBox width= "540"
height= "400"
id= "container_clip" > <s:Image id= "showPic"
y= "30" x= "0" width= "400"
height= "400"
click= "showPic_clickHandler(event)"
/> <s:Image id= "showSmallPic"
x= "440" width= "120"
height= "120"
/> </mx:HBox> <mx:HBox> </mx:HBox> </mx:VBox> <fx:Style> .btnStyle { borderVisible : true ; textAlign : center; verticalAlign : center; lineHeight : 30px; fontFamily : "宋体" , "微软雅黑" ; } .t_6 { backgroundColor : # 333 ; backgroundAlpha : 0.6 ; } </fx:Style> </s:Application> |
源码下载地址: http://pan.baidu.com/s/1cT1fS
很抱歉的说,现在没有时间写博客,怕自己忘记写了,还得继续努力,过段时间再过来修改
原文:http://www.cnblogs.com/xxjudfc/p/3661916.html