多个layout界面之间的切换

屏幕切换指的是在同一个Activity内屏幕见的切换,最长见的情况就是在一个FrameLayout内有多个页面,比如一个系统设置页面;一个个性化设置页面。


通过查看 OPhone API文档可以发现,有个android.widget.ViewAnimator类继承至FrameLayout,ViewAnimator类的作用是为FrameLayout里面的View切换提供动画效果。该类有如下几个和动画相关的函数:
setInAnimation:设置 View进入屏幕时候使用的动画,该函数有两个版本,一个接受单个参数,类型为android.view.animation.Animation;一个接受两个参数,类型为Context和int,分别为Context对象和定义Animation的resourceID。
 
  • setOutAnimation: 设置View退出屏幕时候使用的动画,参数setInAnimation函数一样。
  • showNext: 调用该函数来显示FrameLayout里面的下一个View。
  • showPrevious: 调用该函数来显示FrameLayout里面的上一个View。
 
一般不直接使用 ViewAnimator而是使用它的两个子类ViewFlipper和ViewSwitcher。ViewFlipper可以用来指定FrameLayout内多个View之间的切换效果,可以一次指定也可以每次切换的时候都指定单独的效果。该类额外提供了如下几个函数:
 
  • isFlipping: 用来判断View切换是否正在进行
  • setFilpInterval:设置View之间切换的时间间隔
  • startFlipping:使用上面设置的时间间隔来开始切换所有的View,切换会循环进行
  • stopFlipping: 停止View切换
ViewSwitcher 顾名思义Switcher特指在两个View之间切换。可以通过该类指定一个ViewSwitcher.ViewFactory 工程类来创建这两个View。该类也具有两个子类ImageSwitcher、TextSwitcher分别用于图片和文本切换。
在教程中通过示例介绍ViewFlipper 的使用,其他的使用方式是类似的。详细信息可以参考文档:
 
ViewFlipper示例
记住, ViewFlipper是继承至FrameLayout的,所以它是一个Layout里面可以放置多个View。在示例中定义一个ViewFlipper,里面包含三个ViewGroup作为示例的三个屏幕,每个ViewGroup中包含一个按钮和一张图片,点击按钮则显示下一个屏幕。代码如下(res\layout\main.xml):
  1. <?xml version="1.0" encoding="utf-8"?>   
  2. <LinearLayout   
  3.     xmlns:android="http://schemas.android.com/apk/res/android"  
  4.     android:orientation="vertical"    
  5.     android:layout_width="fill_parent"  
  6.     android:layout_height="fill_parent">   
  7.     <ViewFlipper android:id="@+id/details"  
  8.        android:layout_width="fill_parent"    
  9.        android:layout_height="fill_parent"  
  10.        android:persistentDrawingCache="animation"  
  11.        android:flipInterval="1000"  
  12.        android:inAnimation="@anim/push_left_in"  
  13. android:outAnimation="@anim/push_left_out"  
  14. >    
  15.        <LinearLayout   
  16.            android:orientation="vertical"  
  17.            android:layout_width="fill_parent"    
  18.            android:layout_height="fill_parent">   
  19.            <Button   
  20.               android:text="Next"    
  21.               android:id="@+id/Button_next1"  
  22.               android:layout_width="fill_parent"    
  23.               android:layout_height="wrap_content">   
  24.            </Button>   
  25.            <ImageView   
  26.               android:id="@+id/image1"    
  27.               android:src="@drawable/dell1"  
  28.               android:layout_width="fill_parent"  
  29.               android:layout_height="wrap_content">   
  30.            </ImageView>   
  31.        </LinearLayout>   
  32.     
  33.        <LinearLayout   
  34.            android:orientation="vertical"  
  35.            android:layout_width="fill_parent"    
  36.            android:layout_height="fill_parent">   
  37.            <Button   
  38.               android:text="Next"    
  39.               android:id="@+id/Button_next2"  
  40.               android:layout_width="fill_parent"    
  41.               android:layout_height="wrap_content">   
  42.            </Button>   
  43.            <ImageView   
  44.               android:id="@+id/image2"    
  45.               android:src="@drawable/lg"  
  46.               android:layout_width="fill_parent"  
  47.               android:layout_height="wrap_content">   
  48.            </ImageView>   
  49.        </LinearLayout>   
  50.           
  51.        <LinearLayout   
  52.            android:orientation="vertical"  
  53.            android:layout_width="fill_parent"    
  54.            android:layout_height="fill_parent">   
  55.            <Button   
  56.               android:text="Next"    
  57.               android:id="@+id/Button_next3"  
  58.               android:layout_width="fill_parent"    
  59.               android:layout_height="wrap_content">   
  60.            </Button>   
  61.            <ImageView   
  62.               android:id="@+id/image3"    
  63.               android:src="@drawable/lenovo"  
  64.               android:layout_width="fill_parent"  
  65.               android:layout_height="wrap_content">   
  66.            </ImageView>   
  67.        </LinearLayout>   
  68.     
  69.     </ViewFlipper>   
  70.     
  71. </LinearLayout>  
 
很简单,在Layout定义中指定动画的相关属性就可以了,通过persistentDrawingCache指定缓存策略;flipInterval指定每个View动画之间的时间间隔;inAnimation和outAnimation分别指定View进出使用的动画效果。动画效果定义如下:
  1. res\anim\push_left_in.xml   
  2. <?xml version="1.0" encoding="utf-8"?>   
  3. <set xmlns:android="http://schemas.android.com/apk/res/android">   
  4.     <translate   
  5.     android:fromXDelta="100%p"    
  6.     android:toXDelta="0"    
  7.     android:duration="500"/>   
  8.     <alpha   
  9.     android:fromAlpha="0.0"    
  10.     android:toAlpha="1.0"  
  11.     android:duration="500" />   
  12. margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 38px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: solid; bor
分享到:
评论

你可能感兴趣的:(xml,android,OPhone)