Android-カスタムビューまたはトグルボタン4x4

遅かれ早かれ、初心者のAndroid開発者はコントロールの標準セットに満足できなくなります。 これは、外観と機能の両方を指します。 そして、見た目ですべてが多かれ少なかれ明確であれば、すべてを非常に簡単にカスタマイズできますが、機能は十分ではないことがよくあります。



(かなり長い間)私のプロジェクトの1つで、設定で3つのパラメーターのいずれかを選択する必要に直面したとき、解決策は明らかでした-RadioButton。 しかし、画面スペースの節約など、いくつかの理由で、ToggleButtonのようなものを使用したいという要望がありました。 標準のトグルには2つの状態しかないため、通常のButtonやImageButtonのような標準要素のプロパティが変更されたことに応じて、松葉杖が周期的に変化する変数のソフトウェア処理の形で使用されました。 この方法は非常に有効ですが、罪がないわけではありません。 何よりもまず、当事者の一般的な方針に違反しており、リソースとプログラムコードの別個のストレージを求めています。 そのようなコントロールが多数あると、コードはその優雅さと魅力をすべて失います。 カプセル化もまたひどく苦しみます。 したがって、カスタム要素を作成することにしました。



提示された例は、経験豊富な開発者にとって複雑なものではありませんが、一度にこれを1か所で見つけて、断片的に収集しないことを非常に嬉しく思います。 任意の数(この場合は4つ)の周期的に状態を切り替えるカスタムToggleButtonを作成してみましょう。 例の状態に応じて、ボタンの碑文と左側のステータスアイコン(ボタンのDrawableLeft)が変わります。 ただし、すべてが非常にシンプルで透過的であるため、状態の変更をコントロールプロパティに簡単に適用できます。



最初に必要なことは、res / values / attrs.xmlファイルで必要なプロパティを記述することです。 すでに決定したように、これらはコントロールのさまざまな状態の4つのラインと4つの画像になります。



<?xml version="1.0" encoding="utf-8"?> <resources> <declare-styleable name="CustomToggle"> <attr name="customState" format="integer" /> <attr name="customText_0" format="string" /> <attr name="customText_1" format="string" /> <attr name="customText_2" format="string" /> <attr name="customText_3" format="string" /> <attr name="customImage_0" format="reference" /> <attr name="customImage_1" format="reference" /> <attr name="customImage_2" format="reference" /> <attr name="customImage_3" format="reference" /> </declare-styleable> </resources>
      
      





これで、新しいクラスのコードに直接移動できます。 通常のButtonから継承します。



 public class CustomToggle extends Button implements OnClickListener { private static final int STATE_COUNT = 4; private int state; private String[] txt = new String[3]; private Drawable[] img = new Drawable[3]; private OnViewChangeListener listener; public interface OnViewChangeListener { public void onChangeState(int i); } public void setOnViewChangeListener(OnViewChangeListener l) { this.listener = l; } public CustomToggle(Context context) { this(context, null); } public CustomToggle(Context context, AttributeSet attrs) { this(context, attrs, 0); handleAttributes(context, attrs); } public CustomToggle(Context context, AttributeSet attrs, int defStyle) { super(context, attrs, defStyle); setOnClickListener(this); } private void handleAttributes(Context context, AttributeSet attrs) { TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.CustomToggle); final int count = a.getIndexCount(); //     //     for (int i = 0; i < count; i++) { int attr = a.getIndex(i); switch (attr) { case R.styleable.CustomToggle_customText_0: txt[0] = a.getString(attr); break; case R.styleable.CustomToggle_customText_1: txt[1] = a.getString(attr); break; case R.styleable.CustomToggle_customText_2: txt[2] = a.getString(attr); break; case R.styleable.CustomToggle_customText_3: txt[3] = a.getString(attr); break; case R.styleable.CustomToggle_customImage_0: img[0] = a.getDrawable(attr); break; case R.styleable.CustomToggle_customImage_1: img[1] = a.getDrawable(attr); break; case R.styleable.CustomToggle_customImage_2: img[2] = a.getDrawable(attr); break; case R.styleable.CustomToggle_customImage_3: img[3] = a.getDrawable(attr); break; } } a.recycle(); setValues(); } //      private void setValues() { setText(txt[state]); setCompoundDrawablesWithIntrinsicBounds(img[state], null, null, null); } public void setState(int i) { this.state = i; setValues(); } private void changeState() { if (state < STATE_COUNT) state++; else state = 0; setValues(); listener.onChangeState(state); } public int getState() { return state; } public String getCurrentText() { return txt[state]; } @Override public void onClick(View v) { changeState(); } }
      
      





保存するために、インポートを下げました-Eclipseが指示します。



新しいクラスが作成されたので、独自の名前空間を追加することを忘れずに、マークアップに追加し、xmlファイルでプロパティを正規に指定できます。



 <RelativeLayout xmlns:android=http://schemas.android.com/apk/res/android xmlns:custom_toggle="http://schemas.android.com/apk/res/com.example" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent"> <com.example.CustomToggle android:id="@+id/custom_toggle" android:layout_width="match_parent" android:layout_height="wrap_content" custom_toggle:customImage_0="@drawable/img_0" custom_toggle:customImage_1="@drawable/img_1" custom_toggle:customImage_2="@drawable/img_2" custom_toggle:customImage_3="@drawable/img_3" custom_toggle:customText_0="@string/toggle_0" custom_toggle:customText_1="@string/toggle_1" custom_toggle:customText_2="@string/toggle_2" custom_toggle:customText_3="@string/toggle_3" /> </RelativeLayout>
      
      





彼らが言うように、利益。



必要に応じてさらに変形できるスケルトンを取得しました。 オプションとして:STATE_COUNT定数の代わりに、setStateCount()型の対応する属性とメソッドを追加します。これにより、使用可能な状態の数をプログラムで動的に制限できます。 想像力の全範囲。



それだけです。 ご清聴ありがとうございました。



PS:OnViewChangeListenerインターフェイスをコードに追加しました。



All Articles