Can I display both textOn and textOff in a switch?

Question

I have a Switch which will choose between Male and Female.

So I'm setting textOff and textOn to 'male' and 'female' respectively, but only one of male or female is displayed, depending on the switch position.

How can I have it display both male and female?

So, in ascii-art

I have

[Male /        ]
or 
[     / Female ]

but I want

[**Male** / Female]
[Male / **Female**]

http://stackoverflow.com/questions/19356349/switch-issue-only-one-option-visible — Ashbin Mathew, Aug 25 '15 at 06:31

score 5 · Answer 1 · answered Oct 06 '15 at 21:47

Well you can, but it's a bit of a hassle.

Here's what I've done to get this:

I use a custom drawable for the track of the switch. (The track is the container within which the thumb slides left and right.)

mMessengerSwitch.setTrackDrawable(new SwitchTrackTextDrawable(this,
        "LEFT", "RIGHT"));

Here's the implementation of the SwitchTrackTextDrawable, which writes the text in the background exactly in the right position (well, I've only tested it for API 23 on a Nexus 5):

/**
 * Drawable that generates the two pieces of text in the track of the switch, one of each
 * side of the positions of the thumb.
 */
public class SwitchTrackTextDrawable extends Drawable {

    private final Context mContext;

    private final String mLeftText;

    private final String mRightText;

    private final Paint mTextPaint;

    public SwitchTrackTextDrawable(@NonNull Context context,
            @StringRes int leftTextId,
            @StringRes int rightTextId) {
        mContext = context;

        // Left text
        mLeftText = context.getString(leftTextId);
        mTextPaint = createTextPaint();

        // Right text
        mRightText = context.getString(rightTextId);
    }

    private Paint createTextPaint() {
        Paint textPaint = new Paint();
        //noinspection deprecation
        textPaint.setColor(mContext.getResources().getColor(android.R.color.white));
        textPaint.setAntiAlias(true);
        textPaint.setStyle(Paint.Style.FILL);
        textPaint.setTextAlign(Paint.Align.CENTER);
        // Set textSize, typeface, etc, as you wish
        return textPaint;
    }

    @Override
    public void draw(Canvas canvas) {
        final Rect textBounds = new Rect();
        mTextPaint.getTextBounds(mRightText, 0, mRightText.length(), textBounds);

        // The baseline for the text: centered, including the height of the text itself
        final int heightBaseline = canvas.getClipBounds().height() / 2 + textBounds.height() / 2;

        // This is one quarter of the full width, to measure the centers of the texts
        final int widthQuarter = canvas.getClipBounds().width() / 4;
        canvas.drawText(mLeftText, 0, mLeftText.length(),
                widthQuarter, heightBaseline,
                mTextPaint);
        canvas.drawText(mRightText, 0, mRightText.length(),
                widthQuarter * 3, heightBaseline,
                mTextPaint);
    }

    @Override
    public void setAlpha(int alpha) {
    }

    @Override
    public void setColorFilter(ColorFilter cf) {
    }

    @Override
    public int getOpacity() {
        return PixelFormat.TRANSLUCENT;
    }
}

Could you please share the code? I can't achieve that one. – Mark Delphi Aug 09 '22 at 16:37 — Mark Delphi, Aug 09 '22 at 16:37

score 0 · Answer 2 · edited May 23 '17 at 12:17

0

You can make an two images that has both (an image for a toggle on and a toggle off) and then create a selector.

Just change the textOn and textOff to an empty string.

edited May 23 '17 at 12:17

Community

1
1

answered Dec 11 '13 at 22:55

Embattled Swag

1,479
12
23

Thanks for the suggestion. I try to avoid images wherever possible, so was looking for a markup solution. – pinoyyid Dec 13 '13 at 07:49

score 0 · Answer 3 · answered Dec 13 '13 at 07:52

0

I found the easiest way to get the appearance I was looking for was a pair of adjacent, abutting buttons. Onclick, I swap the background colours.

answered Dec 13 '13 at 07:52

pinoyyid

21,499
14
64
115

Can I display both textOn and textOff in a switch?

3 Answers3