Question

我想创建一个带有文字和图片的自定义按钮，如下图所示。我不想使用drawableTop，因为我无法设置图片的大小。另外，我不想使用Imageview和TextView的布局。

经过大量的尝试和搜索，我创建了一个同样做的文件，但问题是它在左边显示图像。通过这个文件，我可以控制图像的大小。所以我的问题是我应该在代码中进行哪些更改，以便将图像转移到顶部。

我的代码

<com.kliff.digitaldwarka.utils.IconButton
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     app:iconSrc="@drawable/services_video"
     app:iconSize="50dp"
     app:iconPadding="1dp"
     android:text="hello"
     android:background="@null" />

IconButton.java

public class IconButton extends AppCompatButton {
    private Bitmap mIcon;
    private Paint mPaint;
    private Rect mSrcRect;
    private int mIconPadding;
    private int mIconSize;

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

    public IconButton(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context, attrs);
    }

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

    @Override
    protected void onDraw(Canvas canvas) {
        int shift = (mIconSize + mIconPadding) / 2;

        canvas.save();
        canvas.translate(shift, 0);

        super.onDraw(canvas);

        if (mIcon != null) {
            float textWidth = getPaint().measureText((String)getText());
            int left = (int)((getWidth() / 2f) - (textWidth / 2f) - mIconSize - mIconPadding);
            int top = getHeight()/2 - mIconSize/2;

            Rect destRect = new Rect(left, top, left + mIconSize, top + mIconSize);
            canvas.drawBitmap(mIcon, mSrcRect, destRect, mPaint);
        }

        canvas.restore();
    }

    private void init(Context context, AttributeSet attrs) {
        TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.IconButton);

        for (int i = 0; i < array.getIndexCount(); ++i) {
            int attr = array.getIndex(i);
            switch (attr) {
                case R.styleable.IconButton_iconSrc:
                    mIcon = drawableToBitmap(array.getDrawable(attr));
                    break;
                case R.styleable.IconButton_iconPadding:
                    mIconPadding = array.getDimensionPixelSize(attr, 0);
                    break;
                case R.styleable.IconButton_iconSize:
                    mIconSize = array.getDimensionPixelSize(attr, 0);
                    break;
                default:
                    break;
            }
        }

        array.recycle();

        //If we didn't supply an icon in the XML
        if(mIcon != null){
            mPaint = new Paint();
            mSrcRect = new Rect(0, 0, mIcon.getWidth(), mIcon.getHeight());
        }
    }
    public void setmIcon(Context mContext,int drawableRes){
        Drawable drawable= ContextCompat.getDrawable(mContext,drawableRes);
        mIcon = drawableToBitmap(drawable);
        if(mIcon != null){
            mPaint = new Paint();
            mSrcRect = new Rect(0, 0, mIcon.getWidth(), mIcon.getHeight());
        }
    }

    public static Bitmap drawableToBitmap (Drawable drawable) {
        if (drawable instanceof BitmapDrawable) {
            return ((BitmapDrawable)drawable).getBitmap();
        }

        Bitmap bitmap = Bitmap.createBitmap(drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight(), Bitmap.Config.ARGB_8888);
        Canvas canvas = new Canvas(bitmap);
        drawable.setBounds(0, 0, canvas.getWidth(), canvas.getHeight());
        drawable.draw(canvas);

        return bitmap;
    }
}

attrs.xml

<declare-styleable name="IconButton">
    <attr name="iconSrc" format="reference" />
    <attr name="iconSize" format="dimension" />
    <attr name="iconPadding" format="dimension" />
</declare-styleable>

输出

预期

注意：此外，如果可以通过添加一个属性来操作此代码以在任何一侧设置图像。任何帮助都是适当的

Answer 1

我会使用library(lattice) y <- c(rnorm(10), rnorm(10, 2, 0.2), rnorm(10, 1.5, 0.4)) x <- rep(1:10, times = 3) z <- rep(letters[1:3], each = 10) # Option 1 xyplot(y ~ x, groups = z, type = "l", par.settings = standard.theme(color = FALSE)) # Option 2 xyplot(y ~ x, groups = z, type = "l", lty = 1:3, col = "black")，但如果您没有选择，请查看下面的代码：我更改了FrameLayout +我更改了文本的onDraw()对象，并为图标添加了Paint对象。

Paint

编辑：我将函数public class IconButton extends AppCompatButton { private Bitmap mIcon; private Paint mPaint; private Paint mIconPaint; private int mIconPadding; public IconButton(Context context, AttributeSet attrs, int defStyle) { super(context, attrs, defStyle); init(context, attrs); } public IconButton(Context context, AttributeSet attrs) { super(context, attrs); init(context, attrs); } public IconButton(Context context) { super(context); } @Override protected void onDraw(Canvas canvas) { if (mIcon != null) { float xPos = (canvas.getWidth() - mIconPadding - mIcon.getScaledWidth(canvas)) / 2; canvas.drawBitmap(mIcon, xPos, mIconPadding, mIconPaint); } final CharSequence text = "Movie tickets"; float textWidth = getTextWidth(mPaint, text.toString()); float xPos = ((canvas.getWidth() - textWidth) / 2); canvas.drawText(text, 0, text.length(), xPos, mIcon.getScaledWidth(canvas) + (mIconPadding * 2), mPaint); } private void init(Context context, AttributeSet attrs) { TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.IconButton); for (int i = 0; i < array.getIndexCount(); ++i) { int attr = array.getIndex(i); switch (attr) { case R.styleable.IconButton_iconSrc: mIcon = drawableToBitmap(array.getDrawable(attr)); break; case R.styleable.IconButton_iconPadding: mIconPadding = array.getDimensionPixelSize(attr, 0); break; case R.styleable.IconButton_iconSize: mIconSize = array.getDimensionPixelSize(attr, 0); break; default: break; } } array.recycle(); //If we didn't supply an icon in the XML if (mIcon != null) { mPaint = new Paint(); mSrcRect = new Rect(0, 0, mIcon.getWidth(), mIcon.getHeight()); } mIconPaint = new Paint(TextPaint.ANTI_ALIAS_FLAG); mIconPaint.setStyle(Paint.Style.FILL); } /** * @param paint the paint you are going to paint the text with * @param str String to check its width * @return the width of string in PX */ public static float getTextWidth(Paint paint, String str) { return paint.measureText(str); } }添加到代码

使用上面的图像创建一个按钮，而不是使用drawableTop（）

1 个答案: