android:如何将可滚动的照片放入imageView? [英] android : How to place a scrollable photo into imageView?

问题描述

我现在正在做一个项目，实际上我要做的是给用户一个圆圈，当他单击它时，他将能够从画廊中选择照片，也可以通过他/她的cam选择照片，我实际上已经绘制了我自定义的圆圈形状，然后使用Glide-Transformation库将图像放入其中，但是问题是我无法在该圆圈内滚动以显示用户图像的某些特定部分. 任何解决方案都将有所帮助. 我的XML文件如下所示:

I'm now working on some project and actually what I want to do is I will give a user a circle and when he clicks it , he will be able to choose photo either from gallery or with his/her cam , I've actually draw my custom shape of the circle , and then place image into it using Glide-Transformation Library , but the problem is I can't scroll inside this circle to show some specific part of user's image . Any Solution will be helpful . My XML file looks like this :

<?xml version="1.0" encoding="utf-8"?>
<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:background="#D2DDD7"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.example.karim.helloworld.MainActivity">
<ImageView
    android:layout_width="200dp"
    android:layout_height="200dp"
    android:layout_centerVertical="true"
    android:layout_centerHorizontal="true"
    android:id="@+id/imgView"
    android:padding="5dp"
    android:scaleType="centerCrop"
    android:background="@drawable/circle_image"/>
</RelativeLayout>

我的课堂活动是:

package com.example.karim.helloworld;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.ImageView;

import com.bumptech.glide.Glide;

import jp.wasabeef.glide.transformations.BlurTransformation;
import jp.wasabeef.glide.transformations.CropCircleTransformation;

public class MainActivity extends AppCompatActivity {
    ImageView imageView;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        imageView = (ImageView) findViewById(R.id.imgView);
        Glide.with(this).load(R.drawable.pk).bitmapTransform(new CropCircleTransformation(getApplicationContext()))
                .into(imageView);
    }
}]

推荐答案

有imageView滚动示例，希望对您有所帮助:

There is example of scroll of imageView, hope it helps:

// set maximum scroll amount (based on center of image)
    int maxX = (int)((bitmapWidth / 2) - (screenWidth / 2));
    int maxY = (int)((bitmapHeight / 2) - (screenHeight / 2));
// set scroll limits
final int maxLeft = (maxX * -1);
final int maxRight = maxX;
final int maxTop = (maxY * -1);
final int maxBottom = maxY;

// set touchlistener
ImageView_BitmapView.setOnTouchListener(new View.OnTouchListener()
{
    float downX, downY;
    int totalX, totalY;
    int scrollByX, scrollByY;
    public boolean onTouch(View view, MotionEvent event)
    {
        float currentX, currentY;
        switch (event.getAction())
        {
            case MotionEvent.ACTION_DOWN:
                downX = event.getX();
                downY = event.getY();
                break;

            case MotionEvent.ACTION_MOVE:
                currentX = event.getX();
                currentY = event.getY();
                scrollByX = (int)(downX - currentX);
                scrollByY = (int)(downY - currentY);

                // scrolling to left side of image (pic moving to the right)
                if (currentX > downX)
                {
                    if (totalX == maxLeft)
                    {
                        scrollByX = 0;
                    }
                    if (totalX > maxLeft)
                    {
                        totalX = totalX + scrollByX;
                    }
                    if (totalX < maxLeft)
                    {
                        scrollByX = maxLeft - (totalX - scrollByX);
                        totalX = maxLeft;
                    }
                }

                // scrolling to right side of image (pic moving to the left)
                if (currentX < downX)
                {
                    if (totalX == maxRight)
                    {
                        scrollByX = 0;
                    }
                    if (totalX < maxRight)
                    {
                        totalX = totalX + scrollByX;
                    }
                    if (totalX > maxRight)
                    {
                        scrollByX = maxRight - (totalX - scrollByX);
                        totalX = maxRight;
                    }
                }

                // scrolling to top of image (pic moving to the bottom)
                if (currentY > downY)
                {
                    if (totalY == maxTop)
                    {
                        scrollByY = 0;
                    }
                    if (totalY > maxTop)
                    {
                        totalY = totalY + scrollByY;
                    }
                    if (totalY < maxTop)
                    {
                        scrollByY = maxTop - (totalY - scrollByY);
                        totalY = maxTop;
                    }
                }

                // scrolling to bottom of image (pic moving to the top)
                if (currentY < downY)
                {
                    if (totalY == maxBottom)
                    {
                        scrollByY = 0;
                    }
                    if (totalY < maxBottom)
                    {
                        totalY = totalY + scrollByY;
                    }
                    if (totalY > maxBottom)
                    {
                        scrollByY = maxBottom - (totalY - scrollByY);
                        totalY = maxBottom;
                    }
                }

                ImageView_BitmapView.scrollBy(scrollByX, scrollByY);
                downX = currentX;
                downY = currentY;
                break;

        }

        return true;
    }
});

使用遵循XML的掩码:

Make a mask using follow XML:

<FrameLayout>
    <ImageView />  put a image which has a transparent circle in it
    <ImageView />  your image 
</FrameLayout>

这篇关于android:如何将可滚动的照片放入imageView?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！