Android ApiDemos 系列解析【View-ImageView/ImageButton】

今天来讲一下两个经典的图像组件：ImageButton 和 ImageView 。

• ScrollView   子节点只允许一个View 视图，如果有多于一个子节点将会报错；
• android:paddingTop 与上节点边距的填充；
• android:adjustViewBounds 如果设置为true 图像将自动调整自己的宽主；
• android:maxWidth 设置图像的最大高；
• android:maxHeight 设置图像的最大高；
• android:scaleType  控制如何调整图像大小或者移动范围，以配合ImageView 的大小。下面是 scaleType 所支持的类型：
  

  Constant	Value	Description
  matrix	0
  fitXY	1
  fitStart	2
  fitCenter	3
  fitEnd	4
  center	5
  centerCrop	6
  centerInside	7

• android:padding 设置上、下、左、右的填充

• 1、第一步，新建一个包
  com.terry.Ext 做为组件扩展包
• 2、第二步，新建一个类
  imageViewExt.java 做为组件扩展类
• 3、第三步，使此类继承 LinearLayout 布局
  public class imageViewExt extends LinearLayout
• 4、第四步，在构造函数中通过参数判断传进来的值做逻辑，具体代码后如下：
  
  package  com.terry.Ext;
  
  import  android.content.Context;
  import  android.graphics.drawable.Drawable;
  import  android.util.AttributeSet;
  import  android.view.LayoutInflater;
  import  android.widget.ImageView;
  import  android.widget.LinearLayout;
  import  android.widget.TextView;
  
  public   class  imageViewExt  extends  LinearLayout {
  
       private  TextView tv;
       private  String labelText;
       private   int  FontSize;
       private  String Position;
       private  Drawable bitmap;
       private  ImageView iv;
  
       public  imageViewExt(Context context, AttributeSet attrs) {
           super (context, attrs);
           //  TODO Auto-generated constructor stub
           int  resourceid;
          resourceid  =  attrs.getAttributeResourceValue( null ,  " labelText " ,  0 );
           if  (resourceid  ==   0 ) {
              labelText  =  attrs.getAttributeValue( null ,  " labelText " );
          }  else  {
              labelText  =  getResources().getString(resourceid);
          }
           if  (labelText  ==   null ) {
              labelText  =   " 默认 " ;
          }
          resourceid  =  attrs.getAttributeResourceValue( null ,  " imgSrc " ,  0 );
           if  (resourceid  >   0 ) {
              bitmap  =  getResources().getDrawable(resourceid);
          }  else  {
               throw   new  RuntimeException( " 图像资源为空 " );
          }
          resourceid  =  attrs.getAttributeResourceValue( null ,  " FontSize " ,  0 );
           if  (resourceid  ==   0 ) {
              FontSize  =  attrs.getAttributeIntValue( null ,  " FontSize " ,  12 );
          }  else  {
              FontSize  =  getResources().getInteger(resourceid);
          }
  
          resourceid  =  attrs.getAttributeResourceValue( null ,  " Position " ,  0 );
           if  (resourceid  ==   0 ) {
              Position  =  attrs.getAttributeValue( null ,  " Position " );
          }  else  {
              Position  =  getResources().getString(resourceid);
          }
           if  (Position  ==   null ) {
              Position  =   " left " ;
          }
  
          String infService  =  Context.LAYOUT_INFLATER_SERVICE;
          LayoutInflater li  =  (LayoutInflater) context
                  .getSystemService(infService);
           if  ( " left " .equals(Position)) {
              li.inflate(com.terry.R.layout.image_horizontal,  this );
          }  else   if  ( " top " .equals(Position)) {
              li.inflate(com.terry.R.layout.image_vertical,  this );
          }  else  {
               throw   new  RuntimeException( " 必须为top 和left 属性 " );
          }
          tv  =  (TextView) findViewById(com.terry.R.id.TextView01);
          iv  =  (ImageView) findViewById(com.terry.R.id.imageview1);
          iv.setImageDrawable(bitmap);
          tv.setTextSize(( float ) FontSize);
  
          tv.setText(labelText);
  
      }
  
  }
  
   
  上面通过传进来的资源做判断，先假设传进来的是资源ID，然后判断最后加载不同的XML来布局文件，两个XML文件代码如下：
  
   

  <? xml version="1.0" encoding="UTF-8" ?>
  < LinearLayout  android:id ="@+id/LinearLayout01"
      android:layout_width ="fill_parent"  android:layout_height ="fill_parent"
      xmlns:android ="http://schemas.android.com/apk/res/android" >
  
       < TextView  android:id ="@+id/TextView01"  android:layout_width ="wrap_content"
          android:layout_height ="wrap_content" ></ TextView >
       < ImageView  android:layout_width ="wrap_content"  android:id ="@+id/imageview1"
          android:layout_height ="wrap_content" ></ ImageView >
  </ LinearLayout >
   
   

  <? xml version="1.0" encoding="UTF-8" ?>
  < LinearLayout  android:id ="@+id/LinearLayout01"
      android:orientation ="vertical"  android:layout_width ="fill_parent"
      android:layout_height ="fill_parent"  xmlns:android ="http://schemas.android.com/apk/res/android" >
       < TextView  android:id ="@+id/TextView01"  android:layout_width ="wrap_content"
          android:layout_height ="wrap_content" ></ TextView >
       < ImageView  android:layout_width ="wrap_content"  android:id ="@+id/imageview1"
          android:layout_height ="wrap_content" ></ ImageView >
  </ LinearLayout >
  
   
• 5、在XML中使用刚扩展的视图 imageViewExt，代码片段如下：
  
  < com.terry.Ext.imageViewExt  android:id ="@+id/img"
              android:clickable ="true"  android:layout_width ="wrap_content"
              labelText ="封装ImageExt"  imgSrc ="@drawable/stat_happy"  Position ="top"
              android:layout_height ="wrap_content" >
           </ com.terry.Ext.imageViewExt >
   
  Tip: com.terry.Ext.imageViewExt 此句为你的包名加你的扩展视图名称。效果如下：
  
  在这里你可以通过设置Position 调整图片和文本的位置这就是一个简单扩展组件的DEMO 当然，要扩展还会涉及到动态设置获取还有事件监听等内容，这些我们以后慢慢摸索。

 

package  com.example.android.apis.view;

import  android.app.Activity;
import  android.os.Bundle; 


import  com.example.android.apis.R;


public   class  ImageButton1  extends  Activity {
    
    @Override
     public   void  onCreate(Bundle savedInstanceState) {
         super .onCreate(savedInstanceState);
        setContentView(R.layout.image_button_1); 
    }
}