机顶盒中动画、倒影、悬浮效果实现！！！！

一个比较感兴趣的布局 记录下备用

转载地址 http://blog.csdn.net/a565102223/article/details/41246887

 上次写了一篇关于机顶盒焦点事件的获取，以及页面的适配。接下来，开始编写机顶盒开发中对于一些图片的焦点事件，动画效果、倒影的实现。这都是在机顶盒开发界面中常常要要用到的一些效果！！直接开代码：

由于上一篇文章我已经写过了一些界面的适配，（http://blog.csdn.net/a565102223/article/details/41074645）接下来就直接在上次的代码中修改了，为了简单演示起见，我只修改View1的layout1.

[java] view plain copy

print ?

1. <?xml version="1.0" encoding="utf-8"?>  
2. <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"  
3.     android:layout_width="match_parent"  
4.     android:layout_height="match_parent"  
5.     android:paddingTop="45dp" >  
6.   
7.   
8.     <FrameLayout  
9.         android:layout_width="wrap_content"  
10.         android:layout_height="wrap_content" >  
11. <!-- 这个布局中的imageview是创建倒影使用的 -->  
12.         <RelativeLayout  
13.             android:layout_width="wrap_content"  
14.             android:layout_height="wrap_content"  
15.             android:layout_marginTop="425dp" >  
16.   
17.   
18.             <ImageView  
19.                 android:id="@+id/setting_layout_refimg_0"  
20.                 android:layout_width="wrap_content"  
21.                 android:layout_height="wrap_content"  
22.                 android:layout_marginLeft="50dp" />  
23.   
24.   
25.             <ImageView  
26.                 android:id="@+id/setting_layout_refimg_1"  
27.                 android:layout_width="wrap_content"  
28.                 android:layout_height="wrap_content"  
29.                 android:layout_marginLeft="300dip" />  
30.         </RelativeLayout>  
31.   
32.   
33.         <RelativeLayout  
34.             android:id="@+id/video_type_layout"  
35.             android:layout_width="wrap_content"  
36.             android:layout_height="wrap_content"  
37.             android:layout_gravity="center_horizontal" >  
38. <!-- 布局都是使用的帧布局，看起起来会有突出的效果，记得把可点击的属性都加上 -->  
39.             <FrameLayout  
40.                 android:id="@+id/setting_layout_fl_0"  
41.                 android:layout_width="510dp"  
42.                 android:layout_height="344dp" >  
43. <!-- 这张图片作为第一张图片，但图片获得焦点后显示，失去焦点后不显示 -->  
44.                 <ImageView  
45.                     android:id="@+id/setting_layout_bg_0"  
46.                     android:layout_width="wrap_content"  
47.                     android:layout_height="wrap_content"  
48.                     android:layout_marginLeft="20dp"  
49.                     android:layout_marginTop="20dp"  
50.                     android:background="@drawable/setting_left_top" />  
51. <!-- 功能图片 -->  
52.                 <ImageView  
53.                     android:id="@+id/setting_layout_log_0"  
54.                     android:layout_width="264dp"  
55.                     android:layout_height="250dp"  
56.                     android:layout_marginLeft="115dp"  
57.                     android:layout_marginTop="20dp"  
58.                     android:clickable="true"  
59.                     android:focusable="true"  
60.                     android:focusableInTouchMode="true"  
61.                     android:nextFocusDown="@+id/setting_layout_log_1"  
62.                     android:nextFocusRight="@+id/setting_layout_log_3"  
63.                     android:nextFocusUp="@id/settings"  
64.                     android:scaleType="fitXY"  
65.                     android:src="@drawable/setting_net" />  
66.             </FrameLayout>  
67.   
68.   
69.             <FrameLayout  
70.                 android:id="@+id/setting_layout_fl_1"  
71.                 android:layout_width="400dp"  
72.                 android:layout_height="244dp"  
73.                 android:layout_marginLeft="50dp"  
74.                 android:layout_marginTop="210dp" >  
75.   
76.   
77.                 <ImageView  
78.                     android:id="@+id/setting_layout_bg_1"  
79.                     android:layout_width="wrap_content"  
80.                     android:layout_height="wrap_content"  
81.                     android:background="@drawable/right_bottom" />  
82.   
83.   
84.                 <ImageView  
85.                     android:id="@+id/setting_layout_log_1"  
86.                     android:layout_width="264dp"  
87.                     android:layout_height="150dp"  
88.                     android:layout_marginLeft="65dp"  
89.                     android:layout_marginTop="65dp"  
90.                     android:clickable="true"  
91.                     android:focusable="true"  
92.                     android:focusableInTouchMode="true"  
93.                     android:nextFocusRight="@+id/setting_layout_log_2"  
94.                     android:nextFocusUp="@+id/setting_layout_log_0"  
95.                     android:scaleType="fitXY"  
96.                     android:src="@drawable/setting_update" />  
97.             </FrameLayout>  
98.   
99.   
100.             <FrameLayout  
101.                 android:id="@+id/setting_layout_fl_2"  
102.                 android:layout_width="550dp"  
103.                 android:layout_height="300dp"  
104.                 android:layout_marginLeft="300dp"  
105.                 android:layout_marginTop="165dp" >  
106.   
107.   
108.                 <ImageView  
109.                     android:id="@+id/setting_layout_bg_2"  
110.                     android:layout_width="wrap_content"  
111.                     android:layout_height="wrap_content"  
112.                     android:background="@drawable/vod_big_top" />  
113.   
114.   
115.                 <ImageView  
116.                     android:id="@+id/setting_layout_log_2"  
117.                     android:layout_width="405dp"  
118.                     android:layout_height="200dp"  
119.                     android:layout_marginLeft="85dp"  
120.                     android:layout_marginTop="60dp"  
121.                     android:background="@drawable/setting_viedo"  
122.                     android:clickable="true"  
123.                     android:focusable="true"  
124.                     android:focusableInTouchMode="true"  
125.                     android:nextFocusLeft="@+id/setting_layout_log_1"  
126.                     android:nextFocusRight="@+id/settings"  
127.                     android:nextFocusUp="@+id/setting_layout_log_3" />  
128.             </FrameLayout>  
129.   
130.   
131.             <FrameLayout  
132.                 android:id="@+id/setting_layout_fl_3"  
133.                 android:layout_width="387dp"  
134.                 android:layout_height="338dp"  
135.                 android:layout_marginLeft="294dip"  
136.                 android:layout_marginTop="5dip" >  
137.   
138.   
139.                 <ImageView  
140.                     android:id="@+id/setting_layout_bg_3"  
141.                     android:layout_width="wrap_content"  
142.                     android:layout_height="wrap_content"  
143.                     android:layout_marginTop="15dp"  
144.                     android:background="@drawable/setting_left_top" />  
145.   
146.   
147.                 <ImageView  
148.                     android:id="@+id/setting_layout_log_3"  
149.                     android:layout_width="200dp"  
150.                     android:layout_height="200dp"  
151.                     android:layout_marginLeft="90dp"  
152.                     android:layout_marginTop="15dp"  
153.                     android:clickable="true"  
154.                     android:focusable="true"  
155.                     android:focusableInTouchMode="true"  
156.                     android:nextFocusDown="@+id/setting_layout_log_2"  
157.                     android:nextFocusLeft="@+id/setting_layout_log_0"  
158.                     android:nextFocusRight="@+id/setting_layout_log_4"  
159.                     android:src="@drawable/setting" />  
160.             </FrameLayout>  
161.   
162.   
163.             <FrameLayout  
164.                 android:id="@+id/setting_layout_fl_4"  
165.                 android:layout_width="387dp"  
166.                 android:layout_height="338dp"  
167.                 android:layout_marginLeft="500dip"  
168.                 android:layout_marginTop="5dip" >  
169.   
170.   
171.                 <ImageView  
172.                     android:id="@+id/setting_layout_bg_4"  
173.                     android:layout_width="wrap_content"  
174.                     android:layout_height="wrap_content"  
175.                     android:layout_marginTop="15dp"  
176.                     android:background="@drawable/setting_left_top" />  
177.   
178.   
179.                 <ImageView  
180.                     android:id="@+id/setting_layout_log_4"  
181.                     android:layout_width="200dip"  
182.                     android:layout_height="200dip"  
183.                     android:layout_marginLeft="90dp"  
184.                     android:layout_marginTop="15dp"  
185.                     android:clickable="true"  
186.                     android:focusable="true"  
187.                     android:focusableInTouchMode="true"  
188.                     android:nextFocusDown="@id/setting_layout_log_2"  
189.                     android:nextFocusLeft="@id/setting_layout_log_3"  
190.                     android:nextFocusRight="@id/setting_layout_log_4"  
191.                     android:nextFocusUp="@id/settings"  
192.                     android:src="@drawable/setting_launch" />  
193.             </FrameLayout>  
194.         </RelativeLayout>  
195.   
196.   
197.         <ImageView  
198.             android:id="@+id/white_boder"  
199.             android:layout_width="wrap_content"  
200.             android:layout_height="wrap_content"  
201.             android:background="@drawable/white_border"  
202.             android:visibility="invisible" />  
203.     </FrameLayout>  
204.   
205. </FrameLayout>  

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingTop="45dp" >


    <FrameLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >
<!-- 这个布局中的imageview是创建倒影使用的 -->
        <RelativeLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="425dp" >


            <ImageView
                android:id="@+id/setting_layout_refimg_0"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="50dp" />


            <ImageView
                android:id="@+id/setting_layout_refimg_1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="300dip" />
        </RelativeLayout>


        <RelativeLayout
            android:id="@+id/video_type_layout"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal" >
<!-- 布局都是使用的帧布局，看起起来会有突出的效果，记得把可点击的属性都加上 -->
            <FrameLayout
                android:id="@+id/setting_layout_fl_0"
                android:layout_width="510dp"
                android:layout_height="344dp" >
<!-- 这张图片作为第一张图片，但图片获得焦点后显示，失去焦点后不显示 -->
                <ImageView
                    android:id="@+id/setting_layout_bg_0"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="20dp"
                    android:layout_marginTop="20dp"
                    android:background="@drawable/setting_left_top" />
<!-- 功能图片 -->
                <ImageView
                    android:id="@+id/setting_layout_log_0"
                    android:layout_width="264dp"
                    android:layout_height="250dp"
                    android:layout_marginLeft="115dp"
                    android:layout_marginTop="20dp"
                    android:clickable="true"
                    android:focusable="true"
                    android:focusableInTouchMode="true"
                    android:nextFocusDown="@+id/setting_layout_log_1"
                    android:nextFocusRight="@+id/setting_layout_log_3"
                    android:nextFocusUp="@id/settings"
                    android:scaleType="fitXY"
                    android:src="@drawable/setting_net" />
            </FrameLayout>


            <FrameLayout
                android:id="@+id/setting_layout_fl_1"
                android:layout_width="400dp"
                android:layout_height="244dp"
                android:layout_marginLeft="50dp"
                android:layout_marginTop="210dp" >


                <ImageView
                    android:id="@+id/setting_layout_bg_1"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@drawable/right_bottom" />


                <ImageView
                    android:id="@+id/setting_layout_log_1"
                    android:layout_width="264dp"
                    android:layout_height="150dp"
                    android:layout_marginLeft="65dp"
                    android:layout_marginTop="65dp"
                    android:clickable="true"
                    android:focusable="true"
                    android:focusableInTouchMode="true"
                    android:nextFocusRight="@+id/setting_layout_log_2"
                    android:nextFocusUp="@+id/setting_layout_log_0"
                    android:scaleType="fitXY"
                    android:src="@drawable/setting_update" />
            </FrameLayout>


            <FrameLayout
                android:id="@+id/setting_layout_fl_2"
                android:layout_width="550dp"
                android:layout_height="300dp"
                android:layout_marginLeft="300dp"
                android:layout_marginTop="165dp" >


                <ImageView
                    android:id="@+id/setting_layout_bg_2"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@drawable/vod_big_top" />


                <ImageView
                    android:id="@+id/setting_layout_log_2"
                    android:layout_width="405dp"
                    android:layout_height="200dp"
                    android:layout_marginLeft="85dp"
                    android:layout_marginTop="60dp"
                    android:background="@drawable/setting_viedo"
                    android:clickable="true"
                    android:focusable="true"
                    android:focusableInTouchMode="true"
                    android:nextFocusLeft="@+id/setting_layout_log_1"
                    android:nextFocusRight="@+id/settings"
                    android:nextFocusUp="@+id/setting_layout_log_3" />
            </FrameLayout>


            <FrameLayout
                android:id="@+id/setting_layout_fl_3"
                android:layout_width="387dp"
                android:layout_height="338dp"
                android:layout_marginLeft="294dip"
                android:layout_marginTop="5dip" >


                <ImageView
                    android:id="@+id/setting_layout_bg_3"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="15dp"
                    android:background="@drawable/setting_left_top" />


                <ImageView
                    android:id="@+id/setting_layout_log_3"
                    android:layout_width="200dp"
                    android:layout_height="200dp"
                    android:layout_marginLeft="90dp"
                    android:layout_marginTop="15dp"
                    android:clickable="true"
                    android:focusable="true"
                    android:focusableInTouchMode="true"
                    android:nextFocusDown="@+id/setting_layout_log_2"
                    android:nextFocusLeft="@+id/setting_layout_log_0"
                    android:nextFocusRight="@+id/setting_layout_log_4"
                    android:src="@drawable/setting" />
            </FrameLayout>


            <FrameLayout
                android:id="@+id/setting_layout_fl_4"
                android:layout_width="387dp"
                android:layout_height="338dp"
                android:layout_marginLeft="500dip"
                android:layout_marginTop="5dip" >


                <ImageView
                    android:id="@+id/setting_layout_bg_4"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="15dp"
                    android:background="@drawable/setting_left_top" />


                <ImageView
                    android:id="@+id/setting_layout_log_4"
                    android:layout_width="200dip"
                    android:layout_height="200dip"
                    android:layout_marginLeft="90dp"
                    android:layout_marginTop="15dp"
                    android:clickable="true"
                    android:focusable="true"
                    android:focusableInTouchMode="true"
                    android:nextFocusDown="@id/setting_layout_log_2"
                    android:nextFocusLeft="@id/setting_layout_log_3"
                    android:nextFocusRight="@id/setting_layout_log_4"
                    android:nextFocusUp="@id/settings"
                    android:src="@drawable/setting_launch" />
            </FrameLayout>
        </RelativeLayout>


        <ImageView
            android:id="@+id/white_boder"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/white_border"
            android:visibility="invisible" />
    </FrameLayout>

</FrameLayout>

接下来就是修改View1的代码了：

[java] view plain copy

print ?

1. package com.example.fouseonclick;  
2.   
3. import android.content.Context;  
4. import android.graphics.Bitmap;  
5. import android.view.Gravity;  
6. import android.view.LayoutInflater;  
7. import android.view.View;  
8. import android.view.View.OnClickListener;  
9. import android.view.View.OnFocusChangeListener;  
10. import android.view.animation.Animation;  
11. import android.view.animation.Animation.AnimationListener;  
12. import android.widget.FrameLayout;  
13. import android.widget.ImageView;  
14. import android.widget.LinearLayout;  
15. import android.widget.Toast;  
16.   
17. public class View1 extends LinearLayout implements OnClickListener,  
18.         OnFocusChangeListener {  
19.     private Context mContext;  
20.     private ImageView refImg[] = new ImageView[2];  
21.     private FrameLayout[] fls = new FrameLayout[5];  
22.     private ImageView[] backGrounds = new ImageView[5];// 背景图片层  
23.     private ImageView[] typeLogs = new ImageView[5];// 类型标志  
24.   
25.     public View1(Context context) {  
26.         super(context);  
27.         mContext = context;  
28.     }  
29.     //初始化UI  
30.     public void initView() {  
31.         setLayoutParams(new LinearLayout.LayoutParams(  
32.                 LinearLayout.LayoutParams.WRAP_CONTENT,  
33.                 LinearLayout.LayoutParams.WRAP_CONTENT));  
34.         setGravity(Gravity.CENTER_HORIZONTAL);  
35.         View root = LayoutInflater.from(mContext).inflate(R.layout.layout1,  
36.                 null);  
37.         addView(root);  
38.           
39.         refImg[0] = (ImageView)findViewById(R.id.setting_layout_refimg_0);  
40.         refImg[1] = (ImageView)findViewById(R.id.setting_layout_refimg_1);  
41.   
42.         fls[0] = (FrameLayout) findViewById(R.id.setting_layout_fl_0);  
43.         fls[1] = (FrameLayout) findViewById(R.id.setting_layout_fl_1);  
44.         fls[2] = (FrameLayout) findViewById(R.id.setting_layout_fl_2);  
45.         fls[3] = (FrameLayout) findViewById(R.id.setting_layout_fl_3);  
46.         fls[4] = (FrameLayout) findViewById(R.id.setting_layout_fl_4);  
47.   
48.         typeLogs[0] = (ImageView) findViewById(R.id.setting_layout_log_0);  
49.         typeLogs[1] = (ImageView) findViewById(R.id.setting_layout_log_1);  
50.         typeLogs[2] = (ImageView) findViewById(R.id.setting_layout_log_2);  
51.         typeLogs[3] = (ImageView) findViewById(R.id.setting_layout_log_3);  
52.         typeLogs[4] = (ImageView) findViewById(R.id.setting_layout_log_4);  
53.   
54.         backGrounds[0] = (ImageView) findViewById(R.id.setting_layout_bg_0);  
55.         backGrounds[1] = (ImageView) findViewById(R.id.setting_layout_bg_1);  
56.         backGrounds[2] = (ImageView) findViewById(R.id.setting_layout_bg_2);  
57.         backGrounds[3] = (ImageView) findViewById(R.id.setting_layout_bg_3);  
58.         backGrounds[4] = (ImageView) findViewById(R.id.setting_layout_bg_4);  
59.         //设置事件  
60.         for (int i = 0; i < 5; i++) {  
61.             typeLogs[i].setOnClickListener(this);  
62.             typeLogs[i].setOnFocusChangeListener(this);  
63.             backGrounds[i].setVisibility(View.GONE);  
64.         }  
65.         initRef();  
66.     }  
67.   
68.     // 倒影的实现  
69.     private void initRef() {  
70.         int refIndex = 0;  
71.         for (int i = 0; i < 2; i++) {  
72.             switch (i) {  
73.             case 0:  
74.                 Bitmap rebm = ImageReflect.createCutReflectedImage(  
75.                         ImageReflect.convertViewToBitmap(fls[1]), 0);  
76.                 refImg[refIndex].setImageBitmap(rebm);  
77.                 refIndex++;  
78.                 break;  
79.             case 1:  
80.                 Bitmap rebm1 = ImageReflect.createCutReflectedImage(  
81.                         ImageReflect.convertViewToBitmap(fls[2]), 0);  
82.                 refImg[refIndex].setImageBitmap(rebm1);  
83.                 refIndex++;  
84.                 break;  
85.             default:  
86.                 break;  
87.             }  
88.         }  
89.     }  
90.     //动画效果实现  
91.     ScaleAnimEffect animEffect = new ScaleAnimEffect();  
92.   
93.     @Override  
94.     public void onFocusChange(View v, boolean hasFocus) {  
95.         // TODO Auto-generated method stub  
96.         switch (v.getId()) {  
97.         case R.id.setting_layout_log_0:  
98.             if (hasFocus) {  
99.                 showOnFocusAnimation(0);  
100.             } else {  
101.                 showLooseFocusAinimation(0);  
102.             }  
103.             break;  
104.         case R.id.setting_layout_log_1:  
105.             if (hasFocus) {  
106.                 showOnFocusAnimation(1);  
107.             } else {  
108.                 showLooseFocusAinimation(1);  
109.             }  
110.             break;  
111.         case R.id.setting_layout_log_2:  
112.             if (hasFocus) {  
113.                 showOnFocusAnimation(2);  
114.             } else {  
115.                 showLooseFocusAinimation(2);  
116.             }  
117.             break;  
118.         case R.id.setting_layout_log_3:  
119.             if (hasFocus) {  
120.                 showOnFocusAnimation(3);  
121.             } else {  
122.                 showLooseFocusAinimation(3);  
123.             }  
124.             break;  
125.         case R.id.setting_layout_log_4:  
126.             if (hasFocus) {  
127.                 showOnFocusAnimation(4);  
128.             } else {  
129.                 showLooseFocusAinimation(4);  
130.             }  
131.             break;  
132.         }  
133.     }  
134.     //失去焦点后的动画  
135.     private void showLooseFocusAinimation(int position) {  
136.         animEffect.setAttributs(1.10f, 1.0f, 1.10f, 1.0f, 100);  
137.         if (position == 0) {  
138.   
139.         } else if (position == 1) {  
140.   
141.         } else if (position == 4) {  
142.   
143.         }  
144.         typeLogs[position].startAnimation(animEffect.createAnimation());  
145.         backGrounds[position].setVisibility(View.GONE);  
146.     }  
147.     //获得焦点后的显示动画  
148.     private void showOnFocusAnimation(final int position) {  
149.         fls[position].bringToFront();  
150.         animEffect.setAttributs(1.0f, 1.10f, 1.0f, 1.10f, 100);  
151.         Animation anim = animEffect.createAnimation();  
152.         anim.setAnimationListener(new AnimationListener() {  
153.   
154.             @Override  
155.             public void onAnimationStart(Animation animation) {  
156.   
157.             }  
158.   
159.             @Override  
160.             public void onAnimationRepeat(Animation animation) {  
161.   
162.             }  
163.   
164.             @Override  
165.             public void onAnimationEnd(Animation animation) {  
166.                 backGrounds[position].startAnimation(animEffect.alphaAnimation(  
167.                         0, 1, 150, 0));  
168.                 backGrounds[position].setVisibility(View.VISIBLE);  
169.   
170.             }  
171.         });  
172.         typeLogs[position].startAnimation(anim);  
173.   
174.     }  
175.   
176.     @Override  
177.     public void onClick(View v) {  
178.         // TODO Auto-generated method stub  
179.         switch (v.getId()) {  
180.         case R.id.setting_layout_log_0:  
181.             Toast.makeText(mContext, "点击了无线设置", 3).show();  
182.             break;  
183.         case R.id.setting_layout_log_1:  
184.             Toast.makeText(mContext, "点击了检查更新", 3).show();  
185.             break;  
186.         case R.id.setting_layout_log_2:  
187.             Toast.makeText(mContext, "点击了本地媒体", 3).show();  
188.             break;  
189.         case R.id.setting_layout_log_3:  
190.             Toast.makeText(mContext, "点击了系统设置", 3).show();  
191.             break;  
192.         case R.id.setting_layout_log_4:  
193.             Toast.makeText(mContext, "点击了壁纸设置", 3).show();  
194.             break;  
195.         }  
196.   
197.     }  
198. }  

package com.example.fouseonclick;

import android.content.Context;
import android.graphics.Bitmap;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.View.OnFocusChangeListener;
import android.view.animation.Animation;
import android.view.animation.Animation.AnimationListener;
import android.widget.FrameLayout;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.Toast;

public class View1 extends LinearLayout implements OnClickListener,
		OnFocusChangeListener {
	private Context mContext;
	private ImageView refImg[] = new ImageView[2];
	private FrameLayout[] fls = new FrameLayout[5];
	private ImageView[] backGrounds = new ImageView[5];// 背景图片层
	private ImageView[] typeLogs = new ImageView[5];// 类型标志

	public View1(Context context) {
		super(context);
		mContext = context;
	}
	//初始化UI
	public void initView() {
		setLayoutParams(new LinearLayout.LayoutParams(
				LinearLayout.LayoutParams.WRAP_CONTENT,
				LinearLayout.LayoutParams.WRAP_CONTENT));
		setGravity(Gravity.CENTER_HORIZONTAL);
		View root = LayoutInflater.from(mContext).inflate(R.layout.layout1,
				null);
		addView(root);
		
		refImg[0] = (ImageView)findViewById(R.id.setting_layout_refimg_0);
		refImg[1] = (ImageView)findViewById(R.id.setting_layout_refimg_1);

		fls[0] = (FrameLayout) findViewById(R.id.setting_layout_fl_0);
		fls[1] = (FrameLayout) findViewById(R.id.setting_layout_fl_1);
		fls[2] = (FrameLayout) findViewById(R.id.setting_layout_fl_2);
		fls[3] = (FrameLayout) findViewById(R.id.setting_layout_fl_3);
		fls[4] = (FrameLayout) findViewById(R.id.setting_layout_fl_4);

		typeLogs[0] = (ImageView) findViewById(R.id.setting_layout_log_0);
		typeLogs[1] = (ImageView) findViewById(R.id.setting_layout_log_1);
		typeLogs[2] = (ImageView) findViewById(R.id.setting_layout_log_2);
		typeLogs[3] = (ImageView) findViewById(R.id.setting_layout_log_3);
		typeLogs[4] = (ImageView) findViewById(R.id.setting_layout_log_4);

		backGrounds[0] = (ImageView) findViewById(R.id.setting_layout_bg_0);
		backGrounds[1] = (ImageView) findViewById(R.id.setting_layout_bg_1);
		backGrounds[2] = (ImageView) findViewById(R.id.setting_layout_bg_2);
		backGrounds[3] = (ImageView) findViewById(R.id.setting_layout_bg_3);
		backGrounds[4] = (ImageView) findViewById(R.id.setting_layout_bg_4);
		//设置事件
		for (int i = 0; i < 5; i++) {
			typeLogs[i].setOnClickListener(this);
			typeLogs[i].setOnFocusChangeListener(this);
			backGrounds[i].setVisibility(View.GONE);
		}
		initRef();
	}

	// 倒影的实现
	private void initRef() {
		int refIndex = 0;
		for (int i = 0; i < 2; i++) {
			switch (i) {
			case 0:
				Bitmap rebm = ImageReflect.createCutReflectedImage(
						ImageReflect.convertViewToBitmap(fls[1]), 0);
				refImg[refIndex].setImageBitmap(rebm);
				refIndex++;
				break;
			case 1:
				Bitmap rebm1 = ImageReflect.createCutReflectedImage(
						ImageReflect.convertViewToBitmap(fls[2]), 0);
				refImg[refIndex].setImageBitmap(rebm1);
				refIndex++;
				break;
			default:
				break;
			}
		}
	}
	//动画效果实现
	ScaleAnimEffect animEffect = new ScaleAnimEffect();

	@Override
	public void onFocusChange(View v, boolean hasFocus) {
		// TODO Auto-generated method stub
		switch (v.getId()) {
		case R.id.setting_layout_log_0:
			if (hasFocus) {
				showOnFocusAnimation(0);
			} else {
				showLooseFocusAinimation(0);
			}
			break;
		case R.id.setting_layout_log_1:
			if (hasFocus) {
				showOnFocusAnimation(1);
			} else {
				showLooseFocusAinimation(1);
			}
			break;
		case R.id.setting_layout_log_2:
			if (hasFocus) {
				showOnFocusAnimation(2);
			} else {
				showLooseFocusAinimation(2);
			}
			break;
		case R.id.setting_layout_log_3:
			if (hasFocus) {
				showOnFocusAnimation(3);
			} else {
				showLooseFocusAinimation(3);
			}
			break;
		case R.id.setting_layout_log_4:
			if (hasFocus) {
				showOnFocusAnimation(4);
			} else {
				showLooseFocusAinimation(4);
			}
			break;
		}
	}
	//失去焦点后的动画
	private void showLooseFocusAinimation(int position) {
		animEffect.setAttributs(1.10f, 1.0f, 1.10f, 1.0f, 100);
		if (position == 0) {

		} else if (position == 1) {

		} else if (position == 4) {

		}
		typeLogs[position].startAnimation(animEffect.createAnimation());
		backGrounds[position].setVisibility(View.GONE);
	}
	//获得焦点后的显示动画
	private void showOnFocusAnimation(final int position) {
		fls[position].bringToFront();
		animEffect.setAttributs(1.0f, 1.10f, 1.0f, 1.10f, 100);
		Animation anim = animEffect.createAnimation();
		anim.setAnimationListener(new AnimationListener() {

			@Override
			public void onAnimationStart(Animation animation) {

			}

			@Override
			public void onAnimationRepeat(Animation animation) {

			}

			@Override
			public void onAnimationEnd(Animation animation) {
				backGrounds[position].startAnimation(animEffect.alphaAnimation(
						0, 1, 150, 0));
				backGrounds[position].setVisibility(View.VISIBLE);

			}
		});
		typeLogs[position].startAnimation(anim);

	}

	@Override
	public void onClick(View v) {
		// TODO Auto-generated method stub
		switch (v.getId()) {
		case R.id.setting_layout_log_0:
			Toast.makeText(mContext, "点击了无线设置", 3).show();
			break;
		case R.id.setting_layout_log_1:
			Toast.makeText(mContext, "点击了检查更新", 3).show();
			break;
		case R.id.setting_layout_log_2:
			Toast.makeText(mContext, "点击了本地媒体", 3).show();
			break;
		case R.id.setting_layout_log_3:
			Toast.makeText(mContext, "点击了系统设置", 3).show();
			break;
		case R.id.setting_layout_log_4:
			Toast.makeText(mContext, "点击了壁纸设置", 3).show();
			break;
		}

	}
}

倒影实现类：

[java] view plain copy

print ?

1. package com.example.fouseonclick;  
2.   
3. import android.graphics.Bitmap;  
4. import android.graphics.Bitmap.Config;  
5. import android.graphics.Canvas;  
6. import android.graphics.LinearGradient;  
7. import android.graphics.Matrix;  
8. import android.graphics.Paint;  
9. import android.graphics.PorterDuff.Mode;  
10. import android.graphics.PorterDuffXfermode;  
11. import android.graphics.Shader.TileMode;  
12. import android.view.View;  
13. import android.view.View.MeasureSpec;  
14.   
15. public class ImageReflect {  
16.     /** 
17.      * 图片倒影效果实现 
18.      */  
19.     private static int reflectImageHeight = 80;  
20.   
21.     /** 
22.      * view界面转换成bitmap 
23.      *  
24.      * @param view 
25.      * @return 
26.      */  
27.     public static Bitmap convertViewToBitmap(View view) {  
28.         view.measure(MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED),  
29.                 MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED));  
30.         view.layout(0, 0, view.getMeasuredWidth(), view.getMeasuredHeight());  
31.         view.buildDrawingCache();  
32.         Bitmap bitmap = view.getDrawingCache();  
33.         return bitmap;  
34.     }  
35.   
36.     /** 
37.      * 将bitmap设置倒影 
38.      *  
39.      * @param bitmap 
40.      * @return 
41.      */  
42.     public static Bitmap createReflectedImage(Bitmap bitmap, int reflectHeight) {  
43.   
44.         int width = bitmap.getWidth();  
45.   
46.         int height = bitmap.getHeight();  
47.         if (height <= reflectHeight) {  
48.             return null;  
49.   
50.         }  
51.   
52.         Matrix matrix = new Matrix();  
53.   
54.         matrix.preScale(1, -1);  
55.   
56.         Bitmap reflectionImage = Bitmap.createBitmap(bitmap, 0, height  
57.                 - reflectHeight, width, reflectHeight, matrix, true);  
58.   
59.         Bitmap bitmapWithReflection = Bitmap.createBitmap(width, reflectHeight,  
60.                 Config.ARGB_8888);  
61.         Canvas canvas = new Canvas(bitmapWithReflection);  
62.         canvas.drawBitmap(reflectionImage, 0, 0, null);  
63.         LinearGradient shader = new LinearGradient(0, 0, 0,  
64.                 bitmapWithReflection.getHeight()  
65.   
66.                 , 0x80ffffff, 0x00ffffff, TileMode.CLAMP);  
67.   
68.         Paint paint = new Paint();  
69.         paint.setShader(shader);  
70.   
71.         paint.setXfermode(new PorterDuffXfermode(Mode.DST_IN));  
72.         canvas.drawRect(0, 0, width, bitmapWithReflection.getHeight(), paint);  
73.         return bitmapWithReflection;  
74.   
75.     }  
76.   
77.     public static Bitmap createCutReflectedImage(Bitmap bitmap, int cutHeight) {  
78.   
79.         int width = bitmap.getWidth();  
80.   
81.         int height = bitmap.getHeight();  
82.         int totleHeight = reflectImageHeight + cutHeight;  
83.   
84.         if (height <= totleHeight) {  
85.             return null;  
86.         }  
87.   
88.         Matrix matrix = new Matrix();  
89.   
90.         matrix.preScale(1, -1);  
91.   
92.         System.out.println(height - reflectImageHeight - cutHeight);  
93.         Bitmap reflectionImage = Bitmap.createBitmap(bitmap, 0, height  
94.                 - reflectImageHeight - cutHeight, width, reflectImageHeight,  
95.                 matrix, true);  
96.   
97.         Bitmap bitmapWithReflection = Bitmap.createBitmap(width,  
98.                 reflectImageHeight, Config.ARGB_8888);  
99.         Canvas canvas = new Canvas(bitmapWithReflection);  
100.         canvas.drawBitmap(reflectionImage, 0, 0, null);  
101.         LinearGradient shader = new LinearGradient(0, 0, 0,  
102.                 bitmapWithReflection.getHeight()  
103.   
104.                 , 0x80ffffff, 0x00ffffff, TileMode.CLAMP);  
105.   
106.         Paint paint = new Paint();  
107.         paint.setShader(shader);  
108.   
109.         paint.setXfermode(new PorterDuffXfermode(Mode.DST_IN));  
110.         canvas.drawRect(0, 0, width, bitmapWithReflection.getHeight(), paint);  
111.         if (!reflectionImage.isRecycled()) {  
112.             reflectionImage.recycle();  
113.         }  
114.         // if (!bitmap.isRecycled()) {  
115.         // bitmap.recycle();  
116.         // }  
117.         System.gc();  
118.         return bitmapWithReflection;  
119.   
120.     }  
121. }  

package com.example.fouseonclick;

import android.graphics.Bitmap;
import android.graphics.Bitmap.Config;
import android.graphics.Canvas;
import android.graphics.LinearGradient;
import android.graphics.Matrix;
import android.graphics.Paint;
import android.graphics.PorterDuff.Mode;
import android.graphics.PorterDuffXfermode;
import android.graphics.Shader.TileMode;
import android.view.View;
import android.view.View.MeasureSpec;

public class ImageReflect {
	/**
	 * 图片倒影效果实现
	 */
	private static int reflectImageHeight = 80;

	/**
	 * view界面转换成bitmap
	 * 
	 * @param view
	 * @return
	 */
	public static Bitmap convertViewToBitmap(View view) {
		view.measure(MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED),
				MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED));
		view.layout(0, 0, view.getMeasuredWidth(), view.getMeasuredHeight());
		view.buildDrawingCache();
		Bitmap bitmap = view.getDrawingCache();
		return bitmap;
	}

	/**
	 * 将bitmap设置倒影
	 * 
	 * @param bitmap
	 * @return
	 */
	public static Bitmap createReflectedImage(Bitmap bitmap, int reflectHeight) {

		int width = bitmap.getWidth();

		int height = bitmap.getHeight();
		if (height <= reflectHeight) {
			return null;

		}

		Matrix matrix = new Matrix();

		matrix.preScale(1, -1);

		Bitmap reflectionImage = Bitmap.createBitmap(bitmap, 0, height
				- reflectHeight, width, reflectHeight, matrix, true);

		Bitmap bitmapWithReflection = Bitmap.createBitmap(width, reflectHeight,
				Config.ARGB_8888);
		Canvas canvas = new Canvas(bitmapWithReflection);
		canvas.drawBitmap(reflectionImage, 0, 0, null);
		LinearGradient shader = new LinearGradient(0, 0, 0,
				bitmapWithReflection.getHeight()

				, 0x80ffffff, 0x00ffffff, TileMode.CLAMP);

		Paint paint = new Paint();
		paint.setShader(shader);

		paint.setXfermode(new PorterDuffXfermode(Mode.DST_IN));
		canvas.drawRect(0, 0, width, bitmapWithReflection.getHeight(), paint);
		return bitmapWithReflection;

	}

	public static Bitmap createCutReflectedImage(Bitmap bitmap, int cutHeight) {

		int width = bitmap.getWidth();

		int height = bitmap.getHeight();
		int totleHeight = reflectImageHeight + cutHeight;

		if (height <= totleHeight) {
			return null;
		}

		Matrix matrix = new Matrix();

		matrix.preScale(1, -1);

		System.out.println(height - reflectImageHeight - cutHeight);
		Bitmap reflectionImage = Bitmap.createBitmap(bitmap, 0, height
				- reflectImageHeight - cutHeight, width, reflectImageHeight,
				matrix, true);

		Bitmap bitmapWithReflection = Bitmap.createBitmap(width,
				reflectImageHeight, Config.ARGB_8888);
		Canvas canvas = new Canvas(bitmapWithReflection);
		canvas.drawBitmap(reflectionImage, 0, 0, null);
		LinearGradient shader = new LinearGradient(0, 0, 0,
				bitmapWithReflection.getHeight()

				, 0x80ffffff, 0x00ffffff, TileMode.CLAMP);

		Paint paint = new Paint();
		paint.setShader(shader);

		paint.setXfermode(new PorterDuffXfermode(Mode.DST_IN));
		canvas.drawRect(0, 0, width, bitmapWithReflection.getHeight(), paint);
		if (!reflectionImage.isRecycled()) {
			reflectionImage.recycle();
		}
		// if (!bitmap.isRecycled()) {
		// bitmap.recycle();
		// }
		System.gc();
		return bitmapWithReflection;

	}
}

动画效果实现类：

[java] view plain copy

print ?

1. package com.example.fouseonclick;  
2.   
3. import android.view.animation.AccelerateInterpolator;  
4. import android.view.animation.AlphaAnimation;  
5. import android.view.animation.Animation;  
6. import android.view.animation.ScaleAnimation;  
7.   
8. public class ScaleAnimEffect {  
9.     private float fromXScale;  
10.     private float toXScale;  
11.     private float fromYScale;  
12.     private float toYScale;  
13.     private long duration;  
14.   
15.     // private long offSetDuration;  
16.   
17.     /** 
18.      * 设置缩放参数 
19.      *  
20.      * @param fromXScale 
21.      *            初始X轴缩放比例 
22.      * @param toXScale 
23.      *            目标X轴缩放比例 
24.      * @param fromYScale 
25.      *            初始Y轴缩放比例 
26.      * @param toYScale 
27.      *            目标Y轴缩放比例 
28.      * @param duration 
29.      *            动画持续时间 
30.      */  
31.     public void setAttributs(float fromXScale, float toXScale,  
32.             float fromYScale, float toYScale, long duration) {  
33.         this.fromXScale = fromXScale;  
34.         this.fromYScale = fromYScale;  
35.         this.toXScale = toXScale;  
36.         this.toYScale = toYScale;  
37.         this.duration = duration;  
38.     }  
39.   
40.     public Animation createAnimation() {  
41.         ScaleAnimation anim = new ScaleAnimation(fromXScale, toXScale,  
42.                 fromYScale, toYScale, Animation.RELATIVE_TO_SELF, 0.5f,  
43.                 Animation.RELATIVE_TO_SELF, 0.5f);  
44.         anim.setFillAfter(true);  
45.         anim.setInterpolator(new AccelerateInterpolator());  
46.         anim.setDuration(duration);  
47.         return anim;  
48.     }  
49.   
50.     public Animation alphaAnimation(float fromAlpha, float toAlpha,  
51.             long duration, long offsetDuration) {  
52.         AlphaAnimation anim = new AlphaAnimation(fromAlpha, toAlpha);  
53.         anim.setDuration(duration);  
54.         anim.setStartOffset(offsetDuration);  
55.         anim.setInterpolator(new AccelerateInterpolator());  
56.         return anim;  
57.     }  
58. }