`
venus585625
  • 浏览: 253184 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

转载:Andorid小項目之--Animation四種動畫的圖片效果(附源碼)

阅读更多
繼上篇未講述完的動畫實例效果,本篇將會全部實現android小種類型動畫的效果,這次為了方便我沒有用xml文件加載,如果追求OO原則可以自行創建XML,根據具體參數自行配置。

四種動畫效果運行圖:




漸變Alpha

拉伸由大到小Scale

移位Translate

旋轉Rotate
  本篇重點:定義Gallery組件的屬性信息,通過在res\Values\attrs.xml文件定,代碼如下:

<?xml version="1.0" encoding="utf-8"?>
<resources>
  <declare-styleable name="Gallery">
    <attr name="android:galleryItemBackground" />
  </declare-styleable>
</resources>



以上XML屬性信息設置了Gallery組件的背景風格

注意:這個XML一定要放在values下麵,如果將它放在layout目錄下,將無法讀取;

如果設置Gallery數據,我在此就不多說了,您可以在我之前的博客獲得相關的操作方法:http://www.cnblogs.com/TerryBlog/archive/2010/05/17/1737789.html

在這里重點要說的就是以下幾段代碼 :

片段一:

代码
    private int mGalleryItemBackGround;  //獲取資源ID
    public static int[] myImageArray=
    {
            R.drawable.one,
            R.drawable.two,
            R.drawable.three,
            R.drawable.four,
            R.drawable.five,
            R.drawable.six
    };
    private Context mContext;
    private int Height;
    private int Width;
    public ImageAdapter(Context c,int height,int width)
    {
        mContext=c;
        Height=height;
        Width=width;
        TypedArray ta=c.obtainStyledAttributes(R.styleable.Gallery);
        mGalleryItemBackGround=ta.getResourceId(R.styleable.Gallery_android_galleryItemBackground,
                0);
       
        ta.recycle();
    }


構造函數裏面,帶了一個上下文,一個高度,一個寬度。

參數一:為了防止這個錯误“The method obtainStyledAttributes(int[]) is undefined for the type ImageAdapter”,意思是obtainStyledAttributes()是Context类中的方法,如果将ImageAdapter单独写在一个.java文件中的话,必须在obtainStyledAttributes()方法前加上方法的引用才能解决问题。

參數二三:是為了後面設置圖片的高度和寬度,後方將有介紹。

代碼示意:通過TypedArray或者Gallery組件屬性,然後設置Gallery的背景風格,之后通過TypedArray所得到的對象,設置Gallery組件無無限循環顯示。

片段二:

代码
public View getView(int position, View convertView, ViewGroup parent) {
        // TODO Auto-generated method stub
        ImageView iv=new ImageView(mContext);
        iv.setImageResource(myImageArray[position]);
    
        iv.setScaleType(ImageView.ScaleType.FIT_CENTER);  //設置圖片的寬高
       
        iv.setLayoutParams(new Gallery.LayoutParams(Width, Height));     //設置圖片的寬高
       
        iv.setBackgroundResource(mGalleryItemBackGround);        //通過 上面設置的資源ID設置背景圖
        return iv;
    }


重寫getView這個方法,設置圖片的資源,之后通過setLayoutParams這個方法用傳進來的高度和寬度設置圖片寬高。

如何獲取屏幕的高度和寬度:



import android.util.DisplayMetrics; //命名空間

DisplayMetrics dm=new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(dm);




之后通過dm.heightPixels,dm.widthPixels  的屬性可得到屏幕高度和寬度。

基本工作完畢,現在到了我們的動畫階段,四種動畫定義如下:

代码


private Animation myAnimationAlpha;
    private Animation myAnimationScale;
    private Animation myAnimationTranslate;
    private Animation myAnimationRotate;

myAnimationAlpha=new AlphaAnimation(0.1f, 1.0f);
        myAnimationAlpha.setDuration(3000);
       
        myAnimationScale=new ScaleAnimation(0.0f, 1.4f, 0.0f, 1.4f,
                Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
        myAnimationScale.setDuration(3000);
       
        myAnimationTranslate=new TranslateAnimation(30.0f, -80.0f, 30.0f, 300.0f);
        myAnimationTranslate.setDuration(3000);
       
       myAnimationRotate=new RotateAnimation(0.0f, +350.0f,
               Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF, 0.5f);
       myAnimationRotate.setDuration(3000);




詳細參數說明請看這里:http://www.cnblogs.com/TerryBlog/archive/2010/05/30/1747311.html

定義好了動畫的顯示方式,就可以在Gallery組件上做動作了,做一個點擊事件監聽,當用戶每點擊一次就執行一次動畫,四種動畫效果就循環交替顯示各自的魅力

代碼如下:

代码
  myGallery.setOnItemClickListener(new OnItemClickListener() {

            @Override
            public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,
                    long arg3) {
                // TODO Auto-generated methsod stub
                ImageView ig=(ImageView)arg1;
                switch (i) {
                case 0:
                    ig.startAnimation(myAnimationAlpha);
                    i++;
                    break;
                case 1:
                    ig.startAnimation(myAnimationScale);
                    i++;
                    break;
                case 2:
                    ig.startAnimation(myAnimationTranslate);
                    i++;
                    break;
                case 3:
                    ig.startAnimation(myAnimationRotate);
                    i=0;
                    break;
                default:
                    break;
                }
               
               
                //ImageAdapter.myImageArray[arg2];
            }
        });


總結:

一開始看到動畫效果複雜的參數列表,有點關暈,但耐下心來看一下,覺得還是有一定的規律的,掌握好這門動畫課程以后項目上的動畫效果將迎刃而解。
转载出:http://www.cnblogs.com/TerryBlog/archive/2010/05/31/1748628.html
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics