Flex中鼠标滑轮控制图片大小- - JavaEye技术网站
??

??? 前两天给我的FLEX博客()加了一个鼠标滑动条控制图片大小的功能,主要是通过在图片上加鼠标滑轮滚动事件,然后根据滑轮滚动时,获得那个刻度上的值(滑轮向上滚为正值,向下滚为负值),然后再动态调整图片的长和宽。

? ?下面把代码贴出来一下:

?

<?xml version="1.0" encoding="utf-8"?>
<mx:TitleWindow xmlns:mx="http://www.adobe.com/2006/mxml" 
	            layout="absolute" width="500" height="500" 
	            backgroundColor="#0A7276" toolTip="鼠标滑轮滚动可以控制图片大小"
	               showCloseButton="true"
	            close="closeWindow()"
	            initialize="init()"
	            borderColor="#0A7276"
	            headerHeight="20"
	            title="{imgname}"
	            >
	<mx:Script>
		<![CDATA[
			import mx.controls.Alert;
		                import mx.managers.PopUpManager;
			private function closeWindow():void{
			       mx.managers.PopUpManager.removePopUp(this);
			}
			
			[Bindable]
			private var source:String;
			
			[Bindable]
			private var imgname:String;
			
			private function init():void{
				this.width=this.screen.width-300;
				this.height=this.screen.height-50;
			                this.x=(this.screen.width-this.width)/2;
	    	    		this.y=(this.screen.height-this.height)/2;
	    	    		source=LatestImage.path;
				imgname=LatestImage.iname;
				addEventListernerToImage();
			}
			
			private function showSrcpage():void{
				  var u:URLRequest=new URLRequest(image.source.toString());
	        			  navigateToURL(u,'_blank');
			}
			
			private function addEventListernerToImage():void{
			    this.addEventListener(MouseEvent.MOUSE_WHEEL,mouseWheelHandler);
			}
			
			private function mouseWheelHandler(event:MouseEvent):void{
			    resizeImageSize(event.delta);//deta为滑轮滚动时的刻度值
			}
			
			private function resizeImageSize(size:int):void{
				var w:int;
				var h:int;
			    if(size>0){
				   w=image.width*(1+size/10);	
			    	   h=image.height*(1+size/10);
			    	
			    }else if(size<0){
				   w=image.width/(1-size/10)
			       	   h=image.height/(1-size/10)
			    }
			     
			    if(image.width<50||image.height<50){
			        	w=50;
			       	h=50*(image.height/image.width);
			    }else if(image.width>=this.width||image.height>=this.height){
			    	h=this.height-50;
			       	w=(h*image.width)/image.height;
			    } 
			    image.width=w;
			    image.height=h;
			}
		]]>
	</mx:Script>   	
	<mx:VBox height="{bfb}" width="{bfb}">
	<mx:HBox height="{bfb}" width="{bfb}">
	<mx:Spacer width="50%"/>
	<mx:Image width="{bfb}" height="{bfb}" 
		      maxHeight="{this.height-40}" maxWidth="{this.width-50}"
		      source="{source}" id="image"
		      toolTip="{imgname}:点击查看原图片"
		      click="showSrcpage()"  mouseChildren="false" 
		      buttonMode="true" useHandCursor="true"
		      />
	<mx:Spacer width="50%"/>
	</mx:HBox>	      
	</mx:VBox>  
</mx:TitleWindow>

?

?

?

郑重声明:资讯 【Flex中鼠标滑轮控制图片大小- - JavaEye技术网站】由 发布,版权归原作者及其所在单位,其原创性以及文中陈述文字和内容未经(企业库qiyeku.com)证实,请读者仅作参考,并请自行核实相关内容。若本文有侵犯到您的版权, 请你提供相关证明及申请并与我们联系(qiyeku # qq.com)或【在线投诉】,我们审核后将会尽快处理。
—— 相关资讯 ——