【注：此博客長期荒置，因此附上這個工程的下載鏈接：http://pan.baidu.com/share/link?shareid=81046&uk=1158065893 有興趣可以下載看看】
既然是要做app，那么如果全都用android自帶的控件的話界面就太單調和難看了，所以每個app都有自己的風格和外觀，那么，現在就來研究一下如何做一個自己中意的控件吧~
首先，新建一個android工程，我就命名為buttonTest了。
在給activity.java文件動手腳之間，我比較喜歡先搞定xml文件，我們這里測試兩個控件，一個是自制按鈕，一個是自制textview控件，道理是一樣的，就是為了告訴大家這個適用於任意的控件。
首先我們在main.xml文件(我就懶得換名字了)里添加三個控件，每個控件都可以給它很多屬性，具體查看可以輸入android： 然后后面就自動出現了它的所有屬性：
然后這里我們只給出需要的。注意第一行那個android:id="@+id/mybutton"，這個意思是，給這個控件一個名字，這個名字是存在之前提到過的R.java文件里的，因為是添加一個名字，所以用了+id，如果是引用string.java文件里的string字符串的話，就只需要@string/nameofstring 。不需要加好了，具體我們看代碼：
main.xml文件如下：
<?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"
android:background="@drawable/bg"
>
<Button
android:layout_width="55px"
android:layout_height="55px"
android:id="@+id/button"
android:background="@drawable/buttonstyle"
android:layout_margin="10px"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#000000"
android:layout_margin="10px"
android:id="@+id/text"
android:text="@string/shorttext"
android:background="@drawable/textview"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10px"
android:id="@+id/text2"
android:textColor="#000000"
android:text="@string/longtext"
android:background="@drawable/textview"
/>
</LinearLayout>
可以看到三個控件我都給了個ID，是因為我要在activity的java文件里給它一個listener，也就是說要對這個控件進行操作，這是后話了。
里面的text內容我放在了string.xml文件里了。
其中的 android:background="@drawable/xxxxxx" 這一行，就是針對這個控件定制的類型，xxxx是定義這個類型用的文件。
那么這個文件怎么來呢~？其實就是右鍵點工程，新建android的xml文件，然后選擇Drawable，最下面的root element選擇selector，然后在res文件夾下就會生成一個叫做drawable的文件夾，里面就放着你定義的文件：
然后我們就可以點開這個文件，給剛才定義的空間覆上屬性了，我就隨意上網找了兩個圖，然后放在了drawable-hdpi里（真不負責任啊），然后buttonstyle的內容如下：
<?xml version="1.0" encoding="utf-8"?>
<selector
xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="false" android:drawable="@drawable/button" />
<item android:state_pressed="true" android:drawable="@drawable/b_pressed" />
<item android:state_focused="true" android:drawable="@drawable/b_pressed"/>
</selector>
其實就是針對不同的狀態給圖就可以了。
然后呢 這個button就完成了。
效果如下：
在按下的狀態下它是藍色的圖，我就不截了。
當然，這個並不能滿足我們，因為很多時候，按鈕上是要定義文字的。
但是如果只用一個圖片做背景，那么因為長寬的問題，背景圖片經常就會被拉伸的很難看，所以，這里就要提到一個android自帶的工具，叫做draw9patch。我們找到android的sdk文件夾，里面有個叫tool的文件夾，里面就放了這個工具，我們點開它（會慢，耐心等下），發現界面很單純：
它雖然長得很單純，但是效果可是華麗麗的哦~
我們找到一個希望放文字的圖片素材進來，然后她會自動給圖片的四周放大一個像素，來讓我們定義拉伸時候的重復像素。
這里我用了蘋果短信的氣泡：
右邊就是拉伸的效果，很理想吧~大家看到，圖片的四邊被我點了四個點，就是這4個點起到的作用，原理就是：
在拉伸的時候，它會復制這四個點范圍內的像素，而不是一味的拉伸。
換句話說，拉伸的時候，圖像會復制這4個點對應的行列，而不會影響其它的像素。
我稍微把這個圖畫個示意：
被紅線框起來的部分，就是橫向或者縱向拉伸的時候被不斷復制的地方，而其它地方拉伸的時候並不影響。
這樣，我們把這個圖用在textview的定制文件里，textview.xml的內容如下：
<?xml version="1.0" encoding="utf-8"?>
<selector
xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="false" android:drawable="@drawable/bubble" />
<item android:state_pressed="true" android:drawable="@drawable/bu_pressed" />
<item android:state_focused="true" android:drawable="@drawable/bu_pressed"/>
</selector>
OK了，為了能看效果，我在activity文件里動了點手腳，文件完整內容如下：
package android.button;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.View.OnLongClickListener;
import android.widget.Button;
import android.widget.TextView;
import android.widget.Toast;
public class ButtonTestActivity extends Activity {
/** Called when the activity is first created. */
private Button button;
private TextView text;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
text = (TextView)findViewById(R.id.text);
button = (Button)findViewById(R.id.button);
button.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
// TODO Auto-generated method stub
Toast.makeText(getApplicationContext(), "clicked",
Toast.LENGTH_SHORT).show();
}
});
text.setOnLongClickListener(new OnLongClickListener() {
@Override
public boolean onLongClick(View v) {
// TODO Auto-generated method stub
Toast.makeText(getApplicationContext(), "long clicked",
Toast.LENGTH_SHORT).show();
return false;
}
});
}
}
好了，讓我們運行看看吧~
第二個我添加了長按的監聽，長按時顯示藍色，成功~ OK，功成身退。~
如果博文幫助到你的話,幫忙點個贊吧~謝啦^^