There are numerous ways to handle images in java. Whenever the approach is to create image from database, without creating image on disk and if you want everything should be in-memory then, following approach can be used with apache Base64 encoding.
Steps:
1) Add enctype="multipart/form-data" to form tag.
2) Add input type file to form which gives the "org.springframework.web.multipart.commons.CommonsMultipartFile" object which inturn gives the byte array and also add code to preview the image as:
<div id='preview' style="width:600px">
Upload your image <input id="content" type='file' name="content" onchange="previewImage(this);" />
<br>
<img id="pImage" src="#" />
</div>
<script>
function previewImage(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
$('#pImage').attr('src', e.target.result);
$('#pImage').attr('width', 140);
$('#pImage').attr('height', 120);
};
//console.log('file name ' + input.files[0])
reader.readAsDataURL(input.files[0]);
}
}
</script>
3) In code you can create the image to required width, height and other dimensions..The example API is:
....
import net.sf.fir4j.generator.transform.Transformation;
import net.sf.fir4j.options.OutputOptions;
import net.sf.fir4j.options.RenderMode;
import net.sf.fir4j.options.ResizeMode;
import net.sf.fir4j.options.OutputOptions;
import javax.imageio.IIOImage;
import javax.imageio.ImageIO;
import org.apache.commons.io.FilenameUtils;
import org.apache.commons.lang.StringUtils;
......
private static string DEFAULT_IMAGE_EXTENSION = "jpg";
public byte[] generateImage(byte[] argContent, String argExtension) {
if (argContent != null) {
InputStream bis = null;
ByteArrayOutputStream bos = null;
try {
bis = new ByteArrayInputStream(argContent);
bos = new ByteArrayOutputStream();
BufferedImage image = ImageIO.read(bis);
BufferedImage bImage = generateImage(image, this.options);
String extension = argExtension;
if (StringUtils.isEmpty(argExtension)) {
extension = DEFAULT_IMAGE_EXTENSION;
}
ImageIO.write(bImage, extension, bos);
bos.flush();
byte[] scaledImageBytes = bos.toByteArray();
return scaledImageBytes;
} catch (Exception e) {
logger.error(
"Error occurred while regenerating image from database byte contents:",
e);
} finally {
if (bos != null) {
try {
bos.close();
} catch (Exception e) {
// ignore.
}
}
if (bis != null) {
try {
bis.close();
} catch (Exception e) {
// ignore.
}
}
}
}
return null;
}
public BufferedImage generateImage(final BufferedImage argImage,
OutputOptions argOptions) {
Transformation transformation = new CropTransform(argImage, argOptions);
return transformation.generateImage();
}
In above code "BufferedImage" is java.awt.image.BufferedImage;
From above method you get the byte array after applying the required options. In above code "this.options" specifies the required options as:
.....
private options OutputOptions();
// it is from firj4.jar
this.options = new Options();
this.options.setQuality(1);
this.options.setRenderMode(RenderMode.BEST);
this.options.setMode(ResizeMode.resizeAndFill);
this.options.setMaxWidth(argWidth);
this.options.setMaxHeight(argHeight);
Once you get the byte array, you can easily store it in database.
4) Get the bytes from database, encode using apache Base64, create the string which we can pass. Set the generated string to src attribute of img tag.
Load the object from database using hibernate or with whatever mechanism you have. Once you get the object say "image", get the byte array, say "content".
......
import org.apache.commons.codec.binary.Base64;
.....
String str = "data:image/png;base64,"
+ new String(Base64.encodeBase64(content,
false));
Now, set this str to form bean object and simpy use it in UI for "src" attribute of "img" tag..That's it ;)
Steps:
1) Add enctype="multipart/form-data" to form tag.
2) Add input type file to form which gives the "org.springframework.web.multipart.commons.CommonsMultipartFile" object which inturn gives the byte array and also add code to preview the image as:
<div id='preview' style="width:600px">
Upload your image <input id="content" type='file' name="content" onchange="previewImage(this);" />
<br>
<img id="pImage" src="#" />
</div>
<script>
function previewImage(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
$('#pImage').attr('src', e.target.result);
$('#pImage').attr('width', 140);
$('#pImage').attr('height', 120);
};
//console.log('file name ' + input.files[0])
reader.readAsDataURL(input.files[0]);
}
}
</script>
3) In code you can create the image to required width, height and other dimensions..The example API is:
....
import net.sf.fir4j.generator.transform.Transformation;
import net.sf.fir4j.options.OutputOptions;
import net.sf.fir4j.options.RenderMode;
import net.sf.fir4j.options.ResizeMode;
import net.sf.fir4j.options.OutputOptions;
import javax.imageio.IIOImage;
import javax.imageio.ImageIO;
import org.apache.commons.io.FilenameUtils;
import org.apache.commons.lang.StringUtils;
......
private static string DEFAULT_IMAGE_EXTENSION = "jpg";
public byte[] generateImage(byte[] argContent, String argExtension) {
if (argContent != null) {
InputStream bis = null;
ByteArrayOutputStream bos = null;
try {
bis = new ByteArrayInputStream(argContent);
bos = new ByteArrayOutputStream();
BufferedImage image = ImageIO.read(bis);
BufferedImage bImage = generateImage(image, this.options);
String extension = argExtension;
if (StringUtils.isEmpty(argExtension)) {
extension = DEFAULT_IMAGE_EXTENSION;
}
ImageIO.write(bImage, extension, bos);
bos.flush();
byte[] scaledImageBytes = bos.toByteArray();
return scaledImageBytes;
} catch (Exception e) {
logger.error(
"Error occurred while regenerating image from database byte contents:",
e);
} finally {
if (bos != null) {
try {
bos.close();
} catch (Exception e) {
// ignore.
}
}
if (bis != null) {
try {
bis.close();
} catch (Exception e) {
// ignore.
}
}
}
}
return null;
}
public BufferedImage generateImage(final BufferedImage argImage,
OutputOptions argOptions) {
Transformation transformation = new CropTransform(argImage, argOptions);
return transformation.generateImage();
}
In above code "BufferedImage" is java.awt.image.BufferedImage;
From above method you get the byte array after applying the required options. In above code "this.options" specifies the required options as:
.....
private options OutputOptions();
// it is from firj4.jar
this.options = new Options();
this.options.setQuality(1);
this.options.setRenderMode(RenderMode.BEST);
this.options.setMode(ResizeMode.resizeAndFill);
this.options.setMaxWidth(argWidth);
this.options.setMaxHeight(argHeight);
Once you get the byte array, you can easily store it in database.
4) Get the bytes from database, encode using apache Base64, create the string which we can pass. Set the generated string to src attribute of img tag.
Load the object from database using hibernate or with whatever mechanism you have. Once you get the object say "image", get the byte array, say "content".
......
import org.apache.commons.codec.binary.Base64;
.....
String str = "data:image/png;base64,"
+ new String(Base64.encodeBase64(content,
false));
Now, set this str to form bean object and simpy use it in UI for "src" attribute of "img" tag..That's it ;)