Android自定义控件

第一步：定义一个有图片和文本的布局：

• <?xmlversion="1.0"encoding="utf-8"?> 
• <LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"  
•     android:orientation="horizontal"  
•     android:layout_width="wrap_content"  
•     android:layout_height="wrap_content"  
•     >  
• <ImageView  
•     android:id="@+id/widget_image_text_btn_Img"  
•     android:layout_width="wrap_content"  
•     android:layout_height="wrap_content"  
•     />  
• <TextView  
•     android:id="@+id/widget_image_text_btn_TV"  
•     android:layout_width="wrap_content"  
•     android:layout_height="wrap_content"  
•     android:textColor="#000000"  
•     android:layout_marginLeft="8dip"  
•     android:layout_gravity="center_vertical"  
•     />  
• </LinearLayout>  

第二步：定义一个与这个布局对应的类：

• publicclass ImgTextBtnH extends LinearLayout { 
•  
•     privatestaticfinal String TAG = ImgTextBtnH.class.getSimpleName(); 
•      
•     private ImageView mImg;  
•     private TextView  mTV;  
•     private Button mBtn; 
•     private Context mContext = null; 
•   
•     public ImgTextBtnH(Context context) {  
•         this(context, null);  
•         mContext = context; 
•     }  
•   
•     protectedvoid inflaterLayout(Context context) { 
•         // 导入布局  
•         LayoutInflater.from(context).inflate(R.layout.widget_image_text_btn_horizontal_layout, this, true);  
•     } 
•      
•      
•     @SuppressLint("NewApi") 
•     public ImgTextBtnH(Context context, AttributeSet attrs) {  
•         super(context, attrs);  
•         mContext = context; 
•          
•         Resources.Theme theme = context.getTheme(); 
•          
•         inflaterLayout(context); 
•         // 导入布局  
• //        LayoutInflater.from(context).inflate(R.layout.widget_image_text_btn_layout, this, true);  
•         mImg = (ImageView) findViewById(R.id.widget_image_text_btn_Img);  
•         mTV = (TextView) findViewById(R.id.widget_image_text_btn_TV);  
•         mBtn = (Button) findViewById(R.id.widget_image_text_btn_Btn); 
•          
•         //不能够使用ImageView的click方法， 在android里点击事件消息是从内向外传递的，设置了false之后才能传递出来给LinearLayout 
•         mImg.setClickable(false); //谢谢 Brightshadow11111 朋友的提醒 
•          
•         TypedArray typeArray = context.obtainStyledAttributes(attrs, 
•                 R.styleable.ImgTextBtn); 
•         if (typeArray == null) { 
•             return; 
•         } 
•          
•         int count = typeArray.getIndexCount(); 
•         int resId = 0; 
•         for (int i = 0; i < count; i++) { 
•             int attr = typeArray.getIndex(i); 
•             switch(attr) { 
•             case R.styleable.ImgTextBtn_ImgDraw: 
•                 Drawable background = typeArray.getDrawable(attr); 
•                 int sdk = android.os.Build.VERSION.SDK_INT; 
•                 if(sdk < android.os.Build.VERSION_CODES.JELLY_BEAN) { 
•                     mImg.setBackgroundDrawable(background); 
•                 } else { 
•                     mImg.setBackground(background); 
•                 } 
•                 break; 
•             case R.styleable.ImgTextBtn_ImgDrawWidth: 
•                 int imageWidth = typeArray.getDimensionPixelSize(attr, -1); 
•                 mImg.setMaxWidth(imageWidth); 
•                 mImg.setMinimumWidth(imageWidth); 
•                 break; 
•             case R.styleable.ImgTextBtn_ImgDrawHeight: 
•                 int imageHeight = typeArray.getDimensionPixelSize(attr, -1); 
•                 mImg.setMaxHeight(imageHeight); 
•                 mImg.setMinimumHeight(imageHeight); 
•                 break; 
•             case R.styleable.ImgTextBtn_ImgDrawMinWidth: 
•                 int imageMinWidth = typeArray.getDimensionPixelSize(attr, -1); 
•                 mImg.setMinimumHeight(imageMinWidth); 
•                 break; 
•             case R.styleable.ImgTextBtn_ImgDrawMinHeight: 
•                 int imageMinHeight = typeArray.getDimensionPixelSize(attr, -1); 
•                 mImg.setMinimumHeight(imageMinHeight); 
•                 break; 
•             case R.styleable.ImgTextBtn_ImgDrawMaxHeight: 
•                 int imageMaxHeight = typeArray.getDimensionPixelSize(attr, -1); 
•                 mImg.setMaxHeight(imageMaxHeight); 
•                 break; 
•             case R.styleable.ImgTextBtn_ImgDrawMaxWidth: 
•                 int imageMaxWidth = typeArray.getDimensionPixelSize(attr, -1); 
•                 mImg.setMaxWidth(imageMaxWidth); 
•                 break; 
•             case R.styleable.ImgTextBtn_TVText: 
•                 mTV.setText(typeArray.getText(attr)); 
•                 break; 
•             case R.styleable.ImgTextBtn_TVTextSize: 
•                 mTV.setTextSize(typeArray.getDimensionPixelSize(attr, 15)); 
•                 break; 
•             } 
•         } 
•         typeArray.recycle(); 
•     }  
•      
• <span style="color: rgb(255, 0, 0);">    @Override 
•     publicvoid refreshDrawableState() { 
•         // TODO Auto-generated method stub 
•         super.refreshDrawableState(); 
•         //------------接下来处理联动效果，关键代码，请认真看------------------- 
•         //------------ ImageView控件的联动刷新 ------------------- 
•         Drawable imgDrawable = mImg.getBackground(); //获取drawable资源 
•         Log.d(TAG, "drawable = " + imgDrawable); 
•         if (imgDrawable != null && imgDrawable.isStateful()) { 
•             //关键中的关键，根据当前状态设置drawable的状态，本来应该是LinearLayout的getDrawableState()状态， 
•             //但是现在是实现联动效果，而且获取的ImageView的getDrawState()结果不对。 
•             imgDrawable.setState(this.getDrawableState());  
•         } 
•          
•         //------------- TextView的联动刷新， 抱歉， 无法刷新 ------------------ 
•         //这块代码很快写出来了，但是写出来后发现，颜色总是停留在最后一次的颜色上，后面再点击都无法改变颜色了， 
•         //才恍然大悟，mTV.setTextColor()是设置TextView内部的ColorStateList对象的，这样会清掉原先的 
•         //res/color/colorSelector.xml里的设置，导致只有一种颜色值。应该赋值给TextView内部的private int mCurTextColor; 
•         //可惜没有并设置mCurTextColor值的接口，不知到使用反射能否做到，有兴趣朋友可以一试。 
•         //既然Text的color是靠TextPaint刷出来的，那么是否可以改变TextPaint的颜色值呢？发现有接口getPaint可以获取到TextPaint， 
•         //但是设置了color值之后，还是不行，哦，原来在onDraw()函数中，重新设置了颜色值，所以白设了。 
•         //总而言之，联动刷新颜色是不行滴，只能设一个颜色（对于我目前来讲功能已经是足够了） 哈哈，讲的够详细吧～～ 
•         ColorStateList mTextColor = mTV.getTextColors(); 
•          
•         int color = mTextColor.getColorForState(this.getDrawableState(), 0); 
•         if (mTV.getCurrentTextColor() != color) { 
•             mTV.getPaint().setColor(color); 
• //          mTV.setTextColor(color); 
•             mTV.invalidate(); 
•         } 
•          
•         //-----------如果有个Button的话就可以在这里设置改变，效果同上，略--------------- 
• //        Drawable btnDrawable = mBtn.getBackground(); 
• //      Log.d(TAG, "drawable = " + btnDrawable); 
• //      if (btnDrawable != null && btnDrawable.isStateful()) { 
• //          btnDrawable.setState(this.getDrawableState()); 
• //      } 
• //       
• //      ColorStateList mTextColor2 = mBtn.getTextColors(); 
• //      int color2 = mTextColor2.getColorForState(this.getDrawableState(), 0); 
• //        if (mBtn.getCurrentTextColor() != color2) { 
• //          mBtn.setTextColor(color2); 
• //        } 
•   
•     }</span> 
•  
•     /**
•      * 设置图片资源
•      */  
•     publicvoid setImgViewResource(int resId) {  
•         mImg.setImageResource(resId);  
•     }  
•      
•     /**
•      * 设置图片
•      */  
•     publicvoid setImgViewResource(Bitmap bitmap) {  
•         mImg.setImageBitmap(bitmap);  
•     }  
•   
•     /**
•      * 设置显示的文字
•      */  
•     publicvoid setTextViewText(int resId) {  
•         mTV.setText(resId);  
•     }  
•     /**
•      * 设置显示的文字
•      */  
•     publicvoid setTextViewText(String text) {  
•         mTV.setText(text);  
•     }  
•   
• } 

第三步：在value/下面定义一个attrs.xml文件，内容如下： 

• <?xmlversion="1.0"encoding="utf-8"?> 
• <resources> 
•     <declare-styleablename="ImgTextBtn"> 
•         <attrname="ImgDraw"format="reference"></attr> 
•         <attrname="ImgDrawWidth"format="dimension"></attr> 
•         <attrname="ImgDrawHeight"format="dimension"></attr> 
•         <attrname="ImgDrawMinWidth"format="dimension"></attr> 
•         <attrname="ImgDrawMinHeight"format="dimension"></attr> 
•         <attrname="ImgDrawMaxWidth"format="dimension"></attr> 
•         <attrname="ImgDrawMaxHeight"format="dimension"></attr> 
•          
•         <attrname="TVText"format="reference|string"></attr> 
•         <attrname="TVTextSize"format="dimension"></attr> 
•         <attrname="TVTextColor"format="reference|color"></attr> 
•     </declare-styleable> 
•      
• </resources> 

第四步：直接在布局中使用

• <RelativeLayoutxmlns:android="http://schemas.android.com/apk/res/android" 
• //CustomAttrs为自定义属性，com.example.testdrawable为包名
•     xmlns:CustomAttrs="http://schemas.android.com/apk/res/com.example.testdrawable" 
•     android:layout_width="match_parent" 
•     android:layout_height="match_parent"> 
•  
•     <com.widget.ImgTextBtn 
•         android:id="@+id/imageTextButton1" 
•         android:layout_width="match_parent" 
•         android:layout_height="wrap_content" 
•         android:orientation="vertical" 
•         android:layout_above="@+id/textView1" 
•         android:layout_centerHorizontal="true" 
•         android:layout_marginBottom="35dp" 
•         android:background="@drawable/preference_round_rect_light_blue" 
•         CustomAttrs:TVText="@string/hello_world" 
•         CustomAttrs:TVTextSize="@dimen/dimens_Padding_normal" 
•         CustomAttrs:ImgDraw="@drawable/test_btn_selector"> 
•     </com.widget.ImgTextBtn> 
•  
• </RelativeLayout>