Tutorial by Examples: mage

Raw image data

It's possible to write directly to the rendered image data using putImageData. By creating new image data then assigning it to the canvas, you will clear the entire screen. var imageData = ctx.createImageData(canvas.width, canvas.height); ctx.putImageData(imageData, 0, 0); Note: putImageData is...

html5-canvas • Clearing the screen

How shapes & images REALLY(!) "move" on the Canvas

A problem: Canvas only remembers pixels, not shapes or images This is an image of a circular beach ball, and of course, you can't drag the ball around the image. It may surprise you that just like an image, if you draw a circle on a Canvas you cannot drag that circle around the canvas. That's be...

html5-canvas • Dragging Path Shapes & Images on Canvas

Dragging images around the Canvas

See this Example for a general explanation of dragging Shapes around the Canvas. This annotated example shows how to drag images around the Canvas // canvas related vars var canvas=document.createElement("canvas"); var ctx=canvas.getContext("2d"); canvas.width=378; canvas.h...

html5-canvas • Dragging Path Shapes & Images on Canvas

Load image in a circular ImageView without custom transformations

Create a custom BitmapImageViewTarget to load the image into: public class CircularBitmapImageViewTarget extends BitmapImageViewTarget { private Context context; private ImageView imageView; public CircularBitmapImageViewTarget(Context context, ImageView imageView) { ...

Android • Glide

Prepare image dataset for image classification task

Caffe has a build-in input layer tailored for image classification tasks (i.e., single integer label per input image). This input "Data" layer is built upon an lmdb or leveldb data structure. In order to use "Data" layer one has to construct the data structure with all training d...

caffe • Prepare Data for Training

Background images

Full width table cell background images <html xmlns:v="urn:schemas-microsoft-com:vml"> <head> <style> v:* { behavior: url(#default#VML); display: inline-block; } </style> </head> <body> <center> <...

email • HTML email composition and Outlook intricacies

Image Resizing

Using width or height tags to resize images in your markup can create a problem in Internet Explorer browsers. If your reader is viewing an email in-browser, and that email happens to have fluid images in it, they’ll look pretty ugly as they resize. Using -ms-interpolation-mode:bicubic; ensures that...

email • HTML email composition and Outlook intricacies

Scaling image to fit or fill.

Scaling to fit Means that the whole image will be visible but there may be some empty space on the sides or top and bottom if the image is not the same aspect as the canvas. The example shows the image scaled to fit. The blue on the sides is due to the fact that the image is not the same aspect as ...

html5-canvas • Images

Using shell without extending Mage_Shell_Abstract

Bootstrapping Magento by calling: require_once 'app/Mage.php'; Mage::app(); // Your code This is the simplest way but not really the Magento way because we're not using class that extends Mage_Shell_Abstract - the class which when extended provides us with tools to parse command line arguments...

magento • Shell, CLI

Using shell the Magento way - extend Mage_Shell_Abstract

Magento way File resides in shell/custom.php <?php require_once' abstract.php'; class Stackoverflow_Shell_Custom extends Mage_Shell_Abstract { protected $_argname = array(); public function __construct() { parent::__construct(); // Time limit to infinity ...

magento • Shell, CLI

Creating a simple image programmatically and displaying it

class ImageCreationExample { static Image createSampleImage() { // instantiate a new BufferedImage (subclass of Image) instance BufferedImage img = new BufferedImage(640, 480, BufferedImage.TYPE_INT_ARGB); //draw something on the image paintOnI...

Java Language • Creating Images Programmatically

Save an Image to disk

public static void saveImage(String destination) throws IOException { // method implemented in "Creating a simple image Programmatically and displaying it" example BufferedImage img = createSampleImage(); // ImageIO provides several write methods with different outputs ...

Java Language • Creating Images Programmatically

Specifying image rendering quality

static void setupQualityHigh(Graphics2D g2d) { g2d.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON); g2d.setRenderingHint(RenderingHints.KEY_RENDERING, RenderingHints.VALUE_RENDER_QUALITY); // many other RenderingHints KEY/VALUE pairs to specify } ...

Java Language • Creating Images Programmatically

Apply UIColor to UIImage

Use same UIImage with multiple theme base app by just applying UIColor to UIImage instance as following. // *** Create an UIImage instance with RenderingMode AlwaysTemplate *** UIImage *imgMenu = [[UIImage imageNamed:@"iconMenu"] imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate]...

iOS • UIImage

Rotate an Image or Path around it's centerpoint

Steps#1-5 below allow any image or path-shape to be both moved anywhere on the canvas and rotated to any angle without changing any of the image/path-shape's original point coordinates. Move the canvas [0,0] origin to the shape's center point context.translate( shapeCenterX, shapeCenterY ); ...

html5-canvas • Transformations

Creating an image with BufferedImage class

int width = 256; //in pixels int height = 256; //in pixels BufferedImage image = new BufferedImage(width, height, BufferedImage.TYPE_4BYTE_ABGR); //BufferedImage.TYPE_4BYTE_ABGR - store RGB color and visibility (alpha), see javadoc for more info Graphics g = image.createGraphics(); //draw w...

Java Language • Creating Images Programmatically

Editing and re-using image with BufferedImage

BufferedImage cat = ImageIO.read(new File("cat.jpg")); //read existing file //modify it Graphics g = cat.createGraphics(); g.setColor(Color.RED); g.drawString("Cat", 10, 10); g.dispose(); //now create a new image BufferedImage cats = new BufferedImage(256, 256, Buffere...

Java Language • Creating Images Programmatically

Setting individual pixel's color in BufferedImage

BufferedImage image = new BufferedImage(256, 256, BufferedImage.TYPE_INT_ARGB); //you don't have to use the Graphics object, you can read and set pixel color individually for (int i = 0; i < 256; i++) { for (int j = 0; j < 256; j++) { int alpha = 255; //don't forget this, or ...

Java Language • Creating Images Programmatically

Loading images, audio and other resources

Java applets are able to load different resources. But since they are running in the web browser of the client you need to make sure that these resources are accessible. Applets are not able to access client resources as the local file system. If you want to load resources from the same URL the App...

Java Language • Applets

Clip images inside shapes with "destination-in"

context.globalCompositeOperation = "destination-in" "destination-in" compositing clips existing drawings inside a new shape. Note: Any part of the existing drawing that falls outside the new drawing is erased. context.drawImage(picture,0,0); context.globalCompositeOperation...

html5-canvas • Compositing