Android: button with rotated (vertical) text

13 10 2012

If you want to build button with vertical text like that:

Vertical Button

You can override standard button and its onDraw() method. There you have to rotate text before drawing it. Same thing can be done with TextView – since button actually is extended TextView.

1. Write your own Button implementation

Here is code that actually you can copy-paste to your poject:

public class VerticalButton extends Button{
	final boolean topDown;

	public VerticalButton(Context context, AttributeSet attrs){
		super(context, attrs);
		final int gravity = getGravity();
		if(Gravity.isVertical(gravity) && (gravity&Gravity.VERTICAL_GRAVITY_MASK) == Gravity.BOTTOM) {
			setGravity((gravity&Gravity.HORIZONTAL_GRAVITY_MASK) | Gravity.TOP);
			topDown = true;
		}else
			topDown = false;
	}

	@Override
	protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec){
		super.onMeasure(heightMeasureSpec, widthMeasureSpec);
		setMeasuredDimension(getMeasuredHeight(), getMeasuredWidth());
	}

	@Override
	protected void onDraw(Canvas canvas){
		TextPaint textPaint = getPaint(); 
		textPaint.setColor(getCurrentTextColor());
		textPaint.drawableState = getDrawableState();

		canvas.save();

		if(topDown){
			canvas.translate(getWidth(), 0);
			canvas.rotate(90);
		}else {
			canvas.translate(0, getHeight());
			canvas.rotate(-90);
		}

		canvas.translate(getCompoundPaddingLeft(), getExtendedPaddingTop());
		getLayout().draw(canvas);
		canvas.restore();
	}
}

As you see – there is topDown flag. Depending on it the text will be rotated left or right (read from top to down or from down to top). This flag is set depending on the gravity defined in your layout.xml (set grafity to BOTTOM or TOP to see difference).

2. Place vertical button in activity

Do it by drag and drop in graphical layout editor (choose Custom & Library Views – Vertical button will be visible here since it extends some standard android view):

Vertical Button in graphical editor

or write xml code in layout.xml:

<pl.looksok.utils.VerticalButton
    android:id="@+id/verticalButton"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/verticalButton" />

please notice that package name of VerticalButton.java has to be written here (pl.looksok.utils).

3. That’s all!

Note: This code was found somewhere in the Internet (I can’t claim credit) – I really don’t remember wherefrom I took it :)

Did I help you?
I manage this blog and share my knowledge for free sacrificing my time. If you appreciate it and find this information helpful, please consider making a donation in order to keep this page alive and improve quality

Donate Button with Credit Cards

Thank You!

Advertisements




Android: Action listener on EditText change

8 09 2012

If business logic requires to trigger any kind of action right after the user changes text in EditText View, the TextWatcher listener can be used. Good example of use is filter, that updates when user provides filtering criteria.

Add textChanged listener to EditText:

myEditText.addTextChangedListener(onSearchFieldTextChanged);

Implement listener to perform desired actions:

TextWatcher onSearchFieldTextChanged = new TextWatcher(){
	public void afterTextChanged(Editable s) {
		//your business logic after text is changed
	}
	public void beforeTextChanged(CharSequence s, int start, int count, int after){
		//your business logic before text is changed
	}

	public void onTextChanged(CharSequence s, int start, int before, int count){
		//your business logic while text has changed
	}
};

Did I help you?
I manage this blog and share my knowledge for free sacrificing my time. If you appreciate it and find this information helpful, please consider making a donation in order to keep this page alive and improve quality

Donate Button with Credit Cards

Thank You!








%d bloggers like this: