1

I have a radio button that needs to placed in center of radio group.

Here is my code:

RadioImageButton RadioImageButton = new RadioImageButton(activity);
    RadioImageButton.setGravity(Gravity.CENTER);
    RadioImageButton.setId(buttonId);
    RadioImageButton.setTextColor(Color.BLACK);
    RadioImageButton.setButtonDrawable(icon); // this is where i am replacing the default circle with an image
    RadioImageButton.setBackgroundDrawable(drawable);
    RadioGroup.LayoutParams radioImageButtonParams = new RadioGroup.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT,
        LinearLayout.LayoutParams.MATCH_PARENT, 1f);
    radioImageButtonParams.setMargins(0, 0, 1, 0);

    RadioGroup.addView(RadioImageButton, radioImageButtonParams);

In RadioImageButton class

Drawable image;

    public RadioImageButton(Context context) {
    super(context);
    setButtonDrawable(android.R.color.transparent);
    }

    @Override
    protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);

    if (image != null) {
        image.setState(getDrawableState());

        final int verticalGravity = getGravity() & Gravity.VERTICAL_GRAVITY_MASK;
        final int height = image.getIntrinsicHeight();

        int y = 0;

        switch (verticalGravity) {
        case Gravity.BOTTOM:
        y = getHeight() - height;
        break;
        case Gravity.CENTER_VERTICAL:
        y = (getHeight() - height) / 2;
        break;
        }

        int buttonWidth = image.getIntrinsicWidth();
        int buttonLeft = (getWidth() - buttonWidth) / 3;
        image.setBounds(buttonLeft, y, buttonLeft + buttonWidth, y + height);
        image.draw(canvas);
    }
    }

Currently its like this :

radiobutton  ------  text 

The text is only placed in center but not the radio button i want the text and the radio button both to be placed in center.

Goofy
  • 6,098
  • 17
  • 90
  • 156
  • you can use the gravity on radio group with centre and right or left whatever you want – Sunil Kumar Aug 29 '13 at 06:46
  • @sunil i tried that , it will not work – Goofy Aug 29 '13 at 06:48
  • 1
    RadioImageButton.setButtonDrawable(icon); donot pass the icon inside the button instead pass it on the compund drawable method if any of the radiobutton it will do good. RadioImageButton.setCompoundDrawablesWithIntrinsicBounds(left, top, right, bottom) – Terril Thomas Aug 29 '13 at 06:57
  • @TerrilThomas what are you trying to point out? – Goofy Aug 29 '13 at 06:59
  • 1
    @Goofy:If u add the icon to the button it will give u the issue that u are facing now just check for what i have pasted earlier.Try it and lemme know whether it worked out for u . Just add the drawable image as where you want it to be with respect to the text. – Terril Thomas Aug 29 '13 at 07:04
  • @TerrilThomas if you dont mind can you please help me with this http://stackoverflow.com/questions/18373087/ontouch-apply-glow-effect-to-center-of-image – Goofy Aug 29 '13 at 07:16

1 Answers1

1

With the help on TerrilThomas i was able to solve the issue:

Here is the solution :

RadioImageButton.setButtonDrawable(icon); // Not proper way

do not pass the icon inside the button instead pass it on the compund drawable method if any of the radiobutton it will do good.

RadioImageButton.setCompoundDrawablesWithIntrinsicBounds(left, top, right, bottom)// use this to set the icon

Thanks to TerrilThomas , cheers

Goofy
  • 6,098
  • 17
  • 90
  • 156
  • @TerrilThomas now the icon is displaying to the left of text and the text is in the center, but the there is lot of space between the text and the radio button how to reduce that? i havent set any padding, can you suggest me something – Goofy Aug 29 '13 at 07:37
  • add drawable padding value to some negative value – Terril Thomas Aug 29 '13 at 07:54
  • i have tried RadioImageButton.setCompoundDrawablePadding(-10); but no change – Goofy Aug 29 '13 at 08:01