Android 之自定義組件

一、如何在一個按鈕上放上一張圖片?
把按鈕和圖片套在一個FrameLayout中android

<!-- 必須將button和ImageView分別嵌套在兩個LinearLayout中才能 實現將圖片放在按鈕上 -->
   <FrameLayout
    android:orientation="horizontal"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
    <LinearLayout
     android:layout_width="wrap_content"
     android:layout_height="wrap_content">
     <Button
      style="@style/menu_btn_style"
      android:id="@+id/fan_us"
      android:text="@string/mainmenu_facebook_fan_us" />
    </LinearLayout>
    <LinearLayout
     android:layout_width="wrap_content"
     android:layout_height="wrap_content">
     <ImageView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_marginLeft="16dp"
      android:layout_marginTop="13dp"
      android:src="@drawable/facebookicon" />
    </LinearLayout>
   </FrameLayout>
   
   
   
二、如何自定義組件
自定義一個下劃線形式的輸入框算法

第一:肯定要畫多少條下劃線
第二:每條線的寬度
第三:下劃線的間距canvas

(1)自定義文本輸入框
package com.heima.guesswho.util;ide

import com.heima.android.guesswho.R;佈局

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.widget.EditText;debug

public class DashlineEditText extends EditText {
 /*
  * 假設下劃線總長100個單位,要畫7條下劃線,每條下劃線間距爲2個單位
  * 具體算法以下:
  * 每條下劃線的長度:(100+2)/7-2
  * for(int i = 0;i<7,i++){
  *     第i條線
  *   x1 = ((100+2)/7)*i
  *   y1 = getHeight()
  *   x2 = ((100+2)/7)*i+(100+2)/7-2
  *   y2 = getHeight()
  * }
  *
  */
 
 private Paint linePaint = new Paint();
 private  int segmentCount = 8;//總共畫8條分割線,能夠做爲默認值
 private  int distance = 5;//每一個分割線的間距爲4個單位,能夠做爲默認值
 
 /*
  * 從佈局文件中獲得對應屬性的值
  */
 public DashlineEditText(Context context, AttributeSet attrs) {
  super(context, attrs);
  setBackgroundDrawable(null);//消除文本框效果的做用
  //linePaint.setColor(Color.RED);//設置畫筆的顏色
  
  TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.DashLineET);
  segmentCount = array.getInt(R.styleable.DashLineET_segment_count, segmentCount);//從指定屬性中拿到對應的值,若沒設置,則用默認值
  distance = array.getInt(R.styleable.DashLineET_distance, distance);
  int color = array.getInt(R.styleable.DashLineET_dashline_color, Color.RED);
  linePaint.setColor(color);
 }3d

 @Override
 protected void onDraw(Canvas canvas) {
  super.onDraw(canvas);
  int width = getWidth();//自定義控件的寬度
  int height = getHeight()-3;//必須減去數才能顯示出下劃線
  
  //畫出每一條下劃線
  for(int i = 0; i < segmentCount; i++){
   int oneSegmentWidth = (width+distance)/segmentCount - distance;//每條下劃線的長度
   int startX = (segmentCount+distance)*i ;//每條下劃線的起點位置
   int stopX = startX+oneSegmentWidth ;//每條下劃線的終點位置
   canvas.drawLine(startX, height, stopX, height, linePaint);
  }  
 }
}orm


(2)佈局文件
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
 xmlns:android="http://schemas.android.com/apk/res/android"
 android:orientation="vertical"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent">
 <TextView
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:text="@string/debug_name" />xml

 <com.heima.guesswho.util.DashlineEditText
  android:layout_width="100dp"
  android:layout_height="12dp"
  android:text="test" />
</LinearLayout>圖片


定義自定義組件的屬性

第一步:在string.xml文件中配置declare-styleable

   <!-- 定義DashLineEditText的屬性 -->
 <declare-styleable
  name="DashLineET">
  <attr
   name="segments_cnt"
   format="integer" />
  <attr
   name="distance"
   format="dimension" />
  <attr
   name="dashline_color"
   format="color" />
  <attr
   name="hint_msg"
   format="reference" />
  <attr
   name="hint_color"
   format="color" />
 </declare-styleable>
 
第二步:在自定義組件中複寫構造方法,用來獲取佈局文件中屬性的值

 
 /*
  * 從佈局文件中獲得對應屬性的值
  */
 public DashlineEditText(Context context, AttributeSet attrs) {
  super(context, attrs);
  setBackgroundDrawable(null);//消除文本框效果的做用
  //linePaint.setColor(Color.RED);//設置畫筆的顏色
  
  TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.DashLineET);
  segmentCount = array.getInt(R.styleable.DashLineET_segment_count, segmentCount);//從指定屬性中拿到對應的值,若沒設置,則用默認值
  distance = array.getInt(R.styleable.DashLineET_distance, distance);
  int color = array.getInt(R.styleable.DashLineET_dashline_color, Color.RED);
  linePaint.setColor(color);
 }

 


第三步:在使用自定義組件的佈局文件中加入命名空間

如xmlns:heima="http://schemas.android.com/apk/res/com.heima.android.guesswho"


heima 爲咱們使用屬性時使用的前綴,至關於使用Android屬性時要使用android前綴同樣
其中com.heima.android.guesswho,爲清單文件標識應用的包名

佈局文件以下


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
 xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:heima="http://schemas.android.com/apk/res/com.heima.android.guesswho"
 android:orientation="vertical"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent">
 <TextView
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:text="@string/debug_name" />

 <com.heima.guesswho.util.DashlineEditText
  android:layout_width="100dp"
  android:layout_height="12dp"
  heima:segment_count="10"
  heima:distance="3"
  android:text="test" />
</LinearLayout>
  

 <com.heima.guesswho.util.DashlineEditText    android:layout_width="210dip"   heima:segment_count="9"    heima:distance="4dip"    heima:dashline_color="@color/font_white"    android:layout_height="wrap_content"    android:textColor="#FF0000"    android:hint="@string/input_name_prompt"    android:text="" />

相關文章
相關標籤/搜索