Tutorial by Examples: canvas

Drawing text in canvas with your font from assets. Typeface typeface = Typeface.createFromAsset(getAssets(), "fonts/SomeFont.ttf"); Paint textPaint = new Paint(); textPaint.setTypeface(typeface); canvas.drawText("Your text here", x, y, textPaint);

Swift let image = UIGraphicsGetImageFromCurrentImageContext() imageView.image = image //assuming imageView is a valid UIImageView object Objective-C UIImage *image = UIGraphicsGetImageFromCurrentImageContext(); imageView.image = image; //assuming imageView is a valid UIImageView object

<canvas id="c" width="400" height="400"></canvas> var canvas = new fabric.Canvas("c"); canvas.on('mouse:up', function () { console.log('Event mouse:up Triggered'); }); canvas.on('mouse:down', function () { console.log('Event mouse:d...

Using canvas elements HTML provides the canvas element for building raster-based images. First build a canvas for holding image pixel information. var canvas = document.createElement('canvas'); canvas.width = 500; canvas.height = 250; Then select a context for the canvas, in this case two-di...

<canvas id = "canvas" height='400' width='500'></canvas> var canvas = new fabric.Canvas(document.getElementById('canvas')); console.log(JSON.stringify(canvas)); // '{"objects":[],"background":""}' canvas.add(new fabric.Rect({ left: 10, ...

The principle is essentially the same as for the Text widget, but a Grid layout is used to put the scrollbars around the widget. canvas = tk.Canvas(parent, width=150, height=150) canvas.create_oval(10, 10, 20, 20, fill="red") canvas.create_oval(200, 200, 220, 220, fill="blue")...

This covers how you can create a basic 2D game using SurfaceView. First, we need an activity: public class GameLauncher extends AppCompatActivity { private Game game; @Override public void onCreate(Bundle sis){ super.onCreate(sis); game = new Game(GameLauncher....

You can save a canvas to an image file by using the method canvas.toDataURL(), that returns the data URI for the canvas' image data. The method can take two optional parameters canvas.toDataURL(type, encoderOptions): type is the image format (if omitted the default is image/png); encoderOptions is ...

The window resize events can fire in response to the movement of the user's input device. When you resize a canvas it is automatically cleared and you are forced to re-render the content. For animations you do this every frame via the main loop function called by requestAnimationFrame which does its...