How to draw multiline text to canvas easily
There are situations where you have to use a Canvas. What do you do if you have more text than you can properly display?
The problem is, that if you want multiline text on canvas, with the drawText method, you would have to measure how much space a single line of text would take up, and also compare it to the width of the screen, and draw each line separately.
Read more to check my solution.
I tought to myself, hey why not use a TextView, add the text, use it's word wrap properties, than get a bitmap from it, and draw it on canvas.
I made a helper class, that extends View:
- String mText;
- Context mContext;
- super(context);
- mContext = context;
- }
- @Override
- super.onDraw(canvas);
- drawTextOnCanvas(canvas, mText);
- }
- // maybe color the bacground..
- canvas.drawPaint(paint);
- // Setup a textview like you normally would with your activity context
- TextView tv = new TextView(mContext);
- // setup text
- tv.setText(mText);
- // maybe set textcolor
- // you have to enable setDrawingCacheEnabled, or the getDrawingCache will return null
- tv.setDrawingCacheEnabled(true);
- // we need to setup how big the view should be..which is exactly as big as the canvas
- tv.measure(MeasureSpec.makeMeasureSpec(canvas.getWidth(), MeasureSpec.EXACTLY), MeasureSpec.makeMeasureSpec(canvas.getHeight(), MeasureSpec.EXACTLY));
- // assign the layout values to the textview
- tv.layout(0, 0, tv.getMeasuredWidth(), tv.getMeasuredHeight());
- // draw the bitmap from the drawingcache to the canvas
- canvas.drawBitmap(tv.getDrawingCache(), 0, 0, paint);
- // disable drawing cache
- tv.setDrawingCacheEnabled(false);
- }
- this.mText = text;
- }
- }
Usage would be something like this:
- public class MultiLineCanvasActivity extends Activity {
- @Override
- public void onCreate(Bundle savedInstanceState) {
- super.onCreate(savedInstanceState);
- String text = "Venison turkey short loin pork belly tri-tip. Pastrami jerky pancetta tail salami shoulder. Ribeye ball tip short loin, andouille shankle pork chop shank short ribs pork belly tongue jerky beef venison pig pork. Bresaola t-bone cow rump flank. Ball tip spare ribs strip steak, cow beef ribs corned beef chuck chicken salami hamburger shankle drumstick. Venison ham beef sirloin, pastrami meatloaf brisket tail ball tip chicken bacon. Shank shoulder tail cow short loin tenderloin, pork ground round tongue salami jowl short ribs turkey t-bone fatback.";
- CanvasHelper ch = new CanvasHelper(this);
- ch.setText(text);
- setContentView(ch);
- }
- }
On the nexus one:

On the HTC Wildfire:

On the Acer Iconica A500:

New tutorials from Helloandroid
Recent Apps
Android on Twitter
-
@Idevicegazette (iDevice Gazette)
GSM-to-Skype bridge lets you lose those roaming fees http://bit.ly/lbRJeh #android
11 years 2 weeks ago -
@tommy_banane (tom b.)
RT @AndroidFavorite: #Android New Desktop Android Market Is Live, Adds Several New Features http://zorr0.nl/lFwXNz
11 years 2 weeks ago -
@dwilliams5 (Dennis Williams)
just completed a runtastic run of 3.02 km in 40 min 11 s with #runtastic #Android App: http://tinyurl.com/5tvrpe3
11 years 2 weeks ago -
@S_Pinz (Spinz!)
RT @Androidheadline: Out of box #LG Optimus 3D got Quadrant 2420 score. Thanks @blink_c #io2011 #android http://twitpic.com/4whkdz
11 years 2 weeks ago -
@tayaitapps (Taya IT)
Next Google TV Looks A Lot Like Android http://t.co/dvlTim3 via @alleyinsider #google #apple #android #tv #honeycomb
11 years 2 weeks ago
Poll
Useful resources
Android Development Projects
- iOS/Android Developer to take older Games and bring them Current
- Android apps developer - need to finish urgent.
- Buliding MobileApp For onlie order
- looking for android APP developers
- Create an ecommerce app
- text-to voice for smartphones IOS - GOOGLE - HARMONY - AND ALEXA
- Optimize Images on App
- Create small feature with drag-drop text for Android
- Scouting for advanced website and Mobile apps developers. Potential Long-term contract.
- BLACK SCREEN