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

时间:2018-01-13 21:35:55

标签: android android-layout button drawable

我想将两个图像添加到一个包含两行文本的按钮,如下所示: enter image description here

注意:上面的图片是照片,看起来像我想要的。

我不知道如何实现这一目标。我可以通过编程方式将一个图像添加到左侧的按钮,如下所示:

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);

但它最终会像这样结束:

enter image description here

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

请注意,我将动态创建按钮,并不总是这个匹配。因此,我无法在这两个团队中添加图像。

我开始认为可能不是添加两个图像和两行文本,为什么不只是制作两个包含图像内部文本的图像并添加图像的顶部和底部。

2 个答案:

答案 0 :(得分:1)

虽然我同意Nero的说法,自定义按钮可能是一个更清洁的解决方案。

我能够使用LayerListDrawable找到解决方案。

我将两个位图drawable调整为按钮文本的大小,然后在图层列表drawable中按照该大小插入它们。请参阅代码示例。

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

答案 1 :(得分:0)

想到的唯一解决方案是将Button置于相对布局(或您喜欢的任何布局)中,然后匹配父级,然后在其上组织视图(只需确保在api 21+上按钮具有高程将其设置为0或某事)。

此链接启发了我:Android Custom button with imageview and textview inside?