捏缩放ImageView - 想要缩小整个图像超出屏幕大小

时间:2015-04-16 19:33:23

标签: java android android-studio android-imageview

我对图像进行了缩放缩放,但是当我第一次加载应用时,整个图像都不可见,只有一部分。图像填充屏幕的宽度,但在其上方和下方有白色空间。此外,当缩放图像时,图像变得非常短。纵横比应该保持不变。

我希望在应用加载时可以看到整个图像,然后我希望能够用两根手指缩小图像不会小于屏幕的大小,这样屏幕就可以了总是满的(图像是地图)。

对于放大,图像应缩放到手机屏幕的宽度和高度之外。这样我就可以平移地查看地图了。

非常感谢任何帮助。相关代码如下。

我的主要活动代码:

public class MainActivity extends Activity
{
    private MapView image;
    private Matrix matrix = new Matrix();

    float mLastTouchX, mPosX;
    float mLastTouchY, mPosY;

    private ScaleGestureDetector mScaleDetector;
    private float mScaleFactor = 1f;

    private int mActivePointerId = MotionEvent.INVALID_POINTER_ID;

    @Override
    protected void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        image = (MapView)findViewById(R.id.imageView1);
        mScaleDetector = new ScaleGestureDetector(MainActivity.this, new ScaleListener());
    }

    public void onDraw(Canvas canvas)
    {
        canvas.save();

        canvas.scale(mScaleFactor, mScaleFactor);
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu)
    {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_main, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item)
    {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings)
        {
            return true;
        }

        return super.onOptionsItemSelected(item);
    }



    @Override
    public boolean onTouchEvent(MotionEvent event)
    {
        mScaleDetector.onTouchEvent(event);

        final int action = MotionEventCompat.getActionMasked(event);

        switch (action)
        {
            case MotionEvent.ACTION_DOWN:
            {
                final int pointerIndex = MotionEventCompat.getActionIndex(event);
                final float x = MotionEventCompat.getX(event, pointerIndex);
                final float y = MotionEventCompat.getY(event, pointerIndex);

                // Remember where we started (for dragging)
                mLastTouchX = x;
                mLastTouchY = y;
                // Save the ID of this pointer (for dragging)
                mActivePointerId = MotionEventCompat.getPointerId(event, 0);
                break;
            }

            case MotionEvent.ACTION_MOVE:
            {
                // Find the index of the active pointer and fetch its position
                final int pointerIndex =
                        MotionEventCompat.findPointerIndex(event, mActivePointerId);

                final float x = MotionEventCompat.getX(event, pointerIndex);
                final float y = MotionEventCompat.getY(event, pointerIndex);

                // Calculate the distance moved
                final float dx = x - mLastTouchX;
                final float dy = y - mLastTouchY;

                mPosX += dx;
                mPosY += dy;

                // Remember this touch position for the next move event
                mLastTouchX = x;
                mLastTouchY = y;

                break;
            }

            case MotionEvent.ACTION_UP:
            {
                mActivePointerId = MotionEvent.INVALID_POINTER_ID;
                break;
            }

            case MotionEvent.ACTION_CANCEL:
            {
                mActivePointerId = MotionEvent.INVALID_POINTER_ID;
                break;
            }

            case MotionEvent.ACTION_POINTER_UP:
            {
                final int pointerIndex = MotionEventCompat.getActionIndex(event);
                final int pointerId = MotionEventCompat.getPointerId(event, pointerIndex);

                if (pointerId == mActivePointerId)
                {
                    // This was our active pointer going up. Choose a new
                    // active pointer and adjust accordingly.
                    final int newPointerIndex = pointerIndex == 0 ? 1 : 0;
                    mLastTouchX = MotionEventCompat.getX(event, newPointerIndex);
                    mLastTouchY = MotionEventCompat.getY(event, newPointerIndex);
                    mActivePointerId = MotionEventCompat.getPointerId(event, newPointerIndex);
                }
                break;
            }
        }

        image.setX(mPosX);
        image.setY(mPosY);

        return true;
    }

    private class ScaleListener extends ScaleGestureDetector.SimpleOnScaleGestureListener
    {
        @Override
        public boolean onScale(ScaleGestureDetector detector)
        {
            mScaleFactor *= detector.getScaleFactor();
            mScaleFactor = Math.max(0.1f, Math.min(mScaleFactor, 5.0f));

            matrix.setScale(mScaleFactor, mScaleFactor);
            image.setImageMatrix(matrix);

            return true;
        }
    }
}

自定义ImageView:

public class MapView extends ImageView
{
    public MapView(final Context context, final AttributeSet attrs)
    {
        super(context, attrs);
    }

    public void scaleImage(int boundBoxInDp)
    {
        Drawable drawable = getDrawable();
        Bitmap bitmap = ((BitmapDrawable)drawable).getBitmap();

        int width = bitmap.getWidth();
        int height = bitmap.getHeight();

        float xScale = ((float) boundBoxInDp) / width;
        float yScale = ((float) boundBoxInDp) / height;
        float scale = (xScale <= yScale) ? xScale : yScale;

        Matrix matrix = new Matrix();
        matrix.postScale(scale, scale);

        Bitmap scaledBitmap = Bitmap.createBitmap(bitmap, 0, 0, width, height, matrix, true);
        BitmapDrawable result = new BitmapDrawable(scaledBitmap);
        width = scaledBitmap.getWidth();
        height = scaledBitmap.getHeight();

        // Apply the scaled bitmap
        setImageDrawable(result);

        // Now change ImageView's dimensions to match the scaled image
        LinearLayout.LayoutParams params = (LinearLayout.LayoutParams)getLayoutParams();
        params.width = width;
        params.height = height;
        setLayoutParams(params);
    }

    private int dpToPx(Context c, int dp)
    {
        float density = c.getResources().getDisplayMetrics().density;
        return Math.round((float)dp * density);
    }

    @Override
    protected void onMeasure(final int widthMeasureSpec, final int heightMeasureSpec)
    {
        final Drawable d = this.getDrawable();

        if (d != null)
        {
            // ceil not round - avoid thin vertical gaps along the left/right edges
            final int width = MeasureSpec.getSize(widthMeasureSpec);
            final int height = (int) Math.ceil(width * (float) d.getIntrinsicHeight() / d.getIntrinsicWidth());
            this.setMeasuredDimension(width, height);
        }
        else
        {
            super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        }
    }
}

布局文件:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                xmlns:tools="http://schemas.android.com/tools"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:paddingLeft="@dimen/activity_horizontal_margin"
                android:paddingRight="@dimen/activity_horizontal_margin"
                android:paddingTop="@dimen/activity_vertical_margin"
                android:paddingBottom="@dimen/activity_vertical_margin"
                tools:context=".MainActivity">

    <com.kilobolt.framework.locationfinder.MapView
        android:id="@+id/imageView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:scaleType="matrix"
        android:src="@drawable/uea" />

</RelativeLayout>

1 个答案:

答案 0 :(得分:0)

我采用了不同的方法来解决显示自定义地图的问题。我使用的是Google Maps Javascript API v3(https://developers.google.com/maps/documentation/javascript/examples/marker-simple)。

,而不是显示固定大小的图像

我在网页视图中显示了此内容,并在javascript中创建了一个可重复使用的功能来创建自定义标记。

如果有人遇到此问题(似乎没有详细记录),请尝试使用此地图解决方案,并随时给我发消息。希望这会有所帮助。