Android上webview界面切換動畫效果

下面是主要代碼：

<a href="http://my.oschina.net/u/2448717/blog/499633#">?</a>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

<code>@override</code> 

<code>        </code><code>public</code> <code>void</code> <code>onprogresschanged(webview view,</code><code>int</code> <code>newprogress) { </code>

<code>            </code><code>if</code><code>(newprogress==</code><code>100</code><code>){ </code>

<code>                </code><code>if</code><code>(iamgeview!=</code><code>null</code><code>) </code>

<code>                </code><code>iamgeview.setvisibility(view.gone); </code>

<code>                </code><code>//view.setvisibility(view.visible);  </code>

<code>              </code> 

<code>                </code><code>//droidgap.this.root.addview(view);  </code>

<code>                </code><code>system.out.println(</code><code>"加載完成"</code><code>); </code>

<code>                </code><code>animation translate_in=animationutils.loadanimation(droidgap.</code><code>this</code><code>, r.drawable.translate_in); </code>

<code>                  </code> 

<code>                </code><code>translate_in.setfillafter(</code><code>true</code><code>); </code>

<code>                </code><code>translate_in.setduration(</code><code>1000</code><code>); </code>

<code>                </code><code>translate_in.setdetachwallpaper(</code><code>true</code><code>); </code>

<code>            </code><code>//  translate_in.  </code>

<code>                </code><code>view.setanimation(translate_in);  </code>

<code>    </code><code>animation translate_out=animationutils.loadanimation(droidgap.</code><code>this</code><code>, r.drawable.translate_out); </code>

<code>    </code><code>translate_out.setanimationlistener(</code><code>new</code> <code>animationlistener(){ </code>

<code>  </code> 

<code>        </code><code>@override</code> 

<code>        </code><code>public</code> <code>void</code> <code>onanimationend(animation animation) { </code>

<code>            </code><code>if</code><code>(</code><code>null</code><code>!=iamgeview){ </code>

<code>                </code><code>droidgap.</code><code>this</code><code>.root.removeview(iamgeview); </code>

<code>                </code><code>iamgeview=</code><code>null</code><code>; </code>

<code>            </code><code>} </code>

<code>        </code><code>} </code>

<code>        </code><code>public</code> <code>void</code> <code>onanimationrepeat(animation animation) { </code>

<code>            </code><code>// todo auto-generated method stub  </code>

<code>        </code><code>public</code> <code>void</code> <code>onanimationstart(animation animation) { </code>

<code>          </code> 

<code>    </code><code>}); </code>

<code>    </code><code>translate_out.setfillafter(</code><code>true</code><code>); </code>

<code>    </code><code>translate_out.setduration(</code><code>1000</code><code>); </code>

<code>    </code><code>translate_out.setdetachwallpaper(</code><code>true</code><code>); </code>

<code>    </code><code>if</code><code>(</code><code>null</code><code>!=iamgeview){ </code>

<code>        </code><code>iamgeview.setanimation(translate_out);  </code>

<code>    </code><code>}            </code>

<code>            </code><code>}</code><code>else</code><code>{ </code>

<code>                </code><code>if</code><code>(</code><code>null</code><code>==iamgeview){ </code>

<code>                      </code> 

<code>                    </code><code>iamgeview=</code><code>new</code> <code>imageview(droidgap.</code><code>this</code><code>); </code>

<code>                    </code><code>view.setdrawingcacheenabled(</code><code>true</code><code>); </code>

<code>                    </code><code>bitmap bitmap=view.getdrawingcache(); </code>

<code>                    </code><code>if</code><code>(</code><code>null</code><code>!=bitmap){ </code>

<code>                        </code><code>bitmap b=   bitmap.createbitmap(bitmap); </code>

<code>                        </code><code>iamgeview.setimagebitmap(b); </code>

<code>                    </code><code>} </code>

<code>                            </code><code>droidgap.</code><code>this</code><code>.root.addview(iamgeview); </code>

<code>                </code><code>} </code>

<code>            </code><code>super</code><code>.onprogresschanged(view, newprogress); </code>

<code>        </code><code>}</code>

<code>&lt;span style=</code><code>"color: rgb(51, 51, 51); font-family: tahoma, 宋體; font-size: 14px; line-height: 22.3999996185303px; text-align: justify; background-color: rgb(250, 250, 252);"</code><code>&gt;其中的iamgeview：自己定義的imageview控件。&lt;/span&gt;</code>

r.drawable.translate_in：進入的translate動畫 

<code>&lt;?</code><code>xml</code> <code>version</code><code>=</code><code>"1.0"</code> <code>encoding</code><code>=</code><code>"utf-8"</code><code>?&gt; </code>

<code>     </code><code>&lt;</code><code>translate</code> <code>android:fromxdelta</code><code>=</code><code>"100%"</code> <code>android:toxdelta</code><code>=</code><code>"0%p"</code>   

<code>            </code><code>android:duration</code><code>=</code><code>"100"</code> <code>/&gt;   </code>

<code>      </code> 

<code>&lt;/</code><code>set</code><code>&gt;</code>

<code>&lt;</code><code>span</code> <code>style</code><code>=</code><code>"color: rgb(51, 51, 51); font-family: tahoma, 宋體; font-size: 14px; line-height: 22.3999996185303px; text-align: justify; background-color: rgb(250, 250, 252);"</code><code>&gt;r.drawable.translate_out：出的translate動畫&lt;/</code><code>span</code><code>&gt;</code>

<code>&lt;</code><code>span</code> <code>style</code><code>=</code><code>"color: rgb(51, 51, 51); font-family: tahoma, 宋體; font-size: 14px; line-height: 22.3999996185303px; text-align: justify; background-color: rgb(250, 250, 252);"</code><code>&gt;&lt;/</code><code>span</code><code>&gt;&lt;</code><code>pre</code> <code>name</code><code>=</code><code>"code"</code> <code>class</code><code>=</code><code>"html"</code><code>&gt;&lt;?</code><code>xml</code> <code>version</code><code>=</code><code>"1.0"</code> <code>encoding</code><code>=</code><code>"utf-8"</code><code>?&gt; </code>

<code>     </code><code>&lt;</code><code>translate</code> <code>android:fromxdelta</code><code>=</code><code>"0%"</code> <code>android:toxdelta</code><code>=</code><code>"-100%p"</code>   

該代碼較長的描述：在onprogresschanged方法中，首先判定是否加載進度是否到100，

在沒有執行完的情況下，先去new imageview對象，iamgeview=new imageview(droidgap.this);

然後進行設定view.setdrawingcacheenabled(true);很重要的一句話，

為了下面能夠對webview界面截取圖檔，即 bitmap bitmap=view.getdrawingcache();

之後将bitmap加到imageview中：imageview.setimagebitmap(bitmap);

然後添加到目前的linearlayout布局中即droidgap.this.root.addview(iamgeview);

如果下面的頁面加載完成了，就執行進入動畫，即view.setanimation(translate_in);

同時對該imageview執行out動畫，并且在動畫的監聽的結束時執行

droidgap.this.root.removeview(iamgeview);即清除掉目前生成的螢幕截圖。

iamgeview=null;

最後一點要注意清除截圖，否則android虛拟機可能會出現報錯。