2

このようなボタンが欲しい:

+-----------------------+
|                       |
|        +-----+        |
|        |Image|        |
|        +-----+        |
|          Text         |
|                       |
|                       |
+-----------------------+

編集:画像の説明:画像とテキストの組み合わせを中央に配置したい(テキストは常に画像の下にあります)

ボタンを親オブジェクトまで伸ばして(領域全体をボタンクリック領域にするため)、画像とテキストを中央に揃えたいと思います。

次のコードで上部中央の位置合わせのみを実行しますが、目的の動作が得られません...

<Button
    android:id="@+id/btInfo"
    android:paddingTop="20dp"
    android:layout_width="0dp"
    android:layout_height="match_parent"
    android:gravity="top|center_horizontal"                   
    android:layout_weight="1"
    android:background="@drawable/border_button_main_menu"
    android:drawableTop="@drawable/bt_info"
    android:onClick="onClick"
    android:text="@string/info"
    android:textColor="@drawable/bt_white_red_text"
    android:textSize="15dp" />

のみに変更 android:gravity="top|center_horizontal"するandroid:gravity="center_vertical|center_horizontal"と、画像が上部に中央揃えになり、テキストが下部に中央揃えになります。


----編集2-----

求められる行動:

1)説明どおりに表示します(画像とテキストは光学グループであり、グループはボタンの中央に配置されます)

2)テキストはボタンの一部である必要があります(onclick動作をセレクターで機能させたい)


----編集3-----

私自身の解決策を追加しました...しかし、助けようとしたすべてのおかげで

4

6 に答える 6

3

次のコードを使用すると、問題が解決します。

<Button
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_alignBottom="@+id/foreground"
    android:layout_alignLeft="@+id/foreground"
    android:layout_alignRight="@+id/foreground"
    android:layout_alignTop="@+id/foreground"
    android:background="@android:drawable/dialog_frame"
    android:onClick="clickedMe" />

   <RelativeLayout
       android:id="@+id/foreground"
       android:layout_width="fill_parent"
       android:layout_height="wrap_content"
       android:layout_alignParentBottom="true"
       android:layout_alignParentTop="true" >

       <TextView
           android:id="@+id/button_text"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:layout_alignParentBottom="true"
           android:layout_centerHorizontal="true"
           android:layout_marginBottom="112dp"
           android:text="@string/hello_world" />

       <ImageView
           android:id="@+id/imageView1"
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:layout_above="@+id/button_text"
           android:layout_centerHorizontal="true"
           android:paddingBottom="10dip"
           android:paddingTop="10dip"
           android:src="@drawable/ic_launcher" />

   </RelativeLayout>

</RelativeLayout>

- - - - - - - 編集 - - - - - - - - - -

oNclickメソッド:

final TextView text = (TextView) findViewById(R.id.button_text);
    RelativeLayout foreground = (RelativeLayout) findViewById(R.id.foreground);
    foreground.setOnClickListener(new View.OnClickListener() {

        @Override
        public void onClick(View v) {
            Log.d(TAG, "clicked");
            Toast.makeText(getApplicationContext(), "Clicked...!!!",
                    Toast.LENGTH_LONG).show();
            text.setTextColor(Color.RED);
        }
    });
于 2012-12-05T12:47:11.313 に答える
1

これを試して:

<LinearLayout
android:gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content">

<Button
android:id="@+id/btInfo"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="@drawable/border_button_main_menu"
android:drawableTop="@drawable/bt_info"
android:onClick="onClick"
android:text="@string/info"
android:textColor="@drawable/bt_white_red_text"
android:textSize="15dp" />

</LinearLayout>
于 2012-12-05T12:33:53.767 に答える
0

この種のUIを実現する最善の方法は、Buttonの代わりにImageButtonを使用することだと思います。しかし、あなたはまだいくつかのハックな方法でこれを達成することができます。それらの1つはここにあります:

ボタン内に画像とテキストセンターを配置する方法

上記のリンクに示されているソリューションでは、内部のRelativeLayoutの方向を「垂直」として言及する必要があります。お役に立てば幸いです。

これもあなたを助けることができるかもしれません:

幅を「親を埋める」に設定したAndroidボタンのアイコンとテキストを中央に配置する方法

于 2012-12-05T12:40:32.557 に答える
0

テキストを呼び出すsetBackgroundDrawable()と、ボタンに追加され、ドローアブルの下に表示されます。

于 2012-12-05T12:32:59.787 に答える
0

達成しようとしている出力は、を使用してそのように行うことはできませんdrawableTop

理由は?-ビューは背景またはドローアブルを設定できます。ドローアブルを設定している間、Androidはドローアブルの境界を上、左、右、または下に設定するための4つのオプションのみを提供し中央は何も設定しません。

これで、XMLでビューの高さと幅が決まり、drawableTOPやLEFTなどを使用してドローアブルセットを作成するたびに、ビューのその端に移動しMATCH_PARENTます。それはあなたと今起こっています。

コメントから:

  1. Android OSは最終的にはソフトウェアであり、ソフトウェアは常にその範囲内で開発されてきました。あなたが求めているものは範囲外であるため、デフォルトのフォームウィジェットを使用するAndroidでは直接サポートされていません。

  2. AndroidがDrawableクラスをどのように記述し、どのように使用できるかを示したので、問題の解決策だけでなく、答えを理解してみてください。ちなみに、領域全体のクリックを取得するには、そのLinearLayoutをクリックして記述できます。ボタンの代わりに。

解決策は次のようになります:

<LinearLayout height = MATCH_PARENT and width = 0dp>

    <Button height and width = WRAP_CONTENT with drawableTop=image and gravity = center>

</LinearLayout>
于 2012-12-05T12:49:43.023 に答える
0

私の解決策は今、ボタンから派生しています...それは私のすべての要件を満たしています...テキストの測定が本当にそのように正確であるかどうかはわかりませんが、そうでない場合は、誰もが背後にあるアイデアを取得し、それを調整することができます...

助けてくれてありがとう

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.Paint.Style;
import android.graphics.drawable.BitmapDrawable;
import android.graphics.drawable.Drawable;
import android.graphics.drawable.StateListDrawable;
import android.util.AttributeSet;
import android.widget.Button;

public class CenterImageTextButton extends Button {

    private Paint mPaint = new Paint();
    private String mText = null;
    private float mTextSize = 0;

    public CenterImageTextButton(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }
    public CenterImageTextButton(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public CenterImageTextButton(Context context) {
        super(context); 
    }

    @Override
    public void onDraw(Canvas canvas) {

        mText = getText().toString();
        mTextSize = getTextSize();

        mPaint.setStyle(Style.FILL); 
        mPaint.setColor(getCurrentTextColor());        

        // get image top
        Drawable drawable = getCompoundDrawables()[1];
        Drawable curDrawable = null;
        if (drawable instanceof StateListDrawable)
            curDrawable = ((StateListDrawable)drawable).getCurrent();
        else
            curDrawable = ((BitmapDrawable)drawable).getCurrent();
        Bitmap image = ((BitmapDrawable)curDrawable).getBitmap();

        // call default drawing method without image/text
        setText("");
        setCompoundDrawables(null, null, null, null);
        super.onDraw(canvas);
        setText(mText);
        setCompoundDrawables(null, drawable, null, null);

        // get measurements of button and Image
        int width = getMeasuredWidth();
        int height = getMeasuredHeight();
        int imgWidth = image.getWidth();
        int imgHeight = image.getHeight();

        // get measurements of text
        //float densityMultiplier = getContext().getResources().getDisplayMetrics().density;
        //float scaledPx = textSize * densityMultiplier;
        //paint.setTextSize(scaledPx);
        mPaint.setTextSize(mTextSize);
        float textWidth = mPaint.measureText(mText);

        // draw Image and text
        float groupHeight = imgHeight + mTextSize;
        canvas.drawBitmap(image, (width - imgWidth) / 2, (height - groupHeight) / 2, null);
        canvas.drawText(mText, (width - textWidth) / 2, mTextSize + (height - groupHeight) / 2 + imgHeight, mPaint);    
    }
}
于 2012-12-05T15:45:44.160 に答える