Android：滚动图像视图
Posted
技术标签:
【中文标题】Android：滚动图像视图【英文标题】：Android: Scrolling an Imageview 【发布时间】：2011-03-04 17:50:44 【问题描述】：我的 ImageView 是正常屏幕高度的两倍（960 dip）。我想在屏幕上很好地上下滚动它。屏幕底部应包含一个按钮。我尝试了 ScrollView 和 Imageviews 的各种组合，但没有任何成功。我也考虑过没有结果的 :isScrollContainer 属性。任何人都知道如何做到这一点？ 干杯， 卢卡
【问题讨论】：
它是：底部应该包含一个 BUTTON...抱歉打错了。 【参考方案1】：@cV2 非常感谢您提供的代码。它让我朝着我需要的方向前进。这是我的修改版本，它在图像边缘停止滚动...
// 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;
);
我相信它可以稍微改进一下，但效果很好。 :)
【讨论】：
@wirbly ：我正在使用此代码，它对我来说非常有效，但只是想在左右移动时滚动屏幕宽度的一半。我们如何实现它？我必须改变的地方 使用此代码，图像从角落到角落，idk【参考方案2】：我找了这么久的代码，所以我想分享这个代码的和平：
这段代码来自一个Activity，它在后端有一个xml文件包含一个名为'img'的ImageView
<ImageView
android:layout_
android:layout_
android:id="@+id/img"
android:scaleType="center"
android:background="#fff"
android:src="@drawable/picName"
/>
@Override
public void onCreate(Bundle savedInstanceState)
super.onCreate(savedInstanceState);
setContentView(R.layout.xml_name_layout);
final ImageView switcherView = (ImageView) this.findViewById(R.id.img);
switcherView.setOnTouchListener(new View.OnTouchListener()
public boolean onTouch(View arg0, MotionEvent event)
float curX, curY;
switch (event.getAction())
case MotionEvent.ACTION_DOWN:
mx = event.getX();
my = event.getY();
break;
case MotionEvent.ACTION_MOVE:
curX = event.getX();
curY = event.getY();
switcherView.scrollBy((int) (mx - curX), (int) (my - curY));
mx = curX;
my = curY;
break;
case MotionEvent.ACTION_UP:
curX = event.getX();
curY = event.getY();
switcherView.scrollBy((int) (mx - curX), (int) (my - curY));
break;
return true;
);
为我完美地完成了这项工作...... 包括水平和垂直滚动（已启用）
唯一的缺点是...您可以滚动图片的边缘... 但这对我来说没问题.. 花一些时间您可以轻松实现此功能:)
祝你好运&&玩得开心
【讨论】：
布局是线性的还是相对的？ 对不起，不知道，但对于 imageview 本身，它不应该有任何区别 :) 祝你好运！ 很好的例子@cV2，我用它在imagView中滚动我的pdf。但是我有轻微的机会.. 在 onTouch 之前将 mx、my、curX 和 curY 声明为 mx，my 没有声明..:) 什么是 mx 和我的？【参考方案3】：这就是我修复它的方法：p
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_
android:layout_
android:scrollbarAlwaysDrawVerticalTrack="true">
<ImageView
android:layout_
android:layout_
android:adjustViewBounds="true"
android:contentDescription="Specs"
android:scrollbars="vertical"
android:src="@drawable/image"/>
</ScrollView>
【讨论】：
简单的解决方案..首选。 双方？【参考方案4】：@wirbly 非常感谢您的代码，它完全按照我想要的方式工作。 但是当我第一次阅读您的代码时，我对您忘记定义的四个变量感到有些困惑。
所以，我想添加代码的定义以使其更清晰。
Resources res=getResources();
Bitmap mBitmap = BitmapFactory.decodeResource(res, R.drawable.p_1920x1080);
BitmapDrawable bDrawable = new BitmapDrawable(res, mBitmap);
//get the size of the image and the screen
int bitmapWidth = bDrawable.getIntrinsicWidth();
int bitmapHeight = bDrawable.getIntrinsicHeight();
int screenWidth = this.getWindowManager().getDefaultDisplay().getWidth();
int screenHeight = this.getWindowManager().getDefaultDisplay().getHeight();
希望对你有帮助。
【讨论】：
【参考方案5】：最简单的方法是使用 webview 并通过本地 html 文件将图像加载到其中。这样，如果您想使用缩放控件，您也将自动获得它们。 对于大图像（即如果它是 1000 或 3000 px 宽），您会注意到 Android (Coliris) 不太擅长非常清晰地显示大型缩放图像，即使原始图像是清晰且未压缩的）。这是一个已知的问题。解决方案是将大图像分解为较小的图块，然后通过 html（div 或表格）再次将它们组合在一起。 我使用这种方法向用户提供地铁地图（大于屏幕且可滚动）。
WebView webView = (WebView)findViewById(R.id.webView);
webView.getSettings().setBuiltInZoomControls(true);
webView.getSettings().setUseWideViewPort(true);
webView.getSettings().setDefaultZoom(WebSettings.ZoomDensity.FAR);
webView.loadUrl( "content://com.myapp.android.localfile/sdcard/myappdata/common/mtr_map.html");
这可能适用于大多数情况/“常规应用”，但取决于您的具体情况。如果您将图像作为游戏的可滚动背景进行讨论，它可能对您没有用处。
除了 html 文件，您还可以直接加载图像（png、jpg）。如果您不想要缩放控件，只需将其关闭即可。
【讨论】：
我经常这样做，但我来这个问题是为了其他技术。不过我为你 +1 了！ 很抱歉我投了反对票，但我会尽一切努力避免使用 WebView，因为它是一个非常重的视图。 @MathiasLin WebView 显示图像可能非常方便，但我们体验到通过绑定到本机 WebKit 小部件的内存开销太高了 .此外，此视图似乎泄漏内存：code.google.com/p/android/issues/detail?id=9375 @martyonair 是的，你是对的。你链接的错误报告实际上是我当时报告的:)我知道这一点，所以基本上，它只是关于方便的缩放功能，假设只有一个 WebView - 内存消耗对你来说可能没那么重要某些情况。我想这也可以通过其他方式实现。 @MathiasLin 我记得我使用矩阵缩放来实现缩放 ImageViews，这篇文章中的解决方案：***.com/questions/10630373/… 为我工作你报告了这个错误？ dafuq - 世界上的小^^【参考方案6】：另一种方法是创建HorizontalScrollView，将imageView 添加到其中，然后将HorizontalScrollView 添加到ScrollView。这允许您向上、向下、向左、向右滚动。
【讨论】：
我刚刚尝试过，因为它看起来不错且简单，但遗憾的是用户体验令人失望。一次只能水平或垂直滚动，不能在对角线上发生。更糟糕的是：假设垂直滚动是外部容器，那么如果您进行不是近乎完美水平的对角滑动，则滚动将垂直发生，即使您的滑动的垂直分量远小于其水平分量。跨度> 【参考方案7】：对我有用
<ScrollView
android:layout_
android:layout_
android:padding="10dp">
<LinearLayout
android:layout_
android:layout_
android:orientation="vertical">
<ImageView
android:layout_
android:layout_
android:src="@drawable/img"
android:scaleType="centerCrop"
android:adjustViewBounds="true"/>
<Button
style="@style/btn"
android:id="@+id/btn"
android:layout_
android:layout_marginTop="20dp"
android:background="@drawable/btn"
android:onClick="click"
android:text="text" />
</LinearLayout>
</ScrollView>
【讨论】：
【参考方案8】：嘿，伙计们找到了一个简单且 100% 可靠的解决方案，正如上面提到的 X 先生（因为提到的其他代码在某些设备上不起作用或损坏） 只需使用 android 提供的 ScrollView 就可以了
类似的东西
<ScrollView android:layout_ android:id="@+id/scrollView1"
android:layout_ android:layout_alignParentTop="true"
android:layout_alignParentLeft="true" android:layout_above="@+id/button1"
android:layout_alignParentRight="true" android:scrollbarAlwaysDrawVerticalTrack="true">
<LinearLayout android:id="@+id/linearLayout1"
android:layout_ android:layout_ android:gravity="center_horizontal">
<ImageView android:src="@android:drawable/ic_menu_report_image"
android:layout_ android:id="@+id/imageView1"
android:layout_></ImageView>
</LinearLayout>
</ScrollView>
并在 oncreate 类似的东西
if (mImageName != null)
InputStream is = null;
try
is = this.getResources().getAssets().open("mathematics/"+mImageName);
catch (IOException e)
Bitmap image = BitmapFactory.decodeStream(is);
mImageView.setImageBitmap(image);
干杯！
【讨论】：
ScrollView 只能垂直滚动。以上是关于Android：滚动图像视图的主要内容，如果未能解决你的问题，请参考以下文章
如何在 Android 的滚动视图中放大/更改子图像视图尺寸以使图像全尺寸
列表视图的 Android LazyList 初始加载在滚动之前不显示图像