मैं छवियों के लिए ज़ूम कार्यक्षमता कैसे प्राप्त कर सकता हूं?

Question

क्या एक बड़ी छवि दिखाने और उपयोगकर्ता को ज़ूम इन और आउट और पैन करने में सक्षम करने का एक सामान्य तरीका है?

अब तक मुझे दो तरीके मिले:

1. ओवरराइटिंग ImageView, जो कि इस तरह की आम समस्या के लिए थोड़ा बहुत लगता है।
2. एक वेबव्यू का उपयोग करना लेकिन समग्र लेआउट आदि पर कम नियंत्रण के साथ।

Comments

एक ZOOM CONTROL (विजेट) है और आप पैनिंग को संभालने के लिए OnTouch इवेंट सुन सकते हैं।

— तोब्रिएन

इसी तरह का एक प्रश्न stackoverflow.com/questions/2537396/… , इस ट्यूटोरियल के लिए एक लिंक है anddev.org/… । आपको अपने iamge को पैन करने के लिए उपयोगी हो सकता है। मैंने इसे विस्तार से नहीं पढ़ा है, लेकिन यह आपको कुछ विचार भी दे सकता है कि ज़ूम फ़ंक्शन कैसे करें।

— स्टीव हेली

क्या किसी ने ज़ूम करते समय छवि को बचाने की कोशिश की है? मैं ज़ूम की गई स्थिति के बजाय डिफ़ॉल्ट स्थिति में सहेजी गई छवि चाहता हूं। कृपया मेरा प्रश्न देखें: stackoverflow.com/questions/24730793/… धन्यवाद

— ब्लेज़ तमाम

Answer 1

अपडेट करें

मैंने अभी अभी TouchImageView को एक नया अपडेट दिया है। इसमें अब Panning और Pinch Zoom के अलावा Double Tap Zoom और Fling शामिल हैं। नीचे दिया गया कोड बहुत दिनांकित है। आप नवीनतम कोड प्राप्त करने के लिए गीथब प्रोजेक्ट देख सकते हैं।

उपयोग

अपने प्रोजेक्ट में TouchImageView.java रखें। फिर इसे ImageView के समान उपयोग किया जा सकता है। उदाहरण:

TouchImageView img = (TouchImageView) findViewById(R.id.img);

यदि आप xml में TouchImageView का उपयोग कर रहे हैं, तो आपको पूर्ण पैकेज नाम प्रदान करना होगा, क्योंकि यह एक कस्टम दृश्य है। उदाहरण:

<com.example.touch.TouchImageView
    android:id="@+id/img”
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

नोट: मैंने अपना पूर्व उत्तर हटा दिया है, जिसमें कुछ बहुत पुराने कोड शामिल हैं और अब सीधे जीथब पर सबसे अपडेट किए गए कोड से लिंक करें।

ViewPager

यदि आप ViewPager में TouchImageView डालने में रुचि रखते हैं, तो इस उत्तर को देखें।

Comments

पाउलो, मैं प्रदर्शन के मुद्दों में नहीं चला, लेकिन मुझे टैबलेट पर परीक्षण करने के लिए नहीं मिला। धीमी गति से, क्या आपका मतलब है सुस्त? मैंने onScale की शुरुआत में 1.05 का अधिकतम जूम कारक निर्धारित किया है। क्या यह आप के बारे में बात कर रहे हैं? यदि नहीं, तो निम्न प्रयास करें: 1. क्या आप डिबग मोड में हैं? यह इसे काफी धीमा कर देगा। 2. आप किस साइज़ की इमेज सेट कर रहे हैं। मैंने बहुत बड़ी (8mp) छवियों के साथ परीक्षण नहीं किया, लेकिन यह इसे धीमा कर सकता है। 3. क्या आपके पास एक फोन है जिस पर आप परीक्षण कर सकते हैं? 4. यदि अन्य सभी विफल होते हैं, तो देखें कि क्या mScaleFactor को 2 से गुणा करना (यदि> 1) या 0.5 (यदि <1) आपकी स्थिति में मदद करता है।

— माइक ऑर्टिज़

@ अहसान व्यू कंस्ट्रक्टर को इसमें बदलें: TouchImageView(Context context, AttributeSet attrs)और इसे कॉल करें super(context, attrs);क्योंकि जब आप कस्टम दृश्य को बढ़ाते हैं , तो इसे केवल एक के बजाय दो मापदंडों के साथ बनाया जाता है। जब मैं इसके चारों ओर हो जाता हूं, तो मैं तीन व्यू कंस्ट्रक्टर्स और ड्रॉबल्स का समर्थन करने के लिए TouchImageView को ठीक कर दूंगा।

— माइक ऑर्टिज़

@ अहसान क्योंकि यह एक कस्टम दृश्य है, आपको एक्सएमएल फ़ाइल में पूरा नाम लिखना होगा, अर्थात <com.example.TouchImageView android:id="@+id/img" />। क्या तुमने वह किया?

— माइक ऑर्टिज़ 5

यह महान सामान है, युगों से इसकी तलाश कर रहा है। गिथब से कोड का उपयोग करें क्योंकि यह हाल ही में अधिक है और बस बेहतर काम करता है

— एलेक्स

@ मैं इस कोड की कोशिश की है, लेकिन कस्टम गैलरी काम नहीं करता है। क्या इस समस्या के आसपास कोई चाल काम है।

— उमेश

Answer 2

मैंने टचआईमैज व्यू बनाने के लिए कुछ कोड को अनुकूलित किया जो मल्टीटच (> 2.1) का समर्थन करता है। यह हैलो, Android पुस्तक से प्रेरित है ! (तीसरा संस्करण)

यह निम्न 3 फ़ाइलों के भीतर समाहित है TouchImageView.java WrapMotionEvent.java EclairMotionEvent.java

TouchImageView.java

import se.robertfoss.ChanImageBrowser.Viewer;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Matrix;
import android.graphics.PointF;
import android.util.FloatMath;
import android.util.Log;
import android.view.MotionEvent;
import android.view.View;
import android.widget.ImageView;

public class TouchImageView extends ImageView {

    private static final String TAG = "Touch";
    // 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;

    Context context;


    public TouchImageView(Context context) {
        super(context);
        super.setClickable(true);
        this.context = context;

        matrix.setTranslate(1f, 1f);
        setImageMatrix(matrix);
        setScaleType(ScaleType.MATRIX);

        setOnTouchListener(new OnTouchListener() {

            @Override
            public boolean onTouch(View v, MotionEvent rawEvent) {
                WrapMotionEvent event = WrapMotionEvent.wrap(rawEvent);

                // Dump touch event to log
                if (Viewer.isDebug == true){
                    dumpEvent(event);
                }

                // Handle touch events here...
                switch (event.getAction() & MotionEvent.ACTION_MASK) {
                case MotionEvent.ACTION_DOWN:
                    savedMatrix.set(matrix);
                    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:
                    int xDiff = (int) Math.abs(event.getX() - start.x);
                    int yDiff = (int) Math.abs(event.getY() - start.y);
                    if (xDiff < 8 && yDiff < 8){
                        performClick();
                    }
                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;
                }

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

        });
    }


    public void setImage(Bitmap bm, int displayWidth, int displayHeight) { 
        super.setImageBitmap(bm);

        //Fit to screen.
        float scale;
        if ((displayHeight / bm.getHeight()) >= (displayWidth / bm.getWidth())){
            scale =  (float)displayWidth / (float)bm.getWidth();
        } else {
            scale = (float)displayHeight / (float)bm.getHeight();
        }

        savedMatrix.set(matrix);
        matrix.set(savedMatrix);
        matrix.postScale(scale, scale, mid.x, mid.y);
        setImageMatrix(matrix);


        // Center the image
        float redundantYSpace = (float)displayHeight - (scale * (float)bm.getHeight()) ;
        float redundantXSpace = (float)displayWidth - (scale * (float)bm.getWidth());

        redundantYSpace /= (float)2;
        redundantXSpace /= (float)2;


        savedMatrix.set(matrix);
        matrix.set(savedMatrix);
        matrix.postTranslate(redundantXSpace, redundantYSpace);
        setImageMatrix(matrix);
    }


    /** Show an event in the LogCat view, for debugging */
    private void dumpEvent(WrapMotionEvent 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(TAG, sb.toString());
    }

    /** Determine the space between the first two fingers */
    private float spacing(WrapMotionEvent 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, WrapMotionEvent event) {
        // ...
        float x = event.getX(0) + event.getX(1);
        float y = event.getY(0) + event.getY(1);
        point.set(x / 2, y / 2);
    }
}

WrapMotionEvent.java

import android.view.MotionEvent;

public class WrapMotionEvent {
protected MotionEvent event;




    protected WrapMotionEvent(MotionEvent event) {
        this.event = event;
    }

    static public WrapMotionEvent wrap(MotionEvent event) {
            try {
                return new EclairMotionEvent(event);
            } catch (VerifyError e) {
                return new WrapMotionEvent(event);
            }
    }



    public int getAction() {
            return event.getAction();
    }

    public float getX() {
            return event.getX();
    }

    public float getX(int pointerIndex) {
            verifyPointerIndex(pointerIndex);
            return getX();
    }

    public float getY() {
            return event.getY();
    }

    public float getY(int pointerIndex) {
            verifyPointerIndex(pointerIndex);
            return getY();
    }

    public int getPointerCount() {
            return 1;
    }

    public int getPointerId(int pointerIndex) {
            verifyPointerIndex(pointerIndex);
            return 0;
    }

    private void verifyPointerIndex(int pointerIndex) {
            if (pointerIndex > 0) {
                throw new IllegalArgumentException(
                    "Invalid pointer index for Donut/Cupcake");
            }
    }

}

EclairMotionEvent.java

import android.view.MotionEvent;

public class EclairMotionEvent extends WrapMotionEvent {

    protected EclairMotionEvent(MotionEvent event) {
            super(event);
    }

    public float getX(int pointerIndex) {
            return event.getX(pointerIndex);
    }

    public float getY(int pointerIndex) {
            return event.getY(pointerIndex);
    }

    public int getPointerCount() {
            return event.getPointerCount();
    }

    public int getPointerId(int pointerIndex) {
            return event.getPointerId(pointerIndex);
    }
}

Comments

रॉबर्ट फॉस, अगर यह सीमा जज जोड़ते हैं, तो यह और अधिक अच्छी तरह से गिर सकता है। आप अपने कोड को बहुत अच्छी तरह से

— धन्यवाद दें

यह काम करता है, लेकिन मैं इस बिंदु को नहीं देखता WrapMotionEventऔर EclairMotionEvent... वैसे भी, +1।

— साइपी

फोन है कि यह समर्थन के लिए मल्टीटच। Android के लिए एक नियमित स्पर्श <2.0

— रॉबर्ट फॉस

अच्छा उदाहरण यह ठीक काम करता है, लेकिन मुझे वह नहीं मिला है जिसमें व्यूअर इन है (Viewer.isDebug == true) {डंपइवेंट (ईवेंट); }

— टॉफिक अहमद

यह क्या है? >> se.robertfoss.ChanImageBrowser.Viewer

— पन्नाधाय

Answer 3

मैंने एक WebView का उपयोग किया और छवि को मेमोरी से लोड किया

webview.loadUrl("file://...")

WebView सभी पैनिंग ज़ूमिंग और स्क्रॉलिंग को हैंडल करता है। यदि आप wra_content का उपयोग करते हैं, तो webview बड़ा नहीं होगा, फिर छवि और कोई सफेद क्षेत्र नहीं दिखाए जाते हैं। WebView बेहतर ImageView है;)

Comments

मैं उसी दृष्टिकोण का उपयोग कर रहा हूं। मेरे पास एक बड़ा मेट्रो मानचित्र है जो मैं चाहता हूं कि उपयोगकर्ता ज़ूम और स्क्रॉल करने में सक्षम हो। मैंने हालांकि यह देखा कि यदि आपके पास एक बड़ी छवि है (अर्थात 1000 या 3000 पिक्सेल चौड़ी), तो आपके ज़ूम करने के बाद छवि धुंधली हो जाती है। ऐसा लगता है कि कोलीरिस बड़ी ज़ूम वाली छवि को बहुत तेज नहीं दिखा सकता है। हालांकि मूल छवि असम्पीडित और बहुत तेज है। इसलिए मैंने एक बड़ी छवि को छोटे स्लाइस में काटकर उन्हें फिर से HTML के माध्यम से एक साथ रखा। इस तरह से ज़ूम इन करने पर इमेज तेज होती है। (मैं नेक्सस वन पर हूं, पहले 2.1update और अब 2.2 पर)

— मैथियास कॉनरैड

@ माथियास लिन: यदि एक बड़ी छवि तार पर भेजी जाती है, तो मैंने सुना है कि वाहक बड़ी छवियों को संपीड़ित करते हैं। क्या यह उपयोग-मामला आपको सूट करेगा या आपने छवि को स्थानीय रूप से लोड किया है।

— शमूएल

@ सॅम क्वेस्ट: इसे स्थानीय रूप से लोड करना

— मैथियास कॉनरैड

जूम बटन में निर्मित वेबवॉच का उपयोग करने के लिए बेहतर और चुटकी के लिए समर्थन में ज़ूम इन / आउट करने के लिए एक पूरी तरह से नया अहंकार लिखने के लिए जो अलग-अलग फोन और भविष्य के एंड्रॉइड प्लेटफ़ॉर्म रिलीज़ पर काम नहीं कर सकता है

— sami

यह समाधान केवल तभी लागू किया जा सकता है जब आप डिस्क पर आस-पास बैठे छवि के होते हैं, या छवि इतनी छोटी होती है कि आप 64 एनकोडिंग को आधार बना सकते हैं और स्ट्रिंग मान को loadUrlWithData () में पास कर सकते हैं।

— जेफरी बट्टमैन

Answer 4

Janusz के मूल प्रश्न के उत्तर में, इसे प्राप्त करने के कई तरीके हैं, जिनमें से सभी उनके कठिनाई स्तर में भिन्न हैं और नीचे बताए गए हैं। वेब दृश्य का उपयोग करना अच्छा है, लेकिन यह देखने और महसूस करने और नियंत्रणीयता के मामले में बहुत सीमित है। यदि आप एक कैनवास से बिटमैप को आकर्षित कर रहे हैं, तो सबसे बहुमुखी समाधान जो प्रस्तावित किया गया है वह माइकऑर्टिज़, रॉबर्ट फॉस और / या जैकब नॉर्डफॉक ने सुझाया है। पॉलबोर्के द्वारा एंड्रॉइड-मल्टीटच-कंट्रोलर को शामिल करने के लिए एक शानदार उदाहरण है , और कस्टम विचारों के बहु-स्पर्श समर्थन और alltypes होने के लिए बहुत अच्छा है।

व्यक्तिगत रूप से, यदि आप किसी कैनवास को बिटमैप में चित्रित कर रहे हैं और फिर उसे अंदर और छवि दृश्य में प्रदर्शित कर रहे हैं और मल्टी टच का उपयोग कर ज़ूम इन करना चाहते हैं और घूमना चाहते हैं, तो मुझे माइकआर्टिज़ का समाधान सबसे आसान लगता है। हालाँकि, मेरे उद्देश्यों के लिए, उनके द्वारा प्रदान किए गए Git के कोड को केवल तभी काम करना प्रतीत होता है जब उनका TouchImageView कस्टम ImageView वर्ग एकमात्र बच्चा हो या लेआउट परमस के रूप में प्रदान करें:

android:layout_height="match_parent"
android:layout_height="match_parent"

दुर्भाग्य से मेरे लेआउट डिज़ाइन के कारण, मुझे "layout_height" के लिए "wra_content" की आवश्यकता थी। जब मैंने इसे इस पर बदल दिया तो नीचे की तरफ इमेज क्रॉप हो गई और मैं क्रॉप्ड रीजन को स्क्रॉल या जूम नहीं कर सका। इसलिए मैंने ImageView के लिए स्रोत पर एक नज़र डाली, बस यह देखने के लिए कि एंड्रॉइड ने "ऑनम्यूअर" कैसे लागू किया और माइकऑर्टिज़ को सूट में बदल दिया।

   @Override
protected void onMeasure (int widthMeasureSpec, int heightMeasureSpec)
{
    super.onMeasure(widthMeasureSpec, heightMeasureSpec);

  //**** ADDED THIS ********/////
      int  w = (int) bmWidth;
      int  h = (int) bmHeight;
     width = resolveSize(w, widthMeasureSpec);  
     height = resolveSize(h, heightMeasureSpec);
  //**** END ********///   

   // width = MeasureSpec.getSize(widthMeasureSpec);   // REMOVED
   // height = MeasureSpec.getSize(heightMeasureSpec); // REMOVED

    //Fit to screen.
    float scale;
    float scaleX =  (float)width / (float)bmWidth;
    float scaleY = (float)height / (float)bmHeight;

    scale = Math.min(scaleX, scaleY);
    matrix.setScale(scale, scale);
    setImageMatrix(matrix);
    saveScale = 1f;

    // Center the image
    redundantYSpace = (float)height - (scale * (float)bmHeight) ;
    redundantXSpace = (float)width - (scale * (float)bmWidth);
    redundantYSpace /= (float)2;
    redundantXSpace /= (float)2;

    matrix.postTranslate(redundantXSpace, redundantYSpace);

    origWidth = width - 2 * redundantXSpace;
    origHeight = height - 2 * redundantYSpace;
   // origHeight = bmHeight;
    right = width * saveScale - width - (2 * redundantXSpace * saveScale);
    bottom = height * saveScale - height - (2 * redundantYSpace * saveScale);

    setImageMatrix(matrix);
}

यहाँ पर समाधान करें (int, int) एक "उपयोगिता है जो एक वांछित आकार के साथ सामंजस्य स्थापित करने के लिए है।

पैरामीटर:

 - size How big the view wants to be
 - MeasureSpec Constraints imposed by the parent

यह दिखाता है:

 - The size this view should be."

इसलिए मूल रूप से छवि को लोड होने पर मूल ImageView वर्ग के समान व्यवहार प्रदान करता है। कुछ अधिक परिवर्तन स्क्रीन का समर्थन करने के लिए किए जा सकते हैं जो पहलू अनुपात को संशोधित करते हैं। लेकिन अभी के लिए मुझे आशा है कि यह मदद करता है। अपने मूल कोड, महान काम के लिए माइकऑर्टिज़ को धन्यवाद।

Comments

क्या इस फिक्स को माइक के जीथब रेपो में शामिल किया गया है?

— लार्स

Answer 5

आप http://code.google.com/p/android-multitouch-controller/ भी आज़मा सकते हैं

पुस्तकालय वास्तव में बहुत अच्छा है, हालांकि शुरू में समझ पाना थोड़ा कठिन है।

Answer 6

मैंने अभी-अभी रॉबर्ट फॉस का TouchImageView एकीकृत किया है: इसने पूरी तरह से काम किया! धन्यवाद!

मैंने अभी थोड़ा सा कोड संशोधित किया है ताकि मैं इसे अपने लेआउट.xml से इंस्टेंट कर सकूं।

बस दो कंस्ट्रक्टर जोड़ें

public TouchImageView(Context context, AttributeSet attrs) {
    super(context, attrs);
    init(context);
}

public TouchImageView(Context context) {
    super(context);
    init(context);
}

और पुराने निर्माता को एक init विधि में बदलना:

private void init(Context context){
    //...old code ofconstructor of Robert Moss's code
}

Answer 7

@ रोबर्ट फॉस, @ माइक ऑर्टिज़, आपके काम के लिए बहुत-बहुत धन्यवाद। मैंने आपके काम का विलय कर दिया, और माइक के अतिरिक्त काम के साथ Android> 2.0 के लिए रॉबर्ट कक्षाएं पूरी कीं।

अपने काम के परिणामस्वरूप मैं ViewPager पर आधारित और Android TouchImageView का उपयोग करते हुए Android टच गैलरी प्रस्तुत करता हूं। URL द्वारा लोड की जा रही छवियां और आप उन्हें ज़ूम और ड्रैग कर सकते हैं। आप इसे यहां पा सकते हैं https://github.com/Dreddik/AndroidTouchGallery

Answer 8

ZoomViewकिसी अन्य दृश्य को ज़ूम करने के लिए उपयोग करने का प्रयास करें ।

http://code.google.com/p/android-zoom-view/ यह प्रयोग करने में आसान, मुफ्त और मज़ेदार है!

Comments

यह भंडार अब नहीं रखा गया है।

— एर्गिंडूरन

Answer 9

@ माइक के जवाब में जोड़ना। पहली बार देखे जाने पर छवि को मूल आयामों में पुनर्स्थापित करने के लिए मुझे डबल टैप की आवश्यकता थी। इसलिए मैंने "मूल ..." उदाहरण चर का एक पूरा ढेर जोड़ा और SimpleOnGestureListener को जोड़ा जिसने इस चाल को किया।

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Matrix;
import android.graphics.PointF;
import android.view.GestureDetector;
import android.view.MotionEvent;
import android.view.ScaleGestureDetector;
import android.view.View;
import android.widget.ImageView;

public class TouchImageView extends ImageView {

    Matrix matrix = 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 last = new PointF();
    PointF start = new PointF();
    float minScale = 1f;
    float maxScale = 3f;
    float[] m;

    float redundantXSpace, redundantYSpace, origRedundantXSpace, origRedundantYSpace;;

    float width, height;
    static final int CLICK = 3;
    static final float SAVE_SCALE = 1f;
    float saveScale = SAVE_SCALE;

    float right, bottom, origWidth, origHeight, bmWidth, bmHeight, origScale, origBottom,origRight;

    ScaleGestureDetector mScaleDetector;
    GestureDetector mGestureDetector;

    Context context;

    public TouchImageView(Context context) {
        super(context);
        super.setClickable(true);
        this.context = context;
        mScaleDetector = new ScaleGestureDetector(context, new ScaleListener());

        matrix.setTranslate(1f, 1f);
        m = new float[9];
        setImageMatrix(matrix);
        setScaleType(ScaleType.MATRIX);

        setOnTouchListener(new OnTouchListener() {

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

                boolean onDoubleTapEvent = mGestureDetector.onTouchEvent(event);
                if (onDoubleTapEvent) {
                    // Reset Image to original scale values
                    mode = NONE;
                    bottom = origBottom;
                    right = origRight;
                    last = new PointF();
                    start = new PointF();
                    m = new float[9];
                    saveScale = SAVE_SCALE;
                    matrix = new Matrix();
                    matrix.setScale(origScale, origScale);
                    matrix.postTranslate(origRedundantXSpace, origRedundantYSpace);
                    setImageMatrix(matrix);
                    invalidate();
                    return true;
                } 


                mScaleDetector.onTouchEvent(event);

                matrix.getValues(m);
                float x = m[Matrix.MTRANS_X];
                float y = m[Matrix.MTRANS_Y];
                PointF curr = new PointF(event.getX(), event.getY());

                switch (event.getAction()) {
                case MotionEvent.ACTION_DOWN:
                    last.set(event.getX(), event.getY());
                    start.set(last);
                    mode = DRAG;
                    break;
                case MotionEvent.ACTION_MOVE:
                    if (mode == DRAG) {
                        float deltaX = curr.x - last.x;
                        float deltaY = curr.y - last.y;
                        float scaleWidth = Math.round(origWidth * saveScale);
                        float scaleHeight = Math.round(origHeight * saveScale);
                        if (scaleWidth < width) {
                            deltaX = 0;
                            if (y + deltaY > 0)
                                deltaY = -y;
                            else if (y + deltaY < -bottom)
                                deltaY = -(y + bottom);
                        } else if (scaleHeight < height) {
                            deltaY = 0;
                            if (x + deltaX > 0)
                                deltaX = -x;
                            else if (x + deltaX < -right)
                                deltaX = -(x + right);
                        } else {
                            if (x + deltaX > 0)
                                deltaX = -x;
                            else if (x + deltaX < -right)
                                deltaX = -(x + right);

                            if (y + deltaY > 0)
                                deltaY = -y;
                            else if (y + deltaY < -bottom)
                                deltaY = -(y + bottom);
                        }
                        matrix.postTranslate(deltaX, deltaY);
                        last.set(curr.x, curr.y);
                    }
                    break;

                case MotionEvent.ACTION_UP:
                    mode = NONE;
                    int xDiff = (int) Math.abs(curr.x - start.x);
                    int yDiff = (int) Math.abs(curr.y - start.y);
                    if (xDiff < CLICK && yDiff < CLICK)
                        performClick();
                    break;

                case MotionEvent.ACTION_POINTER_UP:
                    mode = NONE;
                    break;
                }

                setImageMatrix(matrix);
                invalidate();

                return true; // indicate event was handled
            }

        });

        mGestureDetector = new GestureDetector(context, new GestureDetector.SimpleOnGestureListener() {
            @Override
            public boolean onDoubleTapEvent(MotionEvent e) {
                return true;
            }
        });
    }

    @Override
    public void setImageBitmap(Bitmap bm) {
        super.setImageBitmap(bm);
        bmWidth = bm.getWidth();
        bmHeight = bm.getHeight();
    }

    public void setMaxZoom(float x) {
        maxScale = x;
    }

    private class ScaleListener extends
            ScaleGestureDetector.SimpleOnScaleGestureListener {
        @Override
        public boolean onScaleBegin(ScaleGestureDetector detector) {
            mode = ZOOM;
            return true;
        }

        @Override
        public boolean onScale(ScaleGestureDetector detector) {
            float mScaleFactor = (float) Math.min(
                    Math.max(.95f, detector.getScaleFactor()), 1.05);
            float origScale = saveScale;
            saveScale *= mScaleFactor;
            if (saveScale > maxScale) {
                saveScale = maxScale;
                mScaleFactor = maxScale / origScale;
            } else if (saveScale < minScale) {
                saveScale = minScale;
                mScaleFactor = minScale / origScale;
            }
            right = width * saveScale - width
                    - (2 * redundantXSpace * saveScale);
            bottom = height * saveScale - height
                    - (2 * redundantYSpace * saveScale);
            if (origWidth * saveScale <= width
                    || origHeight * saveScale <= height) {
                matrix.postScale(mScaleFactor, mScaleFactor, width / 2,
                        height / 2);
                if (mScaleFactor < 1) {
                    matrix.getValues(m);
                    float x = m[Matrix.MTRANS_X];
                    float y = m[Matrix.MTRANS_Y];
                    if (mScaleFactor < 1) {
                        if (Math.round(origWidth * saveScale) < width) {
                            if (y < -bottom)
                                matrix.postTranslate(0, -(y + bottom));
                            else if (y > 0)
                                matrix.postTranslate(0, -y);
                        } else {
                            if (x < -right)
                                matrix.postTranslate(-(x + right), 0);
                            else if (x > 0)
                                matrix.postTranslate(-x, 0);
                        }
                    }
                }
            } else {
                matrix.postScale(mScaleFactor, mScaleFactor,
                        detector.getFocusX(), detector.getFocusY());
                matrix.getValues(m);
                float x = m[Matrix.MTRANS_X];
                float y = m[Matrix.MTRANS_Y];
                if (mScaleFactor < 1) {
                    if (x < -right)
                        matrix.postTranslate(-(x + right), 0);
                    else if (x > 0)
                        matrix.postTranslate(-x, 0);
                    if (y < -bottom)
                        matrix.postTranslate(0, -(y + bottom));
                    else if (y > 0)
                        matrix.postTranslate(0, -y);
                }
            }
            return true;

        }
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        width = MeasureSpec.getSize(widthMeasureSpec);
        height = MeasureSpec.getSize(heightMeasureSpec);
        // Fit to screen.
        float scale;
        float scaleX = (float) width / (float) bmWidth;
        float scaleY = (float) height / (float) bmHeight;
        scale = Math.min(scaleX, scaleY);
        matrix.setScale(scale, scale);
        setImageMatrix(matrix);
        saveScale = SAVE_SCALE;
        origScale = scale;

        // Center the image
        redundantYSpace = (float) height - (scale * (float) bmHeight);
        redundantXSpace = (float) width - (scale * (float) bmWidth);
        redundantYSpace /= (float) 2;
        redundantXSpace /= (float) 2;

        origRedundantXSpace = redundantXSpace;
        origRedundantYSpace = redundantYSpace;

        matrix.postTranslate(redundantXSpace, redundantYSpace);

        origWidth = width - 2 * redundantXSpace;
        origHeight = height - 2 * redundantYSpace;
        right = width * saveScale - width - (2 * redundantXSpace * saveScale);
        bottom = height * saveScale - height
                - (2 * redundantYSpace * saveScale);
        origRight = right;
        origBottom = bottom;
        setImageMatrix(matrix);
    }

}

Answer 10

इस थ्रेड के लिए यह बहुत देर से जोड़ा गया है, लेकिन मैं एक ऐसे छवि दृश्य पर काम कर रहा हूं जो ज़ूम और पैन का समर्थन करता है और इसमें कुछ विशेषताएं हैं जो मुझे कहीं और नहीं मिली हैं। यह बिना किसी कारण के बहुत बड़ी छवियों को प्रदर्शित करने के तरीके के रूप में शुरू हुआ OutOfMemoryError, जब ज़ूम आउट किया गया और ज़ूम इन होने पर उच्च रिज़ॉल्यूशन टाइल लोड करने पर छवि को सबमर्सिबल के रूप में शुरू किया गया । यह अब ViewPagerमैन्युअल रूप से उपयोग करने, EXIF ​​जानकारी (90 ° स्टॉप) का उपयोग करने का समर्थन करता है। ओवरव्यू, पैन को ज़ूम करते समय, और फ़्लिंग की गति को जोड़ने के लिए उप-वर्ग का उपयोग करके OnClickListenerया अपने स्वयं के GestureDetectorया चुने हुए स्पर्श घटनाओं के ओवरराइड OnTouchListener।

यह एक सामान्य उपयोग प्रतिस्थापन के रूप में इसका ImageViewविस्तार नहीं करता है, और यह संसाधनों, केवल संपत्ति और बाहरी फ़ाइलों से छवियों के प्रदर्शन का समर्थन नहीं करता है। इसके लिए एसडीके 10 चाहिए।

स्रोत GitHub पर है, और इसमें एक नमूना है जो एक में उपयोग दिखाता है ViewPager।

https://github.com/davemorrissey/subsampling-scale-image-view

Answer 11

इसके लिए आप LayoutPams का उपयोग करने का प्रयास कर सकते हैं

public void zoom(boolean flag){
    if(flag){
        int width=40;
        int height=40;
    }
    else{
        int width=20;
        int height=20;
    }
    RelativeLayout.LayoutParams param=new RelativeLayout.LayoutParams(width,height); //use the parent layout of the ImageView;
    imageView.setLayoutParams(param); //imageView is the view which needs zooming.
}

ज़ूम इन = ज़ूम (सच्चा); ज़ूमऑट = ज़ूम (झूठा);

Answer 12

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    imageDetail = (ImageView) findViewById(R.id.imageView1);
    imageDetail.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);
                    startPoint.set(event.getX(), event.getY());
                    mode = DRAG;
                    break;
                case MotionEvent.ACTION_POINTER_DOWN:
                    oldDist = spacing(event);
                    if (oldDist > 10f) {
                        savedMatrix.set(matrix);
                        midPoint(midPoint, 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() - startPoint.x, event.getY() - startPoint.y);
                    } else if (mode == ZOOM) {
                        float newDist = spacing(event);
                        if (newDist > 10f) {
                            matrix.set(savedMatrix);
                            float scale = newDist / oldDist;
                            matrix.postScale(scale, scale, midPoint.x, midPoint.y);
                        }
                    }
                    break;
            }
            view.setImageMatrix(matrix);
            return true;

        }

        @SuppressLint("FloatMath")
        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);
        }
    });
}

और ड्रा करने योग्य फ़ोल्डर में bticn छवि फ़ाइल होनी चाहिए। पूरी तरह से काम करता है :)

Answer 13

नीचे जैसा कुछ होगा, वैसा करेंगे।

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

    tap=tap2=drag=pinch=none;
    int mask=e.getActionMasked();
    posx=e.getX();posy=e.getY();

    float midx= img.getWidth()/2f;
    float midy=img.getHeight()/2f;
    int fingers=e.getPointerCount();

    switch(mask)
    {
        case MotionEvent.ACTION_POINTER_UP:
            tap2=1;break;

        case MotionEvent.ACTION_UP:
            tap=1;break;

        case MotionEvent.ACTION_MOVE:
            drag=1;
    }
    if(fingers==2){nowsp=Math.abs(e.getX(0)-e.getX(1));}
    if((fingers==2)&&(drag==0)){ tap2=1;tap=0;drag=0;}
    if((fingers==2)&&(drag==1)){ tap2=0;tap=0;drag=0;pinch=1;}

    if(pinch==1)

    {
        if(nowsp>oldsp)scale+=0.1;
        if(nowsp<oldsp)scale-=0.1;
        tap2=tap=drag=0;    
    }
    if(tap2==1)
        {
            scale-=0.1;
            tap=0;drag=0;
        }
    if(tap==1)
        {
            tap2=0;drag=0;
            scale+=0.1;
        }
    if(drag==1)
        {
            movx=posx-oldx;
            movy=posy-oldy;
            x+=movx;
            y+=movy;
            tap=0;tap2=0;
        }
    m.setTranslate(x,y);
    m.postScale(scale,scale,midx,midy);
    img.setImageMatrix(m);img.invalidate();
    tap=tap2=drag=none;
    oldx=posx;oldy=posy;
    oldsp=nowsp;
    return true;
}


public void onCreate(Bundle b)
{
        super.onCreate(b);

    img=new ImageView(this);
    img.setScaleType(ImageView.ScaleType.MATRIX);
    img.setOnTouchListener(this);

    path=Environment.getExternalStorageDirectory().getPath();   
    path=path+"/DCIM"+"/behala.jpg";
    byte[] bytes;
    bytes=null;
    try{
        FileInputStream fis;
        fis=new FileInputStream(path);
        BufferedInputStream bis;
        bis=new BufferedInputStream(fis);
        bytes=new byte[bis.available()];
        bis.read(bytes);
        if(bis!=null)bis.close();
        if(fis!=null)fis.close();

     }
    catch(Exception e)
        {
        ret="Nothing";
        }
    Bitmap bmp=BitmapFactory.decodeByteArray(bytes,0,bytes.length);

    img.setImageBitmap(bmp);

    setContentView(img);
}

पूरा कार्यक्रम देखने के लिए यहां देखें: Android में छवि ज़ूम करने का कार्यक्रम