最後のAndroidチュートリアル
では、 “ImageButton”を使用して、カスタマイズされた背景イメージを持つ “Button”を簡単に表示します。しかし、単純なイメージ以上のことを行うことができます。Androidでは、ボタンがフォーカスされているかボタンが押されているかなど、さまざまな状態に応じてボタンのイメージを変更できます。
この例は、このhttp://developer.android.com/resources/tutorials/views/hello-formstuff.html[Androidカスタムボタン]の記事から参照され、マイナーな変更が加えられています。
P.SこのプロジェクトはEclipse 3.7で開発され、Android 2.3.3.
でテストされています
1.画像をリソースに追加する
ボタン状態のために3つの画像を準備し、それを ”
resource/drawable
“フォルダに入れます。
-
button
normal
green.png
– デフォルト画像ボタン. -
button
focused
orange.png
– ボタンがフォーカスされているときに表示する
たとえば、電話機のキーパッドがこのボタン上を移動(フォーカス)しているときです。
-
button
pressed
yellow.png
– ボタンが押されたときに表示します.
2.異なるボタンの状態にSelectorを追加する
”
res/drawable/
“フォルダに新しいXMLファイルを作成します。この場合、名前は “new__button.xml”としてください。このファイルは、どのボタンの状態がどの画像に属するかを定義したものです。
さて、あなたはこのId: `@ drawable/new__button`を使ってこのボタンを参照することができます。
File:res/drawable/new
button.xml__
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@drawable/button__pressed__yellow" android:state__pressed="true"/> <item android:drawable="@drawable/button__focused__orange" android:state__focused="true"/> <item android:drawable="@drawable/button__normal__green"/> </selector>
3.ボタンを追加する
”
res/layout/main.xml
“ファイルを開き、通常のボタンを追加し、 “android:background =” @ drawable/new
button “を介して”
new
button
File:res/layout/main.xml
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout__width="fill__parent" android:layout__height="fill__parent" android:orientation="vertical" > <Button android:id="@+id/imageButtonSelector" android:layout__width="wrap__content" android:layout__height="wrap__content" android:background="@drawable/new__button"/> </LinearLayout>
4.コードコード
単純なクリックリスナーを持つ通常のボタン。
ファイル:私のAndroid App Activity.java
package com.mkyong.android; import android.app.Activity; import android.os.Bundle; import android.widget.Button; import android.widget.Toast; import android.view.View; import android.view.View.OnClickListener; public class MyAndroidAppActivity extends Activity { Button imageButton; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); addListenerOnButton(); } public void addListenerOnButton() { imageButton = (Button) findViewById(R.id.imageButtonSelector); imageButton.setOnClickListener(new OnClickListener() { @Override public void onClick(View arg0) { Toast.makeText(MyAndroidAppActivity.this, "ImageButton (selector) is clicked!", Toast.LENGTH__SHORT).show(); } }); } }
5.デモ
アプリケーションを実行します。
{空} 1。結果、デフォルトボタン。 (button
normal
green.png)
{空} 2。ボタンが集中している。 (button
focused
orange.png)
{空} 3。ボタンが押された。 (button
pressed
yellow.png)
image =//wp-content/uploads/2011/12/android-buttonSelector-press-demo3.png[button is pressed、title = “android-buttonSelector-press-demo3″、width = 318、height = 480]
ソースコードをダウンロードする
ダウンロードする –
Android-ImageButton-Selector-Example.zip
(23 KB)
参考文献
カスタムボタンの例]。リンク://android/android-imagebutton-example/[Android ImageButton
例]