图片一些效果 放大 缩小 拖拽

 public void onCreate(Bundle paramBundle)
   {
     super.onCreate(paramBundle);
     requestWindowFeature(Window.FEATURE_NO_TITLE);
     setContentView(R.layout.imge2);
     imagev = (ImageView)findViewById(R.id.myImage);
//     button1 = (Button)findViewById(R.id.myBu);
     zoom = (ZoomControls)findViewById(R.id.myBu2);
     button3 = (Button)findViewById(R.id.myBu3);
     button4 = (Button)findViewById(R.id.myBu4);    
     layout = (RelativeLayout)findViewById(R.id.layout1);
     DisplayMetrics dm = new DisplayMetrics();
     getWindowManager().getDefaultDisplay().getMetrics(dm);
     dw = dm.widthPixels;
     dy = dm.heightPixels- 80;
     scw = getWallpaperDesiredMinimumWidth()/2;
     sch = getWallpaperDesiredMinimumHeight();
     imagev.setScaleType(ScaleType.FIT_CENTER);
     bm = BitmapFactory.decodeResource(getResources(), R.drawable.image_1);
     imagev.setImageBitmap(bm);
     pich = bm.getHeight();
     picw = bm.getWidth();
     zoom.setIsZoomInEnabled(true);   
        zoom.setIsZoomOutEnabled(true); 

 

用ZoomControls实现放大缩小

zoom.setOnZoomInClickListener(new OnClickListener() {
   
   @Override
   public void onClick(View v) {
    // TODO Auto-generated method stub
     int bmpWidth=bm.getWidth();
        int bmpHeight=bm.getHeight();
        /* 设定图片放大的比例 */
        double scale=1.25; 
        /* 计算这次要放大的比例 */
        x=(float)(x*scale);
        y=(float)(y*scale);
       
        /* 产生reSize后的Bitmap对象 */
        Matrix matrix = new Matrix(); 
        matrix.postScale(x, y);
        Bitmap resizeBmp = Bitmap.createBitmap(bm,0,0,bmpWidth,bmpHeight,matrix,true);
        imagev.setImageBitmap(resizeBmp);
        zoom.setIsZoomOutEnabled(true);
        if(x*scale*bmpWidth>dw||y*scale*bmpHeight>dy)
        {
          zoom.setIsZoomInEnabled(false);
        }
       
   }
  });zoom.setOnZoomOutClickListener(new OnClickListener() {
   
   @Override
   public void onClick(View v) {
    // TODO Auto-generated method stub
     int bitw = bm.getWidth();
     int bith = bm.getHeight();
     //缩小比例
     double scale = 0.8 ;
     x = (float) (x * scale);
     y = (float) (y * scale);
     Matrix ma = new Matrix();
     ma.postScale(x, y);
    
     Bitmap bit = Bitmap.createBitmap(bm,0,0,bitw,bith,ma,true);
    
     imagev.setImageBitmap(bit);
     zoom.setIsZoomInEnabled(true);
     if(x*scale*bitw<10||y*scale*bith<10){
       zoom.setIsZoomOutEnabled(false);
   }
   }
  });

图片投拽:

  

   imagev.setOnTouchListener(new OnTouchListener() {
   private float x, y; 
            private int mx, my;    
   @Override
   public boolean onTouch(View v, MotionEvent event) {
    // TODO Auto-generated method stub
     switch(event.getAction()) {  
                 case MotionEvent.ACTION_DOWN: 
                     x = event.getX(); 
                     y = event.getY(); 
                 case MotionEvent.ACTION_MOVE: 
                     mx = (int)(event.getRawX() - x); 
                     my = (int)(event.getRawY() - 50 - y); 
                      
                     imagev.layout(mx, my, mx + v.getWidth(), my + v.getHeight()); 
                     break; 
                 } 
                 return true; 

    
   }
  });button3.setOnClickListener(new OnClickListener() {
   
   @Override
   public void onClick(View v) {
    // TODO Auto-generated method stub
    angel -- ;
    int neww = picw * times ;
    int newh = pich * times ;
    float scalew = (float)(neww / picw);
    float scalwh = (float)(newh / pich);
    Matrix ma = new Matrix();
    ma.postScale(scalew, scalwh);
    ma.setRotate(5 * angel);
    Bitmap bit = Bitmap.createBitmap(bm , 0 ,0 ,picw ,pich , ma , true);
    BitmapDrawable newbit = new BitmapDrawable(bit);
    imagev.setImageDrawable(newbit);
    
   }
  });button4.setOnClickListener(new OnClickListener() {
   
   @Override
   public void onClick(View v) {
    // TODO Auto-generated method stub
    angel ++ ;
    int neww = picw * times ;
    int newh = pich * times ;
    float scalew = (float)(neww / picw);
    float scalwh = (float)(newh / pich);
    Matrix ma = new Matrix();
    ma.postScale(scalew, scalwh);
    ma.setRotate(5 * angel);
    Bitmap bit = Bitmap.createBitmap(bm , 0 ,0 ,picw ,pich , ma , true);
    BitmapDrawable newbit = new BitmapDrawable(bit);
    imagev.setImageDrawable(newbit);
   }
  });

 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
在Vue移动端中实现图片的双指放大缩小拖拽,可以通过以下步骤进行操作。 首先,需要在Vue组件中引入相应的移动端手势库,比如AlloyFinger或是基于它封装的vue-alloyfinger插件。这些手势库可以监听移动端的触摸事件,方便实现手势操作。 其次,在组件的模板中需要渲染一张图片,并设置图片的初始宽度和高度。可以通过绑定样式属性的方式,将图片的宽度和高度与组件中的data数据绑定起来。 然后,需要为图片绑定手势事件,并在对应的方法中实现双指放大缩小拖拽的逻辑。比如,可以监听双指缩放事件,在事件处理函数中根据手指的位置和缩放比例来更新图片的宽度和高度。可以监听拖拽事件,在事件处理函数中根据手指的移动距离来更新图片的位置。 最后,还可以添加一些边界判断,比如设置图片的最大和最小缩放比例,防止图片过小或过大。还可以添加过渡动画,使操作更加平滑。 需要注意的是,双指放大缩小拖拽的实现需要一定的数学计算,比如计算手指的距离和角度,或是计算图片的偏移量等。因此,在实现过程中需要对数学计算有一定的了解。 综上所述,通过Vue和移动端手势库,我们可以很方便地实现图片的双指放大缩小拖拽功能。通过监听手势事件,并在事件处理函数中更新图片的属性和位置,可以实现用户友好的图片操作效果
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值