如何在许多图像视图中执行缩放放大缩小？

时间：2015-04-23 10:34:34

标签： android android-layout pinchzoom image-zoom android-gesture

我知道这类问题曾被多次提出过，但这种情况不同，一旦经历问题然后再决定。

问题：              在这里，我提供了我的应用程序的部分代码，其中它当前执行捏缩放进出并且还拖动和放大一滴工作正常但实际问题在屏幕上添加两个图像时开始，之后如果我在屏幕上应用捏合手势，它将开始缩放/缩小两个图像，所以，目前我已应用条件限制此行为仅适用于单个图像。但是，如果我想单独执行两个图像的放大/缩小而不应用条件，我该怎么办？

1 ：是否可以为单个视图实现单独的ScaleGestureDetector？

2 ：这与Drag＆amp;一滴图像？

我也尝试使用http://www.zdnet.com/article/how-to-use-multi-touch-in-android-2-part-6-implementing-the-pinch-zoom-gesture/上的代码，但这也提供了一次压缩缩放/输入输出的代码。

希望你能理解问题。

public class Test extends Activity implements OnClickListener
{

private static final String TAG = Test.class.getSimpleName();

private ImageView leftArrowImageView, rightArrowImageView,
        selectedBackgroundImage, selectedImageView, secondImage,
        imageView1, secondImageView;

private Gallery gallery;

private int selectedImagePosition = 0;

private List<Drawable> drawables;

private GalleryImageAdapter galImageAdapter;
float m_lastTouchX, m_lastTouchY, m_posX, m_posY, m_prevX, m_prevY,
        m_imgXB, m_imgYB, m_imgXC, m_imgYC, m_dx, m_dy;

AbsoluteLayout parentLayout;
private Button saveImage, undoAll;

RelativeLayout composedImageParentLayout;
private Matrix m_matrix = new Matrix();
private Matrix originalMatrix = new Matrix();
private float scale = 1f;

private ScaleGestureDetector sgd;
private boolean isImageIsSaved = false;
private Context m_context;
private int numberOfImages = 0;

AbsoluteLayout secondImageLayout;

//private TouchImageView imgPreview;

// These matrices will be used to move and zoom image
Matrix matrix = new Matrix();
Matrix savedMatrix = new Matrix();

// We can be in one of these 3 states
static final int NONE = 0;
static final int DRAG = 1;
static final int ZOOM = 2;
int mode = NONE;

// Remember some things for zooming
PointF start = new PointF();
PointF mid = new PointF();
float oldDist = 1f;

@Override
public void onCreate(Bundle savedInstanceState)
{
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);
    m_context = this;
    m_prevX = 0;
    m_prevY = 0;
    m_imgXB = 50;
    m_imgYB = 100;
    m_imgXC = 150;
    m_imgYC = 100;

    getDrawablesList();
    setupUI();

    sgd = new ScaleGestureDetector(this, new ScaleListener());

    //Setting Background image

    Intent backgroundImageIntent = getIntent();
    byte[] bytes = backgroundImageIntent.getByteArrayExtra(ImageChooserActivity.SELECTED_IMAGE);

    Bitmap actualImage = BitmapFactory.decodeByteArray(bytes, 0, bytes.length);

    selectedBackgroundImage.setImageBitmap(actualImage);

}

private void setupUI()
{

    selectedImageView = (ImageView) findViewById(R.id.selected_imageview);
    leftArrowImageView = (ImageView) findViewById(R.id.left_arrow_imageview);
    rightArrowImageView = (ImageView) findViewById(R.id.right_arrow_imageview);
    saveImage = (Button) findViewById(R.id.saveImage);
    parentLayout = (AbsoluteLayout) findViewById(R.id.parentlayout);
    composedImageParentLayout = (RelativeLayout) findViewById(R.id.ddalTop);
    gallery = (Gallery) findViewById(R.id.gallery);
    undoAll = (Button) findViewById(R.id.undoAll);
    selectedBackgroundImage = (ImageView) findViewById(R.id.backgroundImage);

    secondImage = new ImageView(m_context);
    secondImageLayout = new AbsoluteLayout(m_context);
    saveImage.setOnClickListener(this);
    imageView1 = (ImageView) findViewById(R.id.imageView1);
    secondImageView = (ImageView) findViewById(R.id.secondImageView);

    undoAll.setOnClickListener(this);

    leftArrowImageView.setOnClickListener(new OnClickListener()
    {

        @Override
        public void onClick(View v)
        {

            if (selectedImagePosition > 0)
            {
                --selectedImagePosition;

            }

            gallery.setSelection(selectedImagePosition, false);
        }
    });

    rightArrowImageView.setOnClickListener(new OnClickListener()
    {

        @Override
        public void onClick(View v)
        {

            if (selectedImagePosition < drawables.size() - 1)
            {
                ++selectedImagePosition;

            }

            gallery.setSelection(selectedImagePosition, false);

        }
    });

    gallery.setOnItemSelectedListener(new OnItemSelectedListener()
    {

        @Override
        public void onItemSelected(AdapterView<?> parent, View view, int pos, long id)
        {

            selectedImagePosition = pos;

            if (selectedImagePosition > 0 && selectedImagePosition < drawables.size() - 1)
            {

                leftArrowImageView.setImageDrawable(getResources().getDrawable(R.drawable.arrow_left_enabled));
                rightArrowImageView.setImageDrawable(getResources().getDrawable(R.drawable.arrow_right_enabled));

            }
            else if (selectedImagePosition == 0)
            {

                leftArrowImageView.setImageDrawable(getResources().getDrawable(R.drawable.arrow_left_disabled));

            }
            else if (selectedImagePosition == drawables.size() - 1)
            {

                rightArrowImageView.setImageDrawable(getResources().getDrawable(R.drawable.arrow_right_disabled));
            }

            changeBorderForSelectedImage(selectedImagePosition);
            setSelectedImage(selectedImagePosition);
        }

        @Override
        public void onNothingSelected(AdapterView<?> arg0)
        {

        }

    });

    galImageAdapter = new GalleryImageAdapter(this, drawables);

    gallery.setAdapter(galImageAdapter);

    if (drawables.size() > 0)
    {

        gallery.setSelection(selectedImagePosition, false);

    }

    if (drawables.size() == 1)
    {

        rightArrowImageView.setImageDrawable(getResources().getDrawable(R.drawable.arrow_right_disabled));
    }

}

private void changeBorderForSelectedImage(int selectedItemPos)
{

    int count = gallery.getChildCount();

    for (int i = 0; i < count; i++)
    {

        ImageView imageView = (ImageView) gallery.getChildAt(i);
        imageView.setBackgroundDrawable(getResources().getDrawable(R.drawable.image_border));
        imageView.setPadding(3, 3, 3, 3);

    }

    ImageView imageView = (ImageView) gallery.getSelectedView();
    imageView.setBackgroundDrawable(getResources().getDrawable(R.drawable.selected_image_border));
    imageView.setPadding(3, 3, 3, 3);
}

private void getDrawablesList()
{

    drawables = new ArrayList<Drawable>();
    drawables.add(getResources().getDrawable(R.drawable.natureimage1));
    drawables.add(getResources().getDrawable(R.drawable.natureimage2));
    drawables.add(getResources().getDrawable(R.drawable.natureimage3));
    drawables.add(getResources().getDrawable(R.drawable.natureimage4));
    drawables.add(getResources().getDrawable(R.drawable.natureimage5));
    drawables.add(getResources().getDrawable(R.drawable.natureimage6));
    drawables.add(getResources().getDrawable(R.drawable.natureimage7));
    drawables.add(getResources().getDrawable(R.drawable.natureimage8));
    drawables.add(getResources().getDrawable(R.drawable.natureimage9));
    drawables.add(getResources().getDrawable(R.drawable.natureimage10));
    drawables.add(getResources().getDrawable(R.drawable.natureimage11));
    drawables.add(getResources().getDrawable(R.drawable.natureimage12));
    drawables.add(getResources().getDrawable(R.drawable.natureimage13));
    drawables.add(getResources().getDrawable(R.drawable.natureimage14));
    drawables.add(getResources().getDrawable(R.drawable.natureimage15));

}

private void setSelectedImage(int selectedImagePosition)
{
    //Set selected image and setOnTouchListener(touchListenerForZoomAndDrag);
}

/**
 * Touch listener for view
 */
View.OnTouchListener m_onTouchListener = new View.OnTouchListener()
{

    @Override
    public boolean onTouch(View p_v, MotionEvent p_event)
    {

        Log.d(TAG, "onTouch event is going on : " + p_v);

        logAllEvents("drag or drop operation is performed");
        switch (p_event.getAction())
        {
        case MotionEvent.ACTION_DOWN:
        {
            m_lastTouchX = p_event.getX();
            m_lastTouchY = p_event.getY();

            break;
        }
        case MotionEvent.ACTION_MOVE:
        {
            m_dx = p_event.getX() - m_lastTouchX;
            m_dy = p_event.getY() - m_lastTouchY;

            m_posX = m_prevX + m_dx;
            m_posY = m_prevY + m_dy;

            if (m_posX > 0 && m_posY > 0 && (m_posX + p_v.getWidth()) < parentLayout.getWidth() && (m_posY + p_v.getHeight()) < parentLayout.getHeight())
            {
                p_v.setLayoutParams(new AbsoluteLayout.LayoutParams(p_v.getMeasuredWidth(), p_v.getMeasuredHeight(), (int) m_posX, (int) m_posY));
                m_prevX = m_posX;
                m_prevY = m_posY;

            }

            break;

        }

        }
        return true;
    }
};

View.OnTouchListener touchListenerForZoomAndDrag = new View.OnTouchListener()
{
    @Override
    public boolean onTouch(View v, MotionEvent event)
    {

        switch (v.getId())
        {

        ImageView view = (ImageView) v;

        Log.d(TAG, "Coordinates of touch event: " + event.getX() + " And Y : " + event.getY());
        // Dump touch event to log
        dumpEvent(event);

        // Handle touch events here...
        switch (event.getAction() & MotionEvent.ACTION_MASK)
        {
        case MotionEvent.ACTION_DOWN:
            savedMatrix.set(matrix);

            Log.d(TAG, "View on Action Down is performed" + v);

            start.set(event.getX(), event.getY());
            Log.d(TAG, "mode=DRAG");
            mode = DRAG;
            break;
        case MotionEvent.ACTION_POINTER_DOWN:
            oldDist = spacing(event);
            Log.d(TAG, "oldDist=" + oldDist);
            if (oldDist > 10f)
            {
                savedMatrix.set(matrix);
                midPoint(mid, event);
                mode = ZOOM;
                Log.d(TAG, "mode=ZOOM");
            }
            break;
        case MotionEvent.ACTION_UP:
        case MotionEvent.ACTION_POINTER_UP:
            mode = NONE;
            Log.d(TAG, "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);
                Log.d(TAG, "newDist=" + newDist);
                if (newDist > 10f)
                {
                    matrix.set(savedMatrix);
                    float scale = newDist / oldDist;
                    matrix.postScale(scale, scale, mid.x, mid.y);
                }
            }
            break;
        }

        view.setImageMatrix(matrix);
        return true; // indicate event was handled
    }
};

/** Determine the space between the first two fingers */
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);
}

/** Calculate the mid point of the first two fingers */
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);
}

/** Show an event in the LogCat view, for debugging */
private void dumpEvent(MotionEvent event)
{
    String names[] = { "DOWN", "UP", "MOVE", "CANCEL", "OUTSIDE", "POINTER_DOWN", "POINTER_UP", "7?", "8?", "9?" };
    StringBuilder sb = new StringBuilder();
    int action = event.getAction();
    int actionCode = action & MotionEvent.ACTION_MASK;
    sb.append("event ACTION_").append(names[actionCode]);

    if (actionCode == MotionEvent.ACTION_POINTER_DOWN || actionCode == MotionEvent.ACTION_POINTER_UP)
    {
        sb.append("(pid ").append(action >> MotionEvent.ACTION_POINTER_ID_SHIFT);
        sb.append(")");
    }

    sb.append("[");
    for (int i = 0; i < event.getPointerCount(); i++)
    {
        sb.append("#").append(i);
        sb.append("(pid ").append(event.getPointerId(i));
        sb.append(")=").append((int) event.getX(i));
        sb.append(",").append((int) event.getY(i));
        if (i + 1 < event.getPointerCount()) sb.append(";");
    }

    sb.append("]");
    Log.d("Touch Events ---------", sb.toString());
}

private void saveImage()
{
    //Code to save image
}

@Override
public void onClick(View view)
{
    switch (view.getId())
    {
    case R.id.saveImage:
        logAllEvents("saveImage is clicked");

        saveImage();
        break;
    case R.id.undoAll:
        logAllEvents("undoAll is clicked");
        //undoAllChanges();
        break;
    }
}

private void undoAllChanges()
{
    //TODO
}

@Override
public boolean onTouchEvent(MotionEvent ev)
{
    sgd.onTouchEvent(ev);
    return true;
}

private class ScaleListener extends
        ScaleGestureDetector.SimpleOnScaleGestureListener
{
    @Override
    public boolean onScale(ScaleGestureDetector scaleGestureDetector)
    {
        //          Log.d(TAG, "Is image is saved for zoom in & out : " + isImageIsSaved);
        scale *= scaleGestureDetector.getScaleFactor();

        scale = Math.max(0.1f, Math.min(scale, 10.0f));
        m_matrix.setScale(scale, scale);

        if (secondImageLayout.getChildCount() > 0)
        {
            Log.d(TAG, "Second image is there...");
            secondImage.setImageMatrix(m_matrix);
            logAllEvents("Image Scaling on secondImage");
        }
        else
        {
            Log.d(TAG, "Only Single image is there");
            selectedImageView.setImageMatrix(m_matrix);
            logAllEvents("Image Scaling on selectedImageView");
        }

        return true;
    }

}

//Log all events that are occuring
private void logAllEvents(String message)
{
    Log.d(TAG, "Event name : " + message);
}


}

main.xml中 

<?xml version="1.0" encoding="utf-8"?>
<AbsoluteLayout xmlns:android="http://schemas.android.com/apk/res/android"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:id="@+id/parentlayout"
            android:orientation="vertical">

<RelativeLayout
    android:id="@+id/ddalTop"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content">

    <ImageView
        android:id="@+id/backgroundImage"
        android:layout_width="fill_parent"
        android:layout_height="300dp"
        android:src="@drawable/ic_launcher"/>

    <!--<FrameLayout
        android:layout_alignParentLeft="true"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent">

        <ImageView
            android:id="@+id/imageView1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:scaleType="matrix"
            />
    </FrameLayout>

    <FrameLayout
        android:layout_alignParentRight="true"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent">

        <ImageView
            android:id="@+id/secondImageView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:scaleType="matrix"
            />

    </FrameLayout>-->


</RelativeLayout>

<!--
    <RelativeLayout
        android:gravity="start"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent">
    </RelativeLayout>

    <RelativeLayout
        android:gravity="end"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent">
    </RelativeLayout>-->

<ImageView
    android:id="@+id/imageView1"
    android:layout_width="fill_parent"
    android:layout_height="300dp"
    android:scaleType="matrix"
    />
<ImageView
    android:id="@+id/secondImageView"
    android:layout_width="fill_parent"
    android:layout_height="300dp"
    android:scaleType="matrix"
    />

<RelativeLayout
    android:id="@+id/gallery_relative_layout"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:gravity="bottom">

    <ImageView
        android:id="@+id/left_arrow_imageview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerVertical="true"
        android:layout_marginLeft="15dip"
        android:src="@drawable/arrow_left_disabled"/>

    <Gallery
        android:id="@+id/gallery"
        android:layout_width="0dip"
        android:layout_height="120dp"
        android:layout_marginLeft="20dip"
        android:layout_marginRight="20dip"
        android:layout_alignParentBottom="true"
        android:layout_toLeftOf="@+id/right_arrow_imageview"
        android:layout_toRightOf="@+id/left_arrow_imageview"
        android:spacing="20dip"/>

    <ImageView
        android:id="@+id/right_arrow_imageview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:layout_alignParentBottom="true"
        android:layout_marginRight="15dip"
        android:src="@drawable/arrow_right_enabled"/>

    <!--<Button
        android:id="@+id/getPhoto"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/getPic"
        android:layout_y="298dp"
        android:layout_alignParentBottom="true"
        android:layout_alignLeft="@+id/left_arrow_imageview"
        android:layout_alignStart="@+id/left_arrow_imageview"/>-->

    <!-- <Button
         android:id="@+id/takePhoto"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:text="@string/takePhoto"
         android:layout_alignParentBottom="true"
         android:layout_centerHorizontal="true"/>-->


</RelativeLayout>

<ImageView
    android:id="@+id/selected_imageview"
    android:layout_width="150dp"
    android:layout_height="150dp"
    android:scaleType="matrix"
    android:layout_x="148dp"
    android:layout_y="227dp"/>

<Button
    android:id="@+id/undoAll"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/undoAll"
    android:enabled="false"
    android:layout_x="3dp"
    android:layout_y="356dp"
    android:layout_alignTop="@+id/saveImage"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true"/>

<Button
    android:id="@+id/saveImage"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/saveImage"
    android:layout_alignParentBottom="true"
    android:layout_alignParentRight="true"
    android:layout_alignParentEnd="true"
    android:layout_x="252dp"
    android:layout_y="355dp"/>

</AbsoluteLayout>

此代码的当前输出：

enter image description here

从图像中您可以了解可能存在的实际问题。我想单独调整这两个图像的大小。目前，它一次只能处理单个图像。

0 个答案:

没有答案
相关问题
最新问题