如何减少Android RadioButton上可绘制按钮的大小

Question

I have six different images, with both selected, and unselected versions. I'd like to turn these images into radio buttons, so I made 100px x 100px versions of them, thinking that will be plenty for the radio button to just scale them down to a proper radio button size. I set the RadioButton 's android:button attribute to xml drawables with selectors for the checked and unchecked states, and I made the radio group's orientation horizontal.

I get a row of large images, with their right sides cut off. Is there a way to scale the buttons of a RadioButton down to a reasonable size, without having to make more drawables?

I've tried making the android:button attribute be @null , and applying my drawable, selector, xmls to android:background but that doesn't keep my row of buttons square. I've also tried forcing the layout_height of the button to be a smaller number, but then it just cuts off the top and bottom of the image, with no scaling.

As a side question, is it better to have a bunch of versions of the buttons for different DPIs, and where can I learn more about how big things need to be for each dpi scale/folder?

Update

I used the original svg files I had of the graphics and converted them into on and off VectorDrawables, which should be able to be easily scaled, right? I'm at a loss for what to do because no one seems to have this issue, since they just make their drawables the size they need for the radio button, so no scaling needed.

Answer 1

After banging my head against a wall forever on this, I decided that I'd try making my own custom radio button view. And as it turns out, what I needed ended up being super simple! First, I made a new class, called something like ImageRadioButton, then extended AppCompatRadioButton. I only needed to override the onMeasure method and read the attempted width of the radio button, and set the height to the aspect ratio of the width. Something like this:

protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    int desiredWidth = MeasureSpec.getSize(widthMeasureSpec);
    Drawable drawable = getBackground();

    float aspectRatio = (float)drawable.getIntrinsicHeight() / (float)drawable.getIntrinsicWidth();
    setMeasuredDimension(desiredWidth, (int)(desiredWidth * aspectRatio));
}

With the images I'm using set as the background of the radiobutton, the text empty, and button null, this works exactly as I needed, without having to make new drawables of different sizes.

This new radio button won't work for vertically aligned radio buttons, unless their widths are constrained, and since the background is taken up by the graphic, it can't have a separate background. It'll also look terrible with text in it, but this works for me for now.