JavaFX Canvas Fonts are all the same - java

I'm trying to write onto the JavaFX canvas. I'm having problems mixing my fonts. I'm using black and white.
Font currentFont = new Font("Georgia",125);
FontMetrics metrics = Toolkit.getToolkit().getFontLoader().getFontMetrics(currentFont);
canvas.getGraphicsContext2D().setFont(currentFont);
float charWidth = metrics.computeStringWidth(jString);
canvas.getGraphicsContext2D().fillText(jString, 1, 100, charWidth);
float charWidthSum = charWidth;
canvas.getGraphicsContext2D().setFont(new Font("Carlito",60));
metrics = Toolkit.getToolkit().getFontLoader().getFontMetrics(new Font("Carlito",60));
charWidth = metrics.computeStringWidth(aString);
canvas.getGraphicsContext2D().fillText(aString, charWidthSum, 100, charWidth);
charWidthSum+=charWidth;
canvas.getGraphicsContext2D().setFont(new Font("Ariel",50));
metrics = Toolkit.getToolkit().getFontLoader().getFontMetrics(new Font("Ariel",50));
charWidth = metrics.computeStringWidth(vString);
canvas.getGraphicsContext2D().fillText(vString, charWidthSum,100, charWidth);
charWidthSum+=charWidth;
canvas.getGraphicsContext2D().setFont(new Font("Times",125));
metrics = Toolkit.getToolkit().getFontLoader().getFontMetrics(new Font("Times",125));
charWidth = metrics.computeStringWidth(a2String);
canvas.getGraphicsContext2D().fillText(a2String, charWidthSum, 100, charWidth);
//HOW TO IMPLEMENT - to collect the content of a string, keeping font type the same
/*
public void setPixels(int x, int y, int w, int h,
PixelFormat<ByteBuffer> pixelformat,
byte buffer[], int offset, int scanlineStride);
*/
ByteBuffer byteBuffer = null;
byte[] bytes = new byte[0];
PixelFormat<ByteBuffer> pixelFormat = null;
canvas.getGraphicsContext2D().getPixelWriter().setPixels(0,0,0,0,null,bytes, 0,0); //write my new character
//
Will be same font, as I assume I'm just setting the current writeable font. If you see the unimplemented part, I'm considering trying to write the fonts using pixel writer. How to get them into the correct form? I'm using black monotone fonts
Also, I'm aware of TextFlow and StyledTextArea. StyledTextArea is for same height text, and TextFlow is not writable onto canvas, only onto a node. I need canvas functionality, I think.

Related

Improving Java ImageIO read/write with PNG that has alpha

I have a large PNG image (600x600) and my application makes the image opaque and writes out the file. The problem is that the performance with ImageIO is terrible. Are there any other alternatives? I require the image to be opaque. Below is what I am doing:
BufferedImage buf = ImageIO.read(localUrl);
float[] scales = {1f, 1f, 1f, 1f}; // R, G, B, A
float[] offsets = {0f, 0f, 0f, 1f}; // R, G, B, A
RescaleOp rescaler = new RescaleOp(scales, offsets, null);
BufferedImage opaque = rescaler.filter(buf, null);
File outputfile = new File(localUrl.getPath());
ImageIO.write(opaque, "png", outputfile);
Using a RescaleOp isn't entirely necessary here if you just want to get rid of transparency. A simpler solution would be drawing the image on a background like so:
Color bgColor = Color.WHITE;
BufferedImage foreground = ImageIO.read(localUrl);
int width = foreground.getWidth();
int height = foreground.getHeight();
BufferedImage background = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);
Graphics2D g = background.createGraphics();
g.setColor(bgColor);
g.fillRect(0, 0, width, height);
g.drawImage(foreground, 0, 0, null);
g.dispose();
File outputfile = new File(localUrl.getPath());
ImageIO.write(background, "png", outputfile);
This seems like a simpler method of doing things and would probably require less processing power, but I doubt there would be a huge difference. If you're not satisfied with the speed the image can be read / written from the hard drive, there's little you can do to speed that up.
With PNGJ:
private static void removeAlpha(File file1,File file2) {
PngReaderByte reader = new PngReaderByte(file1);
ImageInfo info = reader.imgInfo;
PngWriter writer = new PngWriter(file2,info);
writer.setFilterPreserve(true);
writer.setCompLevel(6);
writer.copyChunksFrom(reader.getChunksList(), ChunkCopyBehaviour.COPY_ALL_SAFE);
if( info.bitDepth != 8 ||info.channels!=4) throw new RuntimeException("expected 8bits RGBA ");
while(reader.hasMoreRows()) {
ImageLineByte line = reader.readRowByte();
byte [] buf = line.getScanlineByte();
for(int i=0,j=3;i<info.cols;i++,j+=4)
buf[j]=(byte)255;
writer.writeRow(line);
}
reader.end();
writer.end();
}
I'm not sure if this would enhance the perfomance. Bear in mind, also that (contrarily to Parker Hoyes' answer) this simply kills the alpha channel, but it does not blend with some background color (hence the "original" color will appear in the previously-transparent now-opaque regions).

Write text on the screen with LWJGL

I want to write text on the screen for my game, for things like fps, random text for items and stuff. How can I write that text?
Is it possible without the Basic Game class? Isn't there a command like this g.drawString("Hello World", 100, 100);?
Update: this answer is now outdated, and does not work at all with the latest versions of LWJGL. Until I update this answer fully, I recommend that you look here: https://jvm-gaming.org/t/lwjgl-stb-bindings/54537
You could use the TrueType fonts feature in the Slick-util library.
Using a common font is easy, just create the font like this:
TrueTypeFont font;
Font awtFont = new Font("Times New Roman", Font.BOLD, 24); //name, style (PLAIN, BOLD, or ITALIC), size
font = new TrueTypeFont(awtFont, false); //base Font, anti-aliasing true/false
If you want to load the font from a .ttf file, it's a little more tricky:
try {
InputStream inputStream = ResourceLoader.getResourceAsStream("myfont.ttf");
Font awtFont = Font.createFont(Font.TRUETYPE_FONT, inputStream);
awtFont = awtFont.deriveFont(24f); // set font size
font = new TrueTypeFont(awtFont, false);
} catch (Exception e) {
e.printStackTrace();
}
After you have successfully created a TrueTypeFont, you can draw it like this:
font.drawString(100, 50, "ABC123", Color.yellow); //x, y, string to draw, color
For more information, you can look at the documentation for TrueTypeFont and java.awt.Font, and the Slick-Util tutorial I got most of this code from.
Try Making a BufferedImage of required size. Then get its Graphics and draw a String. Then Convert it to a ByteBuffer and render it in OpenGL.
String text = "ABCD";
int s = 256; //Take whatever size suits you.
BufferedImage b = new BufferedImage(s, s, BufferedImage.TYPE_4BYTE_ABGR);
Graphics2D g = b.createGraphics();
g.drawString(text, 0, 0);
int co = b.getColorModel().getNumComponents();
byte[] data = new byte[co * s * s];
b.getRaster().getDataElements(0, 0, s, s, data);
ByteBuffer pixels = BufferUtils.createByteBuffer(data.length);
pixels.put(data);
pixels.rewind();
Now pixels contains the required Image data you need to draw.
Use GL11.glTexImage2D() function to draw the byte buffer.

Generate thumbnail and fill empty space with color

Is it possible to implement the first example with Scalr?
My code is the following:
BufferedImage thumbnail = Scalr.resize(ImageIO.read(sourceFile), Scalr.Method.ULTRA_QUALITY, Scalr.Mode.FIT_TO_WIDTH,
width, height, Scalr.OP_ANTIALIAS);
ImageIO.write(thumbnail, destinationfile.getExtension(), destinationfile);
What I want is to receive the image like this:
where the blue bars are the space I want to fill with the color.
Thank you
Update: maybe it is possible to implement with Thumbnailator?
Just done! Perhaps it can help you!
public static BufferedImage resizeAndCrop(BufferedImage bufferedImage) throws IOException {
int himg = bufferedImage.getHeight();
int wimg = bufferedImage.getWidth();
double rateh = himg/dim;
double ratew = wimg/dim;
double rate = ratew;
if(rateh>ratew)
rate = rateh;
int dimhimg = (int) (himg/rate);
int dimwimg = (int) (wimg/rate);
double startw = dim/2 - dimwimg/2;
double starth = dim/2 - dimhimg/2;
BufferedImage tThumbImage = new BufferedImage( dim, dim, BufferedImage.TYPE_INT_RGB );
Graphics2D tGraphics2D = tThumbImage.createGraphics(); //create a graphics object to paint to
tGraphics2D.setBackground( Color.WHITE );
tGraphics2D.setPaint( Color.WHITE );
tGraphics2D.fillRect( 0, 0, dim, dim );
tGraphics2D.setRenderingHint( RenderingHints.KEY_INTERPOLATION, RenderingHints.VALUE_INTERPOLATION_BILINEAR);
tGraphics2D.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
tGraphics2D.setRenderingHint(RenderingHints.KEY_COLOR_RENDERING, RenderingHints.VALUE_COLOR_RENDER_QUALITY);
tGraphics2D.drawImage( bufferedImage, (int)startw, (int)starth, dimwimg, dimhimg, null ); //draw the image scaled
File ff = new File(path + "jdata/tmp/prova.jpg");
ImageIO.write( tThumbImage, "JPG", ff); //write the image to a file
BufferedImage croppedContainMethod = ImageIO.read(ff);
return croppedContainMethod;
}
Nobody has idea so I will publish my solution...
I decided to continue to use Scalr (I didn't checked the Thumbnailator's last version but the previous ones failed on big pictures).
So first of all I call resize method, and then, if sizes of the new thumbnail are bigger then given ones I call crop method that crops a thumbnail by the center.. The code is the following:
BufferedImage thumbnail = Scalr.resize(sourceFile, Scalr.Method.ULTRA_QUALITY, Scalr.Mode.AUTOMATIC, destinationSize.width, destinationSize.height);
if (thumbnail.getWidth() > destinationSize.width)
thumbnail = Scalr.crop(thumbnail, (thumbnail.getWidth() - destinationSize.width) / 2, 0, destinationSize.width, destinationSize.height);
else if (thumbnail.getHeight() > destinationSize.height)
thumbnail = Scalr.crop(thumbnail, 0, (thumbnail.getHeight() - destinationSize.height) / 2, destinationSize.width, destinationSize.height);
It is not ideal, but at least it handles 'wide' images after generation of thumbnails

Apache POI-HSSF distorts image size when adding picture into Excel cell

I am adding a picture into a cell using Apache POI-HSSF. The image is 120x100 but no matter what I do and how I resize it, the Excel spreadsheet always shows it spanning multiple rows and distorts it to a much bigger height than width.
How do I keep the original size?
My code:
InputStream is = new FileInputStream(getImageURL());
byte[] bytes = IOUtils.toByteArray(is);
int pictureIdx = wb.addPicture(bytes, Workbook.PICTURE_TYPE_JPEG);
is.close();
//add a picture shape
CreationHelper helper = wb.getCreationHelper();
ClientAnchor anchor = helper.createClientAnchor();
// Create the drawing patriarch. This is the top level container for all shapes.
Drawing drawing = sheet1.createDrawingPatriarch();
//set top-left corner of the picture,
//subsequent call of Picture#resize() will operate relative to it
anchor.setAnchorType(0);
anchor.setCol1(1);
anchor.setRow1(1);
Picture pict = drawing.createPicture(anchor, pictureIdx);
//auto-size picture relative to its top-left corner
pict.resize();
I've tried all dx/dy coordinates and Col/Row. The position doesn't matter, the problem it stretches the image horizontally.
I had been facing the similar issue where the image I added was getting distorted. I tried pict.resize() and sheet.autoSizeColumn() but it didn't work. Finally I found the below URL:-
https://svn.apache.org/repos/asf/poi/trunk/src/examples/src/org/apache/poi/examples/ss/AddDimensionedImage.java
I added the above class into my code and used it's method to add the image into excel. I was able to add the image with little distortion. Hope this helps to you also. I wrote below code:-
BufferedImage imageIO = ImageIO.read(new URL(image));
int height= imageIO.getHeight();
int width=imageIO.getWidth();
int relativeHeight=(int)(((double)height/width)*28.5);
new AddDimensionedImage().addImageToSheet(2, sheet.getPhysicalNumberOfRows()-1 , sheet, sheet.createDrawingPatriarch(),new URL(image), 30, relativeHeight, AddDimensionedImage.EXPAND_ROW);
As far as i understood from documentation of Apache POI, it is because of pict.resize();
,as it says here that if the default font size for the workbook was changed, the picture might get stretched vertically or horizontally.
I've the same problem and my solution was copy this class in my project
AddDimensionedImage and then used this method.
protected void addImageInCell(Sheet sheet, URL url, Drawing<?> drawing, int colNumber, int rowNumber) {
BufferedImage imageIO = ImageIO.read(url);
int height = imageIO.getHeight();
int width = imageIO.getWidth();
int relativeHeight = (int) (((double) height / width) * 28.5);
new AddDimensionedImage().addImageToSheet(colNumber, rowNumber, sheet, drawing, url, 30, relativeHeight,
AddDimensionedImage.EXPAND_ROW_AND_COLUMN);
}
you can call this method with follow line:
URL url = new URL("https://blog.expedia.mx/por-que-los-viajeros-internacionales-visitan-mexico/");
addImageInCell(sheet, url, sheet.createDrawingPatriarch(), 0, 0);
I created another empty image with the width taken from sheet.getColumnWidthInPixels, draw the necessary image over it and used AddDimensionedImage.EXPAND_ROW_AND_COLUMN to fit it exactly into the cell:
HSSFRow imageRow = sheet.createRow(row);
BufferedImage image = ImageIO.read(Paths.get(pathToImage).toUri().toURL());
AddDimensionedImage addImage = new AddDimensionedImage();
float columnWidth = sheet.getColumnWidthInPixels(0);
BufferedImage off_Image = new BufferedImage((int) columnWidth, actualImageHeight, BufferedImage.TYPE_INT_RGB);
Graphics2D g2 = off_Image.createGraphics();
g2.setColor(new Color(192,192,192));
g2.fillRect(0, 0, off_Image.getWidth(), off_Image.getHeight());
g2.drawImage(image, 0, 0, null);
g2.dispose();
ByteArrayOutputStream baos = new ByteArrayOutputStream();
ImageIO.write(off_Image, "jpg", baos);
byte[] bytes = baos.toByteArray();
double reqImageWidthMM = ((double) off_Image.getWidth()) / ConvertImageUnits.PIXELS_PER_MILLIMETRES;
double reqImageHeightMM = ((double) off_Image.getHeight()) / ConvertImageUnits.PIXELS_PER_MILLIMETRES;
addImage.addImageToSheet("A1", sheet, bytes, reqImageWidthMM, reqImageHeightMM, AddDimensionedImage.EXPAND_ROW_AND_COLUMN);
I had to copy AddDimensionedImage.java to my classpath and overload addImageToSheet to accept byte array.
Before that I tried other options mentioned here but it didn't help. Hope my answer will be useful to someone.

In java, how do you write a java.awt.image.BufferedImage to an 8-bit png file?

I am trying to write out a png file from a java.awt.image.BufferedImage. Everything works fine but the resulting png is a 32-bit file.
Is there a way to make the png file be 8-bit? The image is grayscale, but I do need transparency as this is an overlay image. I am using java 6, and I would prefer to return an OutputStream so that I can have the calling class deal with writing out the file to disk/db.
Here is the relevant portion of the code:
public static ByteArrayOutputStream createImage(InputStream originalStream)
throws IOException {
ByteArrayOutputStream oStream = null;
java.awt.Image newImg = javax.imageio.ImageIO.read(originalStream);
int imgWidth = newImg.getWidth(null);
int imgHeight = newImg.getHeight(null);
java.awt.image.BufferedImage bim = new java.awt.image.BufferedImage(imgWidth,
imgHeight, java.awt.image.BufferedImage.TYPE_INT_ARGB);
Color bckgrndColor = new Color(0x80, 0x80, 0x80);
Graphics2D gf = (Graphics2D)bim.getGraphics();
// set transparency for fill image
gf.setComposite(AlphaComposite.getInstance(AlphaComposite.SRC_OVER, 0.3f));
gf.setColor(bckgrndColor);
gf.fillRect(0, 0, imgWidth, imgHeight);
oStream = new ByteArrayOutputStream();
javax.imageio.ImageIO.write(bim, "png", oStream);
oStream.close();
return oStream;
}
The build in imageio png writer will write 32bit png files on all the platforms I have used it on, no matter what the source image is. You should also be aware that many people have complained that the resulting compression is much lower than what is possible with the png format. There are several independent png libraries available that allow you to specify the exact format, but I don't actually have any experience with any of them.
I found the answer as to how to convert RGBA to Indexed here: http://www.eichberger.de/2007/07/transparent-gifs-in-java.html
However, the resulting 8-bit png file only has 100% or 0% transparency. You could probably tweak the IndexColorModel arrays, but we have decided to make the generated file (what was an overlay mask) into an underlay jpg and use what was the static base as the transparent overlay.
It is an interesting question... It is late, I will experiment tomorrow. I will first try and use a BufferedImage.TYPE_BYTE_INDEXED (perhaps after drawing) to see if Java is smart enough to generate an 8bit PNG.
Or perhaps some image library can allow that.
[EDIT] Some years later... Actually, I made the code at the time, but forgot to update this thread... I used the code pointed at by Kat, with a little refinement on the handling of transparency, and saving in PNG format instead of Gif format. It works in making a 8-bit PNG file with all-or-nothing transparency.
You can find a working test file at http://bazaar.launchpad.net/~philho/+junk/Java/view/head:/Tests/src/org/philhosoft/tests/image/AddTransparency.java
using my ImageUtil class.
Since the code isn't that big, for posterity sake, I post it here, without the JavaDoc to save some lines.
public class ImageUtil
{
public static int ALPHA_BIT_MASK = 0xFF000000;
public static BufferedImage imageToBufferedImage(Image image, int width, int height)
{
return imageToBufferedImage(image, width, height, BufferedImage.TYPE_INT_ARGB);
}
public static BufferedImage imageToBufferedImage(Image image, int width, int height, int type)
{
BufferedImage dest = new BufferedImage(width, height, type);
Graphics2D g2 = dest.createGraphics();
g2.drawImage(image, 0, 0, null);
g2.dispose();
return dest;
}
public static BufferedImage convertRGBAToIndexed(BufferedImage srcImage)
{
// Create a non-transparent palletized image
Image flattenedImage = transformTransparencyToMagenta(srcImage);
BufferedImage flatImage = imageToBufferedImage(flattenedImage,
srcImage.getWidth(), srcImage.getHeight(), BufferedImage.TYPE_BYTE_INDEXED);
BufferedImage destImage = makeColorTransparent(flatImage, 0, 0);
return destImage;
}
private static Image transformTransparencyToMagenta(BufferedImage image)
{
ImageFilter filter = new RGBImageFilter()
{
#Override
public final int filterRGB(int x, int y, int rgb)
{
int pixelValue = 0;
int opacity = (rgb & ALPHA_BIT_MASK) >>> 24;
if (opacity < 128)
{
// Quite transparent: replace color with transparent magenta
// (traditional color for binary transparency)
pixelValue = 0x00FF00FF;
}
else
{
// Quite opaque: get pure color
pixelValue = (rgb & 0xFFFFFF) | ALPHA_BIT_MASK;
}
return pixelValue;
}
};
ImageProducer ip = new FilteredImageSource(image.getSource(), filter);
return Toolkit.getDefaultToolkit().createImage(ip);
}
public static BufferedImage makeColorTransparent(BufferedImage image, int x, int y)
{
ColorModel cm = image.getColorModel();
if (!(cm instanceof IndexColorModel))
return image; // No transparency added as we don't have an indexed image
IndexColorModel originalICM = (IndexColorModel) cm;
WritableRaster raster = image.getRaster();
int colorIndex = raster.getSample(x, y, 0); // colorIndex is an offset in the palette of the ICM'
// Number of indexed colors
int size = originalICM.getMapSize();
byte[] reds = new byte[size];
byte[] greens = new byte[size];
byte[] blues = new byte[size];
originalICM.getReds(reds);
originalICM.getGreens(greens);
originalICM.getBlues(blues);
IndexColorModel newICM = new IndexColorModel(8, size, reds, greens, blues, colorIndex);
return new BufferedImage(newICM, raster, image.isAlphaPremultiplied(), null);
}
}
Thanks for responding, I was going to try an TYPE_BYTE_INDEXED with an IndexColorModel and may still but if ImageIO writes out 32-bit regardless it appears that I may be wasting my time there.
The image I am trying to write out can be very large (up to 8000x4000) but is just a simple mask for the image underneath, so will only have a ~30% transparent gray and a 100% transparent cutout. I would use a GIF but IE6 seems to have trouble with displaying one that large.
It only gets generated once and in an internal set-up type screen, so performance isn't an issue either, but it does have to be done within the java code and not by an offline utility.
The libraries that you specified might be used to transform it while writing... I am going to go check that out.
If anyone has a better way, please let me know!!
Thanks!

Categories

Resources