Android Button With Text And Image

After seeing many questions for this feature and attempting to follow the answers, I was left wondering if there was a clearer example to be had? Edit: I was attempting to make a l

Solution 1:

IF you like to have Button with image + text, then why don't you use CompoundDrawable?

For example:

Also check: How do I use a compound drawable instead of a LinearLayout that contains an ImageView and a TextView

Solution 2:

In an attempt to save others some time, I offer this:

layout/some_layout.xml

<?xml version="1.0" encoding="utf-8"?><RelativeLayoutandroid:id="@+id/menu_ok"android:layout_width="wrap_content"android:layout_height="wrap_content"
    <!--StateListDrawabletomakeitlooklikeabutton-->
    android:background="@drawable/btn_std_holo_states"
    <!-- Required so you can click on it like a button -->
    android:clickable="true"    
    <!-- Recommended min height from the guidelines -->
    android:minHeight="48dp"    
    <!-- OnClickEvent definition -->
    android:onClick="onClickOk" >   

    <!-- Compound drawable of graphic and text --><TextViewandroid:id="@+id/txt_ok"android:layout_width="wrap_content"android:layout_height="wrap_content"
        <!--Centerboththegraphicandtextinsidethebutton-->
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        <!-- Draw the graphic to the left of the text -->
        android:drawableLeft="@drawable/ic_ok"
        <!-- Space between the graphic and the text-->
        android:drawablePadding="16dp"
        <!-- ensures the text and graphic are both centered vertically -->
        android:gravity="center"
        <!-- Text of the button -->
        android:text="@android:string/ok"
        <!-- Change the font to match the standard button settings (optional) -->
        android:textAppearance="?android:attr/textAppearanceButton" />

</RelativeLayout>

drawable/btn_std_holo_states.xml (referenced above)

<?xml version="1.0" encoding="utf-8"?><selectorxmlns:android="http://schemas.android.com/apk/res/android"><itemandroid:drawable="@drawable/abs__btn_cab_done_pressed_holo_dark"android:state_pressed="true"/><itemandroid:drawable="@drawable/abs__btn_cab_done_focused_holo_dark"android:state_enabled="true"android:state_focused="true"/><itemandroid:drawable="@android:color/transparent"android:state_enabled="true"/><itemandroid:drawable="@android:color/transparent"/></selector>

NOTE: the different @drawable and @android:color settings here can be anything and are only provided to make a complete example

Solution 3:

try this custom Drawable:

classBackgroundDrawableextendsStateListDrawable {
    private StateListDrawable mDrawable;
    private Bitmap mBitmap;
    private Matrix mMatrix;
    privateboolean mScale;
    privateint mGravity;
    privateint mDx;
    privateint mDy;

    publicBackgroundDrawable(StateListDrawable sld, Resources res, int resId, boolean scale, int gravity, int dx, int dy) {
        mDrawable = sld;
        mBitmap = BitmapFactory.decodeResource(res, resId);
        mMatrix =  newMatrix();
        mScale = scale;
        mGravity = gravity;
        mDx = dx;
        mDy = dy;
    }

    publicstaticvoidsetupBackground(View v, int resId, boolean scale, int gravity, int horizontalPadding, int verticalPadding) {
        Drawabled= v.getBackground();
        if (d instanceof StateListDrawable) {
            StateListDrawablesld= (StateListDrawable) d;
            Drawabledrawable=newBackgroundDrawable(sld, v.getResources(), resId, scale, gravity, horizontalPadding, verticalPadding);
            v.setBackgroundDrawable(drawable);
        }
    }

    @OverrideprotectedbooleanonStateChange(int[] stateSet) {
        invalidateSelf();
        returnsuper.onStateChange(stateSet);
    }

    @OverrideprotectedvoidonBoundsChange(Rect bounds) {
        mDrawable.setBounds(bounds);
        Rectb=newRect(bounds);
        b.inset(mDx, mDy);
        RectFsrc=newRectF(0, 0, mBitmap.getWidth(), mBitmap.getHeight());
        RectFdst=newRectF(b);
        float[] values = newfloat[9];
        if (mScale) {
            mMatrix.setRectToRect(src, dst, ScaleToFit.START);
        }
        mMatrix.getValues(values);
        floatsx= values[Matrix.MSCALE_X];
        floatsy= values[Matrix.MSCALE_Y];
        RectoutRect=newRect();
        Gravity.apply(mGravity, (int) (src.width() * sx), (int) (src.height() * sy), b, outRect);
        mMatrix.postTranslate(outRect.left, outRect.top);
    }

    @Overridepublicvoiddraw(Canvas canvas) {
        int[] stateSet = getState();
        mDrawable.setState(stateSet);
        mDrawable.draw(canvas);
        canvas.drawBitmap(mBitmap, mMatrix, null);
    }
}

and how to use it:

Buttonb0= (Button) findViewById(R.id.b0);
BackgroundDrawable.setupBackground(b0, R.drawable.ic_launcher, false, Gravity.BOTTOM | Gravity.RIGHT, 10, 5);
Buttonb1= (Button) findViewById(R.id.b1);
BackgroundDrawable.setupBackground(b1, R.drawable.ic_launcher, false, Gravity.TOP, 0, 0);

Solution 4:

Try this:

DrawableappImg= getApplicationContext().getResources().getDrawable( R.drawable.ic_launcher );
appImg.setBounds( 0, 0, appImg.getIntrinsicHeight(), appImg.getIntrinsicWidth() );

Buttonbtn_ok= (Button) findViewById(R.id.ok);
btn_ok.setCompoundDrawables( null, null, appImg, null );

Hope it helps you.

Thanks.