第三组UI组件：ImageView及其子类
主要功能是显示图片，任何Drawable对象都可使用ImageView来显示。
1.图片浏览器
下面的图片浏览器可以改变所查看图片的透明度，可通过调用ImageView的setImageAlpha()方法实现。还可以通过一个小区域查看图片的原始大小。（两个ImageView）
下面是布局文件
1 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"View Code
2 android:orientation="vertical"
3 android:layout_width="match_parent"
4 android:layout_height="match_parent">
5 <TextView
6 android:layout_width="match_parent"
7 android:layout_height="wrap_content"
8 android:layout_marginTop="120px"/>
9 <LinearLayout
10 android:orientation="horizontal"
11 android:layout_width="match_parent"
12 android:layout_height="wrap_content"
13 android:gravity="center">
14 <Button
15 android:layout_width="wrap_content"
16 android:layout_height="wrap_content"
17 android:text="增大透明度"
18 android:id="@+id/plus"/>
19 <Button
20 android:layout_width="wrap_content"
21 android:layout_height="wrap_content"
22 android:text="降低透明度"
23 android:id="@+id/minus"/>
24 <Button
25 android:layout_width="wrap_content"
26 android:layout_height="wrap_content"
27 android:text="下一张"
28 android:id="@+id/next"/>
29 </LinearLayout>
30 <!-- 定义显示图片整体的ImageView -->
31 <!-- 指定android:scaleType="fitCenter"表明 -->
32 <!-- ImageView显示图片时会保持纵横比缩放，并将缩放后的图片放在该ImageView的*-->
33 <ImageView
34 android:id="@+id/image1"
35 android:layout_width="wrap_content"
36 android:layout_height="280dp"
37 android:src="@drawable/five"
38 android:scaleType="fitCenter"/>
39 <!-- 定义显示图片局部细节的ImageView -->
40 <ImageView
41 android:id="@+id/image2"
42 android:layout_width="120dp"
43 android:layout_height="120dp"
44 android:background="#00f"
45 android:layout_margin="10dp"/>
46 </LinearLayout>
为了能动态改变图片的透明度，要为按钮编写事件监听器，当用户单击按钮时动态改变图片的Alpha值。
为了能动态显示图片局部细节，程序为第一个ImageView添加OnTouchListener监听器，
用户在第一个ImageView上发生触摸事件时，程序从原始图片中读取相应部分的图片并显示在第二个ImageView中
下面是java代码及运行截图，但是最后一张图片的时候点击图片会闪退。。原因不明也没有调试信息。。
1 public class MainActivity extends AppCompatActivity {View Code
2
3 //定义一个访问图片的数组
4 int[] images = new int[]{
5 R.drawable.one,
6 R.drawable.two,
7 R.drawable.three,
8 R.drawable.four,
9 R.drawable.five,
10 };
11 //定义默认显示的图片
12 int currentImg = 4;
13 //定义图片的初始透明度
14 private int alpha = 255;
15 @Override
16 protected void onCreate(Bundle savedInstanceState) {
17 super.onCreate(savedInstanceState);
18 setContentView(R.layout.activity_main);
19 final Button plus=(Button)findViewById(R.id.plus);
20 final Button minus=(Button)findViewById(R.id.minus);
21 final Button next=(Button)findViewById(R.id.next);
22 final ImageView image1=(ImageView)findViewById(R.id.image1);
23 final ImageView image2=(ImageView)findViewById(R.id.image2);
24 //定义查看下一张图片的监听器
25 next.setOnClickListener(new View.OnClickListener()
26 {
27 @Override
28 public void onClick(View v)
29 {
30 //控制ImageView显示下一张图片
31 image1.setImageResource(images[++currentImg%images.length]);
32 }
33 });
34 //定义改变图片透明度的方法
35 View.OnClickListener listener=new View.OnClickListener()
36 {
37 @Override
38 public void onClick(View v)
39 {
40 if(v==plus)
41 {
42 alpha+=20;
43 }
44 if(v==minus)
45 {
46 alpha-=20;
47 }
48 if(alpha>=255)
49 {
50 alpha=255;
51 }
52 if(alpha<=0)
53 {
54 alpha=0;
55 }
56 //改变图片透明度
57 image1.setImageAlpha(alpha);
58 }
59 };
60 //为两个按钮添加监听器
61 plus.setOnClickListener(listener);
62 minus.setOnClickListener(listener);
63
64 image1.setOnTouchListener(new View.OnTouchListener() {
65 @Override
66 public boolean onTouch(View view, MotionEvent event) {
67 BitmapDrawable bitmapDrawable=(BitmapDrawable)image1.getDrawable();
68 //获取第一个图片显示框中的位图
69 Bitmap bitmap=bitmapDrawable.getBitmap();
70 //bitmap图片实际大小与第一个ImageView的缩放比例
71 double scale=1.0*bitmap.getHeight()/image1.getHeight();
72 //获取需要显示的图片的开始点
73 int x=(int)(event.getX()*scale);
74 int y=(int)(event.getY()*scale);
75 if(x+120>bitmap.getWidth())
76 {
77 x=bitmap.getWidth()-120;
78 }
79 if(y+120>bitmap.getHeight())
80 {
81 y=bitmap.getHeight()-120;
82 }
83 //显示图片的指定区域
84 image2.setImageBitmap(Bitmap.createBitmap(bitmap,x,y,120,120));
85 image2.setImageAlpha(alpha);
86 return false;
87 }
88 });
89 }
90 }
2.图片按钮，比较简单，不作说明
看了一下ZoomButton,ZoomControls是放大缩小按钮
3.使用QuickCantactBadge关联联系人
感觉比较有趣，布局文件如下
1 <LinearLayoutView Code
2 xmlns:android="http://schemas.android.com/apk/res/android"
3 android:orientation="vertical"
4 android:layout_width="match_parent"
5 android:layout_height="match_parent">
6 <TextView
7 android:layout_width="match_parent"
8 android:layout_height="wrap_content"
9 android:layout_marginTop="120px"/>
10 <QuickContactBadge
11 android:id="@+id/badge"
12 android:layout_width="wrap_content"
13 android:layout_height="wrap_content"
14 android:src="@drawable/one"/>
15 <TextView
16 android:layout_width="match_parent"
17 android:layout_height="wrap_content"
18 android:textSize="16dp"
19 android:text="萌重"/>
20 </LinearLayout>
java代码如下
1 public class quickContactBadge_index extends AppCompatActivity {View Code
2 QuickContactBadge badge;
3 @Override
4 protected void onCreate(Bundle savedInstanceState) {
5 super.onCreate(savedInstanceState);
6 setContentView(R.layout.activity_quick_contact_badge_index);
7
8 //获取QuickContactBadge组件
9 badge=(QuickContactBadge)findViewById(R.id.badge);
10 //将QuickContactBadge组件与特定电话号码对应的联系人建立关联
11 badge.assignContactFromPhone("623208",false);
12 }
13 }
点击图片会谈到联系人界面，如果不存在这个号码会询问是否添加联系人，睡觉，晚安
下一篇：第四组UI组件：AdapterView及其子类