在您的界面中显示图片

作者: rain 分类: 移动 发布时间: 2012-04-15 17:54 6 条评论

这几内容综合了前面几节课程的内容,展示了如何在ViewPager和GridView中使用缓存载入多个图片。

在 ViewPager 中显示图片

这个 左右滑动界面的模式 非常适合在图库中显示每个图片详情。您
可以使用ViewPager 控件(结合 PagerAdapter)来实现这个设计模式。
。然而您还可以使用这个FragmentStatePagerAdapter Adapter,该Adapter会
自动清除和保存当前不可见ViewPager中的Fragment的状态,减少了程序内存的使用量。

注意:
如果您只是显示很少的图片,并且不会超出程序的内存限制,则使用普通的 PagerAdapter 或者
FragmentPagerAdapter 更加合适。

下面是一个 ViewPager 示例,包含了子控件
ImageView:

详细的 Fragment 中包含
ImageView 子控件:

希望您能发现上面代码中的一个潜在问题;上面的图片在UI线程中从系统资源中读取,这个操作可能导致该程序ANR。使用
AsyncTask 来在另外一个线程中载入图片是比较好的习惯。

任何其他处理 (例如 缩放图片或者从网络获取图片)都可以在 BitmapWorkerTask 中实现而不会影响UI线程的操作。
如果后台线程所做的工作不仅仅从磁盘载入图片,则使用一个内存或者磁盘缓存都可以得到一些收益。下面是一个修改后的内存缓存实现:

把这些代码组织起来,您就实现了一个最小图片加载延时的 ViewPager 实现,并且可以显示
任意数量的图片。

在 GridView 中显示图片

这个 grid list building block 适合用来显示一组图片,可以通过
GridView 控件实现,同时显示多张图片并且还缓存了另外几屏的图片用来后续显示(屏幕滚动的时候)。
当实现这种操作的时候,您要确保UI操作的流畅性、并且控制内存的使用量、还要正确的处理并发访问的情况。

下面代码演示了在Fragment中使用 GridView 来显示图片的情况。
:

再一次强调,上面的实现还有存在这个问题:在UI线程中加载图片资源。

通过 在非 UI 线程来处理图片 中介绍的内容很容易实现一个能处理并发访问的实现:

注意: 上面的代码很容易移植到 ListView

上面的代码可以很有弹性的处理大量图片而不会影响UI线程的流畅性。在后台线程中您可以从磁盘或者网络获取图片内容。

完整的代码请参考该课程的示例项目:下载示例项目

本文出自 云在千峰,转载时请注明出处及相应链接。

本文永久链接: http://blog.chengyunfeng.com/?p=396

Ɣ回顶部