如何以编程方式将两个图像连同两行文本添加到按钮？

Question

我想将两个图像添加到具有两行文本的按钮，如下所示：

注意：上图经过 Photoshop 处理，看起来像我想要的样子。

我不确定如何实现。我可以像这样以编程方式将一张图片添加到左侧的按钮：

Button button = new Button(this);
int imgResource = R.drawable.titans;
String matchUpStr = "Titans\nPatriots";

button.setGravity(Gravity.START);
button.setCompoundDrawablesWithIntrinsicBounds(imgResource, 0, 0, 0);
button.setText(matchUpStr);

但结果是这样的:

有谁知道如何将两个图像添加到按钮中文本的左侧？我在想也许你可以转到 imgResource 变量的下一行并添加另一个可绘制对象。不确定。

请注意，我将动态创建按钮，并不总是会是这场比赛。所以我不能只添加一张有这两支球队的图片。

我开始想，也许与其添加两张图片和两行文本，不如制作两张包含图片内部文本的图片，然后将图片添加到顶部和底部。

Answer 1

想到的唯一解决方案是在相对布局（或您喜欢的任何布局）中放置一个 Button 匹配父级，然后在其上组织视图（只需确保在 api 21+ 按钮已将海拔设置为 0 或其他值）。

这个link启发了我：Android Custom button with imageview and textview inside?

Answer 2

尽管我同意 Nero 的观点，即自定义按钮可能是更简洁的解决方案。

我能够使用 LayerListDrawable.

想出一个解决方案

我将两个位图可绘制对象的大小调整为按钮文本的大小，然后按该大小将它们插入图层列表可绘制对象中。请参阅代码示例。

package cj.com.testinglayerlist;

import android.graphics.Bitmap;
import android.graphics.drawable.BitmapDrawable;
import android.graphics.drawable.Drawable;
import android.graphics.drawable.LayerDrawable;
import android.graphics.drawable.ScaleDrawable;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.Button;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Button button = findViewById(R.id.button);

        // We will need to know the size of the text in order to correctly resize our bitmaps. I 
        // am getting it from the button here, but it can also be retrieved from resources. 
        int buttonTextSize = (int) button.getTextSize();

        // Get the drawables as BitmapDrawables.
        BitmapDrawable patriotsDrawable = (BitmapDrawable) getDrawable(R.drawable.patriots);
        BitmapDrawable titansDrawable = (BitmapDrawable) getDrawable(R.drawable.titans);

        // Resize the drawables to be the size of our button text.
        patriotsDrawable = resizeDrawable(buttonTextSize,  patriotsDrawable);
        titansDrawable = resizeDrawable(buttonTextSize, titansDrawable);

        // Create an array of drawables that contains our two logos.
        Drawable[] drawables = new Drawable[2];
        drawables[0] = patriotsDrawable;
        drawables[1] = titansDrawable;

        // Create a layer drawable.
        LayerDrawable layerDrawable = new LayerDrawable(drawables);
        // Notice here how the top of this layer is the button text size. This is opposite of the
        // other drawable whom's bottom will be the button text size.
        layerDrawable.setLayerInset(0,0, buttonTextSize,0,0);
        layerDrawable.setLayerInset(1,0, 0,0,buttonTextSize);

        // Now I set my buttons drawable.
        button.setCompoundDrawablesWithIntrinsicBounds(layerDrawable, null,null,null);
    }

    /**
     * Takes in the desired size of the bitmap drawable and resizes the bitmap as such.
     * 
     * @param sizeOfDrawable      The desired size in pixels.
     * @param bitmapDrawable      The bitmap drawable to resize.
     *                            
     * @return      Bitmap drawable that has been resized.
     */
    private BitmapDrawable resizeDrawable(int sizeOfDrawable, BitmapDrawable bitmapDrawable) {
        Bitmap bitmap = bitmapDrawable.getBitmap();
        BitmapDrawable d = new BitmapDrawable(getResources(), Bitmap.createScaledBitmap(bitmap,
                sizeOfDrawable,
                sizeOfDrawable, true));
        return d;
    }
}

使用上面的代码片段，我能够想到以下内容。

这不是 100%，但也许是您可以实现目标的途径。 Layer List Drawable Screenshot

如何以编程方式将两个图像连同两行文本添加到按钮？

How to programmatically add two images to button along with two lines of text?

android

button

drawable

android-layout