<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
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>
@namespace s "library://ns.adobe.com/flex/spark";
@namespace mx "library://ns.adobe.com/flex/mx";
.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

很抱歉的说,现在没有时间写博客,怕自己忘记写了,还得继续努力,过段时间再过来修改

关于使用Flex中图片处理的更多相关文章

  1. Flex中NetConnection与NetStream的关系、及浏览器并发连接数测试[转]

    最近在做一个基于BS结构的视频会议系统,决定采用开源的FluorineFx.net与Flex结合的方法进行开发,前期开发都非常顺利,包括同步白板等.但到了实时视频传输的时候,原本设计是每个客户端可以显 ...

  2. JS 与Flex交互:html中的js 与flex中的actionScript通信

    Flex与JavaScript交互的问题,这里和大家分享一下,主要包括Flex调用JavaScript中的函数和JavaScript调用Flex中的函数两大部分内容. Flex 与JavaScript ...

  3. iOS 解决LaunchScreen中图片加载黑屏问题

    iOS 解决LaunchScreen中图片加载黑屏问题 原文: http://blog.csdn.net/chengkaizone/article/details/50478045 iOS 解决Lau ...

  4. div+css:div中图片垂直居中

    div中图片垂直居中 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> &l ...

  5. iOS相册中图片按照时间排序

    ios相册默认是按照时间从过去到现在排列,图片顺序有正序和逆序,group可以用以下方法来选择顺序 /** @param NSIndexSet 需要获取的相册中图片范围 @param NSEnumer ...

  6. js获取页面中图片的总数

    查看效果:http://keleyi.com/keleyi/phtml/image/9.htm 下面是完整代码: <html><body><div id="ke ...

  7. 关于Android中图片大小、内存占用与drawable文件夹关系的研究与分析

    原文:关于Android中图片大小.内存占用与drawable文件夹关系的研究与分析 相关: Android drawable微技巧,你所不知道的drawable的那些细节 经常会有朋友问我这个问题: ...

  8. Android ListView滑动过程中图片显示重复错乱闪烁问题解决

    最新内容建议直接访问原文:Android ListView滑动过程中图片显示重复错乱闪烁问题解决 主要分析Android ListView滚动过程中图片显示重复.错乱.闪烁的原因及解决方法,顺带提及L ...

  9. IOS中图片拉伸技巧与方法总结(转载)

    以下内容转载自:http://my.oschina.net/u/2340880/blog/403996 IOS中图片拉伸技巧与方法总结 一.了解几个图像拉伸的函数和方法 1.直接拉伸法 简单暴力,却是 ...

随机推荐

  1. QT相关书籍

    文章转载自:http://www.cctry.com/thread-290005-1-1.html 最近一段时间,陆陆续续给大家更新了不少基于Qt开发的不错的书籍,可以说每本都不错.不过放在这一堆大家 ...

  2. 【转载】让KVM虚机能使用音箱与麦克风(vnc及ac97)

    让KVM虚机能使用音箱与麦克风(vnc及ac97) 原 tantexian 发布于 2016/02/29 16:32 字数 462 阅读 164 收藏 0 点赞 1 评论 0 为什么80%的码农都做不 ...

  3. [转载]性能测试工具 2 步解决 too many open files 的问题,让服务器支持更多连接数

    [转载]性能测试工具 2 步解决 too many open files 的问题,让服务器支持更多连接数 大话性能 · 2018年10月09日 · 最后由 大话性能 回复于 2018年10月09日 · ...

  4. liveCD版: CD光盘映像,和liveDVD一样,唯一的区别就是该版本中包含的软件包会少一点,安装系统时使用 U 盘或者CD光盘进行安装。

    https://man.linuxde.net/download/CentOS/ CentOS,英文全称"Community Enterprise Operating System" ...

  5. SPI认识

    SPI分为好几种模式 不同模式下   读取数据时  SCK线的状态不一样 STM32硬件SPI   有16BIT  8BIT的两种模式 既  收发都是8或16bit SPI缺少响应反馈机制  无法知道 ...

  6. KEIL-C下数组指针与指针数组实验

    http://blog.csdn.net/men_wen/article/details/52694069 第一个: 数组指针的小实验 用指针传递参数 结果:  第二个: 数组指针实验 定义一个指针 ...

  7. [Django高级之forms组件]

    [Django高级之forms组件] forms组件之校验字段 # 第一步:定义一个类,继承forms.Form # 第二步:在类中写字段,要校验的字段,字段属性就是校验规则 # 第三步:实例化得到一 ...

  8. Jenkins 基础篇 - 任务创建

    前面了解了 Jenkins 上各种任务的区别后,我们就来实践应用下,先创建一个[文件夹]类型的任务,将我们目前的一些基础的演示任务[移动]到文件夹里面去,这样可以先做个简单的分类. 新建一个[文件夹] ...

  9. Kali Linux 2021.2 发布 (Kaboxer, Kali-Tweaks, Bleeding-Edge & Privileged Ports)

    Kali Linux 简介 Kali Linux 是基于 Debian 的 Linux 发行版,旨在进行高级渗透测试和安全审核.Kali Linux 包含数百种工具,可用于各种信息安全任务,例如渗透测 ...

  10. Pandas之:Pandas高级教程以铁达尼号真实数据为例

    Pandas之:Pandas高级教程以铁达尼号真实数据为例 目录 简介 读写文件 DF的选择 选择列数据 选择行数据 同时选择行和列 使用plots作图 使用现有的列创建新的列 进行统计 DF重组 简 ...