Android Gallery 3D 特效精华

Android Gallery 3D 特效精华

 

一、布局 
gallery3d 的界面生成和普通的应用程序不一样。普通程序一般一个界面就是一 
个activity,布局用xml或代码都可以实现,界面切换是activity 的切换方式; 
而 gallery3d没有用android 的UI 系统,而是用opengl 画出来的,即界面是在 
同一个 activity 的,如主界面,缩略图界面,单张图片查看界面,标记界面等 
都属于同一个activity。那么这界面布局不同的界面是如何组合到一起的呢? 
分析代码,可以把它看成一个状态机: 
1、标记模式             public static final int MODE_SELECT = 1;(HudLayer) 
包含了主界面标记模式,缩略界面矩阵游览时标记模式、缩略图界面分类游览时 
标记模式 3个界面 
2、普通模式           public static final int MODE_NORMAL = 0;(HudLayer) 
包含了

Java 代码

   1.  public static final int STATE_MEDIA_SETS = 0;主界面 
   2.    public static final int STATE_GRID_VIEW = 1;缩略图矩阵浏览 
   3.    public static final int STATE_FULL_SCREEN = 2;查看界面 
   4.    public static final int STATE_TIMELINE = 3;缩略图界面分类浏览

有了以上状态分类后,在渲染的时候就能根据些界面的组成来定哪些控件譔隐藏, 
哪些要显示了。 
下面是基本控件:

Java 代码

    1.  com.cooliris.media.GridLayer 
    2.  com.cooliris.media.BackgroundLayer 
    3.  com.cooliris.media.HudLayer 
    4.  com.cooliris.media.ImageButton 
    5.  com.cooliris.media.TimeBar 
    6.  com.cooliris.media.MenuBar 
    7.  com.cooliris.media.PopupMenu 
    8.  com.cooliris.media.PathBarLayer

在渲染时,每一帧所有界面上的元素都画了,由于根据上面的状态只把特定窗口 
的特定元素显示出来,其它窗口中的隐藏,所以不会乱。 
Layer 是上面控件的基类,上面控件的类也就有了下面两个方法来隐藏不譔显示 
的界面元素。

Java 代码

    1.  public boolean isHidden() { 
    2.      return mHidden; 
    3.    } 
    4. 
    5.    public void setHidden(boolean hidden) { 
    6.      if (mHidden != hidden) { 
    7.        mHidden = hidden; 
    8.        onHiddenChanged(); 
    9.      } 
    10.   }

下面是根据上面分类来画不同元素所用的标识:

Java 代码

    1.  public static final int PASS_THUMBNAIL_CONTENT = 0; 
    2.    public static final int PASS_FOCUS_CONTENT = 1; 
    3.    public static final int PASS_FRAME = 2; 

 4.    public static final int PASS_PLACEHOLDER = 3; 
   5.    public static final int PASS_FRAME_PLACEHOLDER = 4; 
   6.    public static final int PASS_TEXT_LABEL = 5; 
   7.    public static final int PASS_SELECTION_LABEL = 6; 
   8.    public static final int PASS_VIDEO_LABEL = 7; 
   9.    public static final int PASS_LOCATION_LABEL = 8; 
    10.  public static final int PASS_MEDIASET_SOURCE_LABEL = 9;

Java 代码

   1.  drawDisplayItem(view, gl, displayItem, texture, PASS_THUMBNAIL_CONTENT, placeholde

       r,displayItem.mAnimatedPlaceholderFade); 画缩略图的,注掉此句,前两屏只显示框, 
       第三屏 OK 
   2.  drawDisplayItem(view, gl, displayItem, texture, PASS_FOCUS_CONTENT, null, 0.0f);画单 
       张图片的,注掉,第三屏黑屏 
   3.  drawDisplayItem(view, gl, itemDrawn, textureToUse, PASS_FRAME, previousTexture, ratio 
       );画边框的,注掉,前两屏明显没有边框,巨齿明显 
   4.  drawDisplayItem(view, gl, displayItem, textureString, PASS_TEXT_LABEL, null, 0);画文本 
       标签的 
   5.  drawDisplayItem(view, gl, displayItem, textureToUse, PASS_SELECTION_LABEL, null, 0);画 
       选中标记的 
   6.  drawDisplayItem(view, gl, displayItem, videoTexture, PASS_VIDEO_LABEL, null, 0);画视频 
       标记的 
   7.  drawDisplayItem(view, gl, displayItem, locationTexture, PASS_LOCATION_LABEL, null, 0); 
       画位置标记的 
   8.  drawDisplayItem(view, gl, displayItem, locationTexture, PASS_MEDIASET_SOURCE_LABEL 
       ,transparentTexture, 0.85f);画源来源图标的(相机或一般文件夹)

二、特效 
举如何显示一张图片为例,在图片完全显示出来经过这样一个过程,附近的图片 
渐小渐出,当前图片渐大渐入,当前图片逐渐变大直到全屏。实现这个特效,要 
进行很多帧的渲染。就是说并不是只调一次 onDrawFrame 函数就可以了,要调用 
多次。可以把这个特效的实现想成一个状态变化的过程,在每一个状态,纹理的 
显示大小和位置都不同,这也符合动画的基本原理。放大、缩小我们只要改变顶 
点数据就可以做到,gallery3d 也是这样做的,下面是主要代码: 
我们知道调用onDrawFrame来渲染,最后调到下面的 drawFocusItems 函数,

Java 代码

   1.  GridQuad quad = GridDrawables.sFullscreenGrid[vboIndex]; 
   2.  float u = texture.getNormalizedWidth(); 
3.  float v = texture.getNormalizedHeight(); 
    4.  float imageWidth = texture.getWidth(); 
    5.  float imageHeight = texture.getHeight(); 
    6.  boolean portrait = ((theta / 90) % 2 == 1); 
    7.  if (portrait) { 
    8.       viewAspect = 1.0f / viewAspect; 
    9.  }

    10.  quad.resizeQuad(viewAspect, u, v, imageWidth, imageHeight);//改变用来贴图片的长方 
        形的大小 
    11.  quad.bindArrays(gl);//绑定新数据,为渲染做准备。

而位置的改变有两种方式,一种是直接以顶点数据中改变,另一种是计算出在 3 
维 3个方向的偏移量,再调用 gltranslate来做,从代码可以看出采用的是第二 
种方式来做的,比第一种方式更方便一些。代码:

Java 代码

    1.  gl.glTranslatef(-translateXf, -translateYf, -translateZf);

而这里的3个偏移量的计算是和camera相关的,相关文件为GridCamera.java, 
GridCameraManager.java,过程很复杂,理清楚后再细化吧。

cache管理 
下面是cache文件

Java 代码

    1.  /sdcard/Android/data/com.cooliris.media/cache/local-album-cache 
    2.  d---rwxr-x system  sdcard_rw       2010-05-21 09:56 local-album-cache 
    3.  d---rwxr-x system  sdcard_rw       2010-05-21 09:56 local-meta-cache 
    4.  ----rwxr-x system  sdcard_rw   299877 2010-05-28 07:36 local-album-cachechunk_0 
    5.  d---rwxr-x system  sdcard_rw       2010-05-21 09:56 geocoder-cache 
    6.  ----rwxr-x system  sdcard_rw    284 2010-05-28 07:36 local-album-cacheindex 
    7.  d---rwxr-x system  sdcard_rw       2010-05-21 09:56 local-image-thumbs 
    8.  d---rwxr-x system  sdcard_rw       2010-05-21 09:56 local-video-thumbs 
    9.  d---rwxr-x system  sdcard_rw       2010-05-21 09:56 picasa-thumbs 
    10.  ----rwxr-x system sdcard_rw     80 2010-05-28 07:36 local-meta-cachechunk_0 
    11.  ----rwxr-x system sdcard_rw    164 2010-05-28 07:36 local-meta-cacheindex 
    12.  d---rwxr-x system sdcard_rw       2010-05-21 09:56 hires-image-cache 
    13.  ----rwxr-x system sdcard_rw   627629 2010-05-28 07:37 local-image-thumbschunk_0 
    14.  ----rwxr-x system sdcard_rw    3914 2010-05-21 09:56 local-image-thumbsindex 
    15.  ----rwxr-x system sdcard_rw   53343 2010-05-28 07:34 hires-image-cache-4982941342 
        287215583_1024.cache 
16.  ----rwxr-x system sdcard_rw   237692 2010-05-28 07:33 hires-image-cache36845684843 
         69117627_1024.cache 
    17.  ----rwxr-x system sdcard_rw    133182 2010-05-28 07:34 hires-image-cache60754254408 
         1226432_1024.cache 
    18.  ----rwxr-x system sdcard_rw    83223 2010-05-28 07:34 hires-image-cache42754796232 
         10216146_1024.cache 
    19.  ----rwxr-x system sdcard_rw   292837 2010-05-28 07:34 hires-image-cache-6463165569 
         36433937_1024.cache 
    20.  ----rwxr-x system sdcard_rw    191377 2010-05-28 07:35 hires-image-cache26313646045 
         09958174_1024.cache 
    21.  ----rwxr-x system sdcard_rw   366905 2010-05-28 07:35 hires-image-cache-3280562009 
         766080884_1024.cache 
    22.  ----rwxr-x system sdcard_rw   323671 2010-05-28 07:35 hires-image-cache57524718275 
         33329222_1024.cache

创建 cache 的关键代码

Java 代码

    1.   LocalDataSource 
    2.   public static final DiskCache sThumbnailCache = new DiskCache("local-image-thumbs");-- 
         --------------------local-image-thumbs local-image-thumbschunk_0 local-image-thumbsind 
         ex 
    3.   public static final DiskCache sThumbnailCacheVideo = new DiskCache("local-video-thum 
         bs");--------------------local-video-thumbs 
    4.   public static final DiskCache sAlbumCache = new DiskCache("local-album-cache");--------- 
         -------------local-album-cache local-album-cacheindex 
    5.   public static final DiskCache sMetaAlbumCache = new DiskCache("local-meta-cache");---- 
         --------------local-meta-cache local-meta-cacheindex 
    6.   getChunkFile --------------local-meta-cachechunk_0 local-album-cachechunk_0 
    7. 
    8.   ReverseGeocoder::   private static final DiskCache sGeoCache = new DiskCache("geocoder 
         -cache"); -------------------------geocoder-cache 
    9.   PicasaDataSource:: public static final DiskCache sThumbnailCache = new DiskCache("pica 
         sa-thumbs");-----------------------------picasa-thumbs 
    10.  UriTexture::writeToCache  --------------------------hires-image-cache-xxx_1024.cache

布局补充: 
在画一个界面是,是分类化的,比如第一个界面是显示所有有图片的文件夹,在代 
码里叫专辑.有这些元素要创建: 
文本标签            显示专辑名和专辑内图片或视频数 
路径条 显示路径名 
按纽 拍照按纽,放大/缩小

菜单栏 全选,取消全选,分享,删除,更多等 
图片边框 
用于显示图片的矩形 
在渲染时一次把一类元素画完,再画另一类.如主界面顺序为: 
路径条->按纽->文本标签->图片边框->图片. 
具体代码见drawBlendedComponents 函数

1.CacheService.java 中 写 缓 存 :        sAlbumCache.put(ALBUM_CACHE_LOCALE_INDEX, 
sDummyData, 0);

 第一个是 key     ,这里是正常数据,当然还有别的 key               , key  分别是 -1,-2,-3,-4,-5 。

2.DiskCache.java 中,执行上面的写的过程,这里先得明白他的 cache                 怎么装的:

  它是由很多称之为“片”的文件组成的,形成一个 List                   形式: private final

LongSparseArray<RandomAccessFile>        mChunkFiles            =           new 
LongSparseArray<RandomAccessFile>();

即 mChuckFiles 就是整个 cache     ,里面包括很多 chunk(       即片 )   ,每一个 chunk     大小为 
1MB.

当要写入某一个 chunk          里面的时候,先要找到他在  mChuckFiles               里面的索引值即 
chunkIndex, 由

mChunkFiles.get(chunkIndex); 来获取这个文件, chunkIndex    怎么来的呢?

private LongSparseArray<Record> mIndexMap;

Record record = mIndexMap.get(key); 这里的 key 就是上面用 put   方法传过来的

ALBUM_CACHE_LOCALE_INDEX   的值(就是 -5     )

int chunkIndex = record.chunk;

这么一步步来的。

当然了,第一次都是空的,也就是 get                 不到东西 mChunkFiles.get(chunkIndex);  和 Record 
record =

mIndexMap.get(key); 都 get 不到,那么第一次就先把东西放进去,mIndexMap.put(key, new 
Record

(chunkIndex, record.offset, data.length, record.sizeOnDisk,  timestamp)); (记录key 值)以及 
final

String chunkFilePath = mCacheDirectoryPath + CHUNK_FILE_PREFIX + chunk; chunkFile = new

RandomAccessFile(chunkFilePath, "rw");mChunkFiles.put(chunk, chunkFile); (三句代码来新建 
一个

chunkfile 并放到 cache  列表里面)

注意:Record    是内部类,只是一个数据集合类而已,相当于文件描述信息。每个 cache                             (即 
chunk )对应一个。

private     final   LongSparseArray<RandomAccessFile>   mChunkFiles    =     new 
LongSparseArray<RandomAccessFile>(); 中 mChunkFiles 最大装 13  个,每个 chunk     是 1M, 
所以全部 Cache     是 13M. 

www.J2meGame.com精心收集。

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值