KImage

KImage is a Konfabulator library that is meant to be used as a drop-in replacement for complex Image objects. It gives added functionality for treating a group of images as a single image.

Extract the contents of KImage.zip into your Widget's folder, and include KImage.js to be able to create KImage objects.

Usage examples may be found inside the KImage.js file.

KImage was created by James M. Allen.

Details

The functionality that KImage was created to perform was "smart-scaling" of images - a neat effect where you can stretch specific parts of an image, while keeping other parts fixed. The Yahoo! Weather Widget makes use of this technique when you expand/collapse it - the top and bottom of the image are fixed, while the middle stretches to the desired size of the Widget.

The way a Widget developer uses this is by creating a series of images in one of the following three configurations:

3x3 (2-Dimensional)

3x3 (2-Dimensional)

This allows for smart-scaling in both horizontal and vertical directions. If you specify the src as "MyImage*.png", then you must have nine images total:

1. MyImageTopLeft.png
2. MyImageTopCenter.png
3. MyImageTopRight.png
4. MyImageMiddleLeft.png
5. MyImageMiddleCenter.png
6. MyImageMiddleRight.png
7. MyImageBottomLeft.png
8. MyImageBottomCenter.png
9. MyImageBottomRight.png

1x3 (Vertical)

1x3 (Vertical)

This allows for smart-scaling in just the vertical direction. If you specify the src as "MyImage|.png", then you must have three images total:

1. MyImageTop.png
2. MyImageMiddle.png
3. MyImageBottom.png

3x1 (Horizontal)

3x1 (Horizontal)

This allows for smart-scaling in just the horizontal direction. If you specify the src as "MyImage<.png", then you must have three images total:

1. MyImageLeft.png
2. MyImageCenter.png
3. MyImageRight.png

Usage

This is the usage example inside KImage.js:

include("KImage.js");
foo = new KImage();
foo.src = "Resources/Window*.png";
foo.hOffset = 30;
foo.vOffset = 30;
foo.width = 200;
foo.height = 150;