图像上的缩放图像单击事件

时间：2011-03-05 12:05:26

标签： android android-widget android-layout

我想在图像上缩放图像单击“事件”。 我怎样才能做到这一点。 这是我的完整代码

main.xml中

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
     android:layout_height="fill_parent" android:layout_width="fill_parent" >

    <LinearLayout android:orientation="horizontal"
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content">

        <Button android:text="Button1" android:id="@+id/button1" android:layout_height="wrap_content" android:layout_width="wrap_content" ></Button>
        <Button android:text="Button2" android:id="@+id/button2" android:layout_height="wrap_content" android:layout_width="wrap_content" ></Button>
        <Button android:text="Button3" android:id="@+id/button3" android:layout_height="wrap_content" android:layout_width="wrap_content" ></Button>

    </LinearLayout>

    <LinearLayout android:orientation="horizontal"
                  android:layout_height="290dp"
                  android:layout_width="wrap_content"
                  android:layout_gravity="center_horizontal">

             <ImageView android:id="@+id/contentImage"
                        android:layout_height="250dp" 
                        android:layout_width="200dp"
                        />


    </LinearLayout>

    <LinearLayout android:orientation="horizontal"
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content">

        <ImageView android:id="@+id/imageView1" android:src="@drawable/img1" android:layout_height="75dp" android:layout_width="75dp" ></ImageView>
        <ImageView android:id="@+id/imageView2" android:src="@drawable/img2" android:layout_height="75dp" android:layout_width="75dp" ></ImageView>
        <ImageView android:id="@+id/imageView3" android:src="@drawable/img3" android:layout_height="75dp" android:layout_width="75dp" ></ImageView>

    </LinearLayout>

</LinearLayout>

听到我的主要档案 将在其中处理事件的Image.java 

package com.example;


import android.app.Activity;

import android.graphics.Matrix;
import android.graphics.PointF;
import android.os.Bundle;
import android.view.GestureDetector;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.Toast;

public class Image extends Activity 
{
    public ImageView img1,img2,img3;
    ImageView contentImage;
    boolean click1=true;
    boolean click2=true;
    boolean click3=true;
    boolean imageTouch=false;



    public void onCreate(Bundle savedInstanceState) 
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        Button btn1=(Button)findViewById(R.id.button1);
        Button btn2=(Button)findViewById(R.id.button2);
        Button btn3=(Button)findViewById(R.id.button3);

        img1=(ImageView)findViewById(R.id.imageView1);
        img2=(ImageView)findViewById(R.id.imageView2);
        img3=(ImageView)findViewById(R.id.imageView3);
        contentImage=(ImageView)findViewById(R.id.contentImage);

        img1.setAlpha(100);
        img2.setAlpha(100);
        img3.setAlpha(100);


        btn1.setOnClickListener(new View.OnClickListener()
        {

            @Override
            public void onClick(View arg0) 
            {
                    if (click1) 
                {
                    img1.setAlpha(255);
                    img2.setAlpha(100);
                    img3.setAlpha(100);
                    click1=false;
                } 
                else 
                {
                    img1.setAlpha(255);
                    img2.setAlpha(100);
                    img3.setAlpha(100);
                    click1=true;
                }

                contentImage.setImageDrawable(null);

            }

        });
        btn2.setOnClickListener(new View.OnClickListener(){

            @Override
            public void onClick(View arg0) 
            {

                if (click2) 
                {
                    img1.setAlpha(100);
                    img2.setAlpha(255);
                    img3.setAlpha(100);
                    click2=false;
                } 
                else 
                {
                    img1.setAlpha(80);
                    img2.setAlpha(255);
                    img3.setAlpha(80);
                    click2=true;
                }
            contentImage.setImageDrawable(null);

            }

        }); 


        btn3.setOnClickListener(new View.OnClickListener(){

            @Override
            public void onClick(View arg0) 
            {

                if (click3) 
                {
                    img1.setAlpha(100);
                    img2.setAlpha(100);
                    img3.setAlpha(255);
                    click3=false;
                } 
                else 
                {
                    img1.setAlpha(100);
                    img2.setAlpha(100);
                    img3.setAlpha(255);
                    click3=true;
                }
                contentImage.setImageDrawable(null);

            }

        });

      img1.setOnClickListener(new OnClickListener()
      {

        @Override
        public void onClick(View v)
        {

            if (click1) 
            {
                img1.setAlpha(255);
                img2.setAlpha(100);
                img3.setAlpha(100);
                click1=false;
            } 
            else 
            {
                img1.setAlpha(255);
                img2.setAlpha(100);
                img3.setAlpha(100);
                click2=true;
            }


            contentImage.setImageResource(R.drawable.img1);

        }
    });

      img2.setOnClickListener(new OnClickListener()
      {

        @Override
        public void onClick(View v)
        {
            if (click2) 
            {
                img1.setAlpha(100);
                img2.setAlpha(255);
                img3.setAlpha(100);
                click2=false;
            } 
            else 
            {
                img1.setAlpha(80);
                img2.setAlpha(255);
                img3.setAlpha(80);
                click2=true;
            }
            contentImage.setImageResource(R.drawable.img2);

        }
    });  
      img3.setOnClickListener(new OnClickListener() 
      {

        @Override
        public void onClick(View v)
        {
            if (click3) 
            {
                img1.setAlpha(100);
                img2.setAlpha(100);
                img3.setAlpha(255);
                click3=false;
            } 
            else 
            {
                img1.setAlpha(100);
                img2.setAlpha(100);
                img3.setAlpha(255);
                click3=true;
            }
            contentImage.setImageResource(R.drawable.img3);

        }
    });      

      contentImage.setOnClickListener(new OnClickListener() 
      {

        public void onClick(View v) 
        {
            try
            {
            Toast.makeText(Image.this,"hello",Toast.LENGTH_SHORT);
            contentImage.setMinimumHeight(400); 
            contentImage.setMinimumWidth(700);

            imageTouch=true;
            }
            catch(Exception e)
            {
                System.out.println("Exception Raise.......................");
            }
        }
    });

    }//onCreate Method over..... 


}

4 个答案:

答案 0 :(得分：6)

您是否尝试使用图库和图像视图？

<RelativeLayout>
    <ImageView android:id="@+id/BigView" android:layout_width="XXdip" android:layout_height="XXdip" android:scaleType="fitCenter" />
    <Gallery android:id="@+id/MyGallery" android:unselectedAlpha="0.5" android:layout_below="@id/BigView" android:layout_height="XXdip" />
</RelativeLayout>

您必须为图库指定高度。然后添加一个OnItemSelectedListener。

final int[] p = {R.drawable.img1, R.drawable.img2, R.drawable.img3, ...};
final ImageView i = (ImageView) findViewById(R.id.BigView);
Gallery g = (Gallery) findViewById(R.id.MyGallery);
g.setAdapter(...);
g.setOnItemSelectedListener(new OnItemSelectedListener() {
    public void onItemSelected (AdapterView<?> parent, View view, int position, long id) {
        i.setImageResource(p[position]);
        // Maybe you can try
        // i.setImageDrawable(((ImageView) view).getDrawable());
    }
});

使用scaleType fitCenter，您的图像将适合ImageView大小，以适应宽高比。 所以直接设置大尺寸。

否则你可以在fill_parent的RelativeLayout中添加一个ImageView两个布局大小并设置可见性消失，添加：

i.setOnClickListener(new OnClickLisyener() {
    MyHiddenImageView.setImageResource(p[g.getSelectedItemPosition()]);
    MyHiddenImageView.setVisibility(View.VISIBLE);
});

答案 1 :(得分：3)

http://vmustafayev4en.blogspot.in/2011/12/android-imageview-zoom-in-zoom-out.html

答案 2 :(得分：1)

非常感谢... 你的代码对我很有用......我已经完成了以下代码的工作......及其工作

这是我的代码..

<强> main.xml中 

<?xml version="1.0" encoding="utf-8"?>


<LinearLayout android:orientation="horizontal"
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content">

    <Button android:text="Button1" android:id="@+id/button1" android:layout_height="wrap_content" android:layout_width="wrap_content" ></Button>
    <Button android:text="Button2" android:id="@+id/button2" android:layout_height="wrap_content" android:layout_width="wrap_content" ></Button>
    <Button android:text="Button3" android:id="@+id/button3" android:layout_height="wrap_content" android:layout_width="wrap_content" ></Button>

</LinearLayout>

<LinearLayout android:orientation="horizontal"
              android:layout_height="290dp"
              android:layout_width="wrap_content"
              android:layout_gravity="center_horizontal">

         <ImageView android:id="@+id/contentImage"
                    android:layout_height="fill_parent" 
                    android:layout_width="fill_parent"
                    android:scaleType="matrix" 
                    />


</LinearLayout>

<LinearLayout android:orientation="horizontal"
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content">

    <ImageView android:id="@+id/imageView1" android:src="@drawable/img1" android:layout_height="75dp" android:layout_width="75dp" ></ImageView>
    <ImageView android:id="@+id/imageView2" android:src="@drawable/img2" android:layout_height="75dp" android:layout_width="75dp" ></ImageView>
    <ImageView android:id="@+id/imageView3" android:src="@drawable/img3" android:layout_height="75dp" android:layout_width="75dp" ></ImageView>

</LinearLayout>

这是我的主要活动文件。 Image.java 

package com.example;


 import android.app.Activity;
 import android.content.Context;
import android.graphics.Matrix;
import android.graphics.PointF;
import android.os.Bundle;
import android.util.FloatMath;
import android.view.GestureDetector;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.ImageView;

public class Image extends Activity 
{
public ImageView img1,img2,img3;
public static ImageView contentImage;
boolean click1=true;
boolean click2=true;
boolean click3=true;
boolean imageTouch=false;
Context myContext=Image.this;
Matrix matrix = new Matrix();
Matrix savedMatrix = new Matrix();
PointF start=new PointF();
PointF mid = new PointF();
float oldDist = 1f;


static final int NONE = 0;
static final int DRAG = 1;
static final int ZOOM = 2;

int mode = NONE;

public GestureDetector mDetector;

public void onCreate(Bundle savedInstanceState) 
{
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);
    mDetector = new GestureDetector(Image.this,new MyGestureDetector(Image.this));

    Button btn1=(Button)findViewById(R.id.button1);
    Button btn2=(Button)findViewById(R.id.button2);
    Button btn3=(Button)findViewById(R.id.button3);

    img1=(ImageView)findViewById(R.id.imageView1);
    img2=(ImageView)findViewById(R.id.imageView2);
    img3=(ImageView)findViewById(R.id.imageView3);
    contentImage=(ImageView)findViewById(R.id.contentImage);


    img1.setAlpha(100);
    img2.setAlpha(100);
    img3.setAlpha(100);


    btn1.setOnClickListener(new View.OnClickListener()
    {

        @Override
        public void onClick(View arg0) 
        {
                if (click1) 
            {
                img1.setAlpha(255);
                img2.setAlpha(100);
                img3.setAlpha(100);
                click1=false;
            } 
            else 
            {
                img1.setAlpha(255);
                img2.setAlpha(100);
                img3.setAlpha(100);
                click1=true;
            }


        }

    });

    btn2.setOnClickListener(new View.OnClickListener(){

        @Override
        public void onClick(View arg0) 
        {

            if (click2) 
            {
                img1.setAlpha(100);
                img2.setAlpha(255);
                img3.setAlpha(100);
                click2=false;
            } 
            else 
            {
                img1.setAlpha(80);
                img2.setAlpha(255);
                img3.setAlpha(80);
                click2=true;
            }

        }

    }); 


    btn3.setOnClickListener(new View.OnClickListener(){

        @Override
        public void onClick(View arg0) 
        {

            if (click3) 
            {
                img1.setAlpha(100);
                img2.setAlpha(100);
                img3.setAlpha(255);
                click3=false;
            } 
            else 
            {
                img1.setAlpha(100);
                img2.setAlpha(100);
                img3.setAlpha(255);
                click3=true;
            }

        }

    });

  img1.setOnClickListener(new OnClickListener()
  {

    @Override
    public void onClick(View v)
    {

        if (click1) 
        {
            img1.setAlpha(255);
            img2.setAlpha(100);
            img3.setAlpha(100);
            click1=false;
        } 
        else 
        {
            img1.setAlpha(255);
            img2.setAlpha(100);
            img3.setAlpha(100);
            click2=true;
        }


        contentImage.setImageResource(R.drawable.img1);

    }
});

  img2.setOnClickListener(new OnClickListener()
  {

    @Override
    public void onClick(View v)
    {
        if (click2) 
        {
            img1.setAlpha(100);
            img2.setAlpha(255);
            img3.setAlpha(100);
            click2=false;
        } 
        else 
        {
            img1.setAlpha(80);
            img2.setAlpha(255);
            img3.setAlpha(80);
            click2=true;
        }
        contentImage.setImageResource(R.drawable.img2);

    }
});  
  img3.setOnClickListener(new OnClickListener() 
  {

    @Override
    public void onClick(View v)
    {
        if (click3) 
        {
            img1.setAlpha(100);
            img2.setAlpha(100);
            img3.setAlpha(255);
            click3=false;
        } 
        else 
        {
            img1.setAlpha(100);
            img2.setAlpha(100);
            img3.setAlpha(255);
            click3=true;
        }
        contentImage.setImageResource(R.drawable.img3);

    }
});      

  contentImage.setOnTouchListener(new View.OnTouchListener()
  {

    @Override
    public boolean onTouch(View v, MotionEvent event) 
    {

            ImageView view=(ImageView)v;
           System.out.println("matrix="+savedMatrix.toString());
           switch (event.getAction() & MotionEvent.ACTION_MASK) 
           {
           case MotionEvent.ACTION_DOWN:

               savedMatrix.set(matrix);
                 start.set(event.getX(), event.getY());
                 mode = DRAG;
                 break;


          case MotionEvent.ACTION_POINTER_DOWN:

                oldDist = spacing(event);

                 if (oldDist > 10f) 
                 {
                    savedMatrix.set(matrix);
                    midPoint(mid, event);
                    mode = ZOOM;
                 }
                 break;

           case MotionEvent.ACTION_UP:


           case MotionEvent.ACTION_POINTER_UP:
                 mode = NONE;

                 break;


           case MotionEvent.ACTION_MOVE:
                  if (mode == DRAG) 
                  {
                     matrix.set(savedMatrix);
                     matrix.postTranslate(event.getX() - start.x,
                     event.getY() - start.y);
                  }
                  else if (mode == ZOOM) 
                     {
                        float newDist = spacing(event);
                        if (newDist > 10f) 
                        {
                           matrix.set(savedMatrix);
                           float scale = newDist / oldDist;
                           matrix.postScale(scale, scale, mid.x, mid.y);
                        }
                     }
                  break;

           }
           view.setImageMatrix(matrix);


        return true;
    }
    private float spacing(MotionEvent event) 
    {
          float x = event.getX(0) - event.getX(1);
          float y = event.getY(0) - event.getY(1);
          return FloatMath.sqrt(x * x + y * y);
    }

    private void midPoint(PointF point, MotionEvent event) 
    {
          float x = event.getX(0) + event.getX(1);
          float y = event.getY(0) + event.getY(1);
          point.set(x / 2, y / 2);
       }
});

}//onCreate Method over..... 


}

答案 3 :(得分：0)

当您触摸或点击图像时，它会开始缩放，这种缩放动画可以在照片库中使用。要在XML布局文件中放大图像，可以使用两个ImageView组件;一个用于缩略图，另一个用于大图像。大图像视图用于全屏尺寸，小图像视图用于缩略图大小。here

相关问题
最新问题