I'm trying to save the content of a MovieClip in a JPEG image, but when I save it the image has this problem:
There is a blank space in it (obvious from quote formatting), this appears in all the images that I try to save using filereference with JPGEncoder.
I believe that the problem might be happening because of the JPGEncoder class but I'm not sure about it.
This is the function I'm using to save the image (some of the strings are in portuguese):
private function fl_Salvar(event:MouseEvent)
{
try
{
var src:BitmapData = new BitmapData(imageViewer.width,imageViewer.height);
var mtx:Matrix = DisplayUtils.fitIntoRect(imageViewer.mcImage.getChildAt(0),rect,true,Alignment.MIDDLE,false);
src.draw(imageViewer,mtx,null,null,null,true);
var jpgEncoder:JPGEncoder = new JPGEncoder(85);
var imgStream:ByteArray = null;
imgStream = jpgEncoder.encode(src);
var file:FileReference = new FileReference();
file.addEventListener( IOErrorEvent.IO_ERROR, ioErrorHandler );
file.save( imgStream, "TESTE.jpg");
}
catch (ioe:IllegalOperationError)
{
trace("Operação Ilegal.");
}
catch (ae:ArgumentError)
{
trace("Argumento Inválido.");
}
catch (me:MemoryError)
{
trace("Memória Insuficiente.");
}
catch (error:Error)
{
trace("Erro ao tentar salvar imagem : "
+ " . Erro : " + error);
}
}
private function ioErrorHandler( event:IOErrorEvent ):void
{
trace("Handler de erro I/O: " + event);
}
I would like to know if someone knows what might be causing this.
Thanks in advance.
Edit:
Here is my rect declaration:
rect = new Rectangle(imageViewer.mcImage.x,imageViewer.mcImage.y,imageViewer.mcImage.width,imageViewer.mcImage.height);
It's because of these two lines:
var mtx:Matrix = DisplayUtils.fitIntoRect(imageViewer.mcImage.getChildAt(0),rect,true,Alignment.MIDDLE,false);
src.draw(imageViewer,mtx,null,null,null,true);
What they do is that they fit your image inside some rect. You haven't provided info what's that rect and how it's defined, but I guess it has some dimensions. So you are fitting image in, and it's not stretched, but resized on the longer side.
Encoder works well, you just need to check the rectangle that you want to fit the image in.
Are you sure it is not you picture viewing software that is doing this? The image seems complete (they are written out to a byteArray pixel by pixel from top left to lower right.) if it were the file stream or byte array that were the trouble I would expect to see a distorted picture.
Is there actually a part of the image missing, or is that the full image?
Related
I am getting an image dynamically from a webservice. Afterwards I am supposed to use it as background for the upper half of the screen. My problem is that I only get one size of the image (which should be approximately right for many smartphones phones) but when I resize it to make it fill half of the screen it gets pixelated.
I have tried putting it as background of a container (adding padding to the expected size) and using BACKGROUND_IMAGE_SCALED_FILL and/or using Image methods scaledHeight/scaledWidth, fill and scaled.
It doesn't matter if I scale it to a bigger or smaller size it still deteriorates noticeably.
Is this to be expected? Is there another way to scale images?
public class CopyOfVistaPantallaPrincipal extends VistaDisparaEventos {
private Container canvasPantallaPrincipal;
public CopyOfVistaPantallaPrincipal() {
canvasPantallaPrincipal = new Container();
canvasPantallaPrincipal.setName("canvasPantallaPrincipal");
super.canvas = this.canvasPantallaPrincipal;
initPantallaPrincipal();
}
private void initPantallaPrincipal() {
canvasPantallaPrincipal.setLayout(new LayeredLayout());
canvasPantallaPrincipal.getUnselectedStyle().setBgTransparency(0);
ModeloNovedades modelo = new ModeloNovedades();
Image imgPrincipal = createImagenPrincipal(modelo);
canvasPantallaPrincipal.setName("canvas pantalla principal");
Container otro = new Container(new BorderLayout());
if (imgPrincipal != null) {
img.getUnselectedStyle().setBorder(null);
img.getUnselectedStyle().setPadding(0, 0, 0, 0);
img.getUnselectedStyle().setMargin(0, 0, 0, 0);
canvasPantallaPrincipal.addComponent(img);
}
canvasPantallaPrincipal.addComponent(otro);
}
private Container createImagenPrincipal(ModeloNovedades modelo) {
return loadTopImage(modelo, modelo.getDestacado());
}
private Container loadTopImage(ModeloNovedades modelo, Hashtable destacado) {
int width = Display.getInstance().getDisplayWidth();
int imgHeight = (int) ((Display.getInstance().getDisplayHeight() / 2) * 0.95) ;
//Default image
Image foregroundImage = FormFactory.loadImage("/imagenPrincipaLogoOld.png");
if (! modelo.getDestacado().isEmpty()){
String destacadaURL = "" + destacado.get("imagen");
if (! destacadaURL.equals("")){
//After updating it loads the downloaded image here
byte[] data = (byte[]) DataCenter.getInstance().get(destacadaURL, false);
foregroundImage = FormFactory.loadImage(data, 100);
}
}
imageContainer.getAllStyles().setPadding(imgHeight/2, imgHeight/2, width/2, width()/2);
imageContainer.getAllStyles().setBgImage(foregroundImage);
imageContainer.getAllStyles().setBackgroundType(Style.BACKGROUND_IMAGE_SCALED_FILL);
return imageContainer;
}
}
If I'm not returning the image but a container having it as background I would add it to a Container like this:
imageContainer.getAllStyles().setPadding(imgHeight/2, imgHeight/2, width/2, width/2);
imageContainer.getAllStyles().setBgImage(foregroundImage);
imageContainer.getAllStyles().setBackgroundType(Style.BACKGROUND_IMAGE_SCALED); //only if it was scaled
Original image (please ignore the dark bar over it, it was added recently and I didn't save the previous version, as I said it comes dynamically):
http://i68.tinypic.com/16lmeqr.jpg
Scaled:
http://i68.tinypic.com/w7zafm.jpg
Cropped:
http://i65.tinypic.com/2nkp79l.png
Image as of the last update:
http://i68.tinypic.com/2ik7eiq.png
Remove all of your code that manipulates the image, needs scaling, scale etc... That is all redundant. Every pass you do on manipulating an image deteriorates it a little bit...
You need just one line change and you need to do it always so the image will always "fit" without cropping or any other changes:
imageContainer.getAllStyles().setBackgroundType(Style.BACKGROUND_IMAGE_SCALE_TO_FILL);
Notice that you can just use ScaleImageLabel instead of image container which does roughly the same thing.
this is a post I have made on the adobe forum...
I'm newish to flash and i'm doing a presentation as part of a University assignment.
My problem is basically this. As part of my presentation I have a photo gallery which uses thumbnail images as buttons and then a UI loader to load a pop up version of the larger image from my webserver - as per https://www.youtube.com/watch?v=Peo_nT9HHa0
The image was created on photoshop. It is a .jpg and has text within the image that describes underneath it what the image is all about. The text within photoshop is set to anti-aliasing 'smooth' and when I test the movie within flash, the text underneath the image looks fine - just as it does in photoshop.
However, when I publish and upload the .swf file to my webserver and view the image through a browser, the text looks awful - all jaggy and broken if that makes sense.
Any ideas why?
I was given a reply of...
If you are loading the images dynamically then you will have to set the smoothing property true after the file(s) has been loaded. So if you don't currently have a listener for the images finishing loading, you will need one, and an event handler function to assign the smoothing property to true for each of them.
Can anyone help with creating the actionscript for this listener and event handler function?
I basically have a gallery movie clip with buttons that act as clickable thumbnails. The actionscript for that is...
btnImage1.addEventListener(MouseEvent.CLICK, loadimage1);
function loadimage1 (event:MouseEvent):void{
imagetxt.text = "a";
togglewindow.gotoAndPlay(2)
}
and then a UI loader that displays the larger image when a thumbnail is clicked
if (MovieClip(this.parent).imagetxt.text == "a"){
var imgurl:String ="IMAGE URL";
var myrequest:URLRequest = new URLRequest(imgurl);
myloader.load(myrequest);
}
As indicated, you should always turn smoothing on if the image is going to be scaled at all. It uses a different scaling algorithm that blurs pixels rather than deletes them. Take note that it is substantially slower to smooth, but on modern machines you shouldn't notice the difference unless you are doing it to thousands of images all at once.
After instantiation, add a Event.COMPLETE handler to Loader.contentLoaderInfo.
var myLoader = new Loader();
myLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, loaderCompleteHandler);
Then in the handler, you can access the Bitmap and turn smoothing on.
function loaderCompleteHandler(e:Event):void {
var image:Bitmap = myLoader.content as Bitmap; //Loader.content is typed as a DisplayObject, so we need to cast it as a Bitmap
image.smoothing = true;
}
And that should solve the issue. You may need to add the image object to the stage rather than the myLoader object. I don't think you'll have to, but I can't remember.
Just add event an event listener to your loader. Like this:
load.addEventListener(Event.COMPLETE,doneLoad);
then in the doneLoad function get the event.data and cast it to Bitmap and set the bitmap smoothing to true:
var myBitmap:Bitmap= e.target.data as Bitmap;
myBitmap.smoothing=true;
//add bitmap to parent ....
I wrote you universal method for loading images, you should pass 3 arguments to the method: holder for big images, image path, and rectangle to restrict image bounds and resize them. This method should be sufficient for your task.
private function loadImage(holder:DisplayObjectContainer, path:String, bounds:Rectangle):void {
var loader:Loader = new Loader();
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, function (e:Event):void {
var bitmap:Bitmap = loader.content as Bitmap;
if (bitmap != null) {
bitmap.smoothing = true;
//Resize bitmap to fit bounds
var availableRatio:Number = bounds.width / bounds.height;
var componentRatio:Number = bitmap.width / bitmap.height;
if (componentRatio > availableRatio) {
bitmap.width = bounds.width;
bitmap.height = bounds.width / componentRatio;
} else {
bitmap.width = bounds.height * componentRatio;
bitmap.height = bounds.height;
}
//Clear previous
var i:uint, len: uint = holder.numChildren, old: Bitmap;
for(i; i < len; ++i){
old = holder.removeChildAt(0) as Bitmap;
old.bitmapData.dispose();
}
//Here you can add some appear animation
bitmap.x = bounds.x + ((bounds.width - bitmap.width) >> 1);
bitmap.y = bounds.y + ((bounds.height - bitmap.height) >> 1);
holder.addChild(bitmap);
}
});
loader.load(new URLRequest(path));
}
Usage:
loadImage(myContainer, "Path-to-Image", new Rectangle(20, 20, 400, 200));
I'm new to working with PdfBox and I'm having a small issue when displaying images. I'm able to import the image, which is sized at 800*900 pixels, and looks fine when viewed in an existing pdf at 100%. However when the resulting PDF is generated using the below code, the image becomes blurry, and the image extends beyond the boundaries of the A4 page.
Is there a different way of sizing/saving images so that they display correctly in pdfbox?
public class PDFtest {
/**
* #param args the command line arguments
*/
public static void main(String[] args) throws IOException, COSVisitorException {
// TODO code application logic here
// Create a document and add a page to it
PDDocument document = new PDDocument();
PDPage page = new PDPage(PDPage.PAGE_SIZE_A4);
document.addPage(page);
// Create a new font object selecting one of the PDF base fonts
PDFont font = PDType1Font.HELVETICA_BOLD;
InputStream in = new FileInputStream(new File("img.jpg"));
PDJpeg img = new PDJpeg(document, in);
// Start a new content stream which will "hold" the to be created content
PDPageContentStream contentStream = new PDPageContentStream(document, page);
// Define a text content stream using the selected font, moving the cursor and drawing the text "Hello World"
contentStream.drawImage(img, 10, 700);
contentStream.beginText();
contentStream.setFont(font, 12);
contentStream.moveTextPositionByAmount(10, 650);
contentStream.drawString("Hello World");
contentStream.endText();
// Make sure that the content stream is closed:
contentStream.close();
// Save the results and ensure that the document is properly closed:
document.save("Hello World.pdf");
document.close();
}
I'd like to point out that as of 2.0 the contentStream.drawXObject function call in Victor's answer is deprecated. If you want to specify a width and height you should use contentStream.drawImage(image, x, y, width, height)
I had the same problem asked in this question, but the given answer is not right.
After some research I found a solution.
Instead of using the function drawImage use the function drawXObject
contentStream.drawXObject( img, 10, 700, 100, 100 );
Where the last two numbers specify the size of the image to be drawn.
For similar situation, for me, with PDF 2.0.11 and a tiff file of dimensions - 1600 x 2100 the following code perfectly fit the image in A4 (portrait) size. Not sure if PDFRectangle is okay with you.
I got this example straight from PDFBOX - Example
The only thing I tweaked/introduced is:
PDRectangle.A4.getWidth(), PDRectangle.A4.getHeight()
Here is the full sample:
public static void main(String[] args) throws IOException
{
// if (args.length != 2)
// {
// System.err.println("usage: " + ImageToPDF.class.getName() + " <image> <output-file>");
// System.exit(1);
// }
String imagePath = "C:/FAX/sample.tiff";
String pdfPath = "C:/FAX/sample.pdf";
if (!pdfPath.endsWith(".pdf"))
{
System.err.println("Last argument must be the destination .pdf file");
System.exit(1);
}
try (PDDocument doc = new PDDocument())
{
PDPage page = new PDPage();
doc.addPage(page);
// createFromFile is the easiest way with an image file
// if you already have the image in a BufferedImage,
// call LosslessFactory.createFromImage() instead
PDImageXObject pdImage = PDImageXObject.createFromFile(imagePath, doc);
// draw the image at full size at (x=20, y=20)
try (PDPageContentStream contents = new PDPageContentStream(doc, page))
{
// draw the image at full size at (x=20, y=20)
contents.drawImage(pdImage, 0, 0, PDRectangle.A4.getWidth(), PDRectangle.A4.getHeight());
// to draw the image at half size at (x=20, y=20) use
// contents.drawImage(pdImage, 20, 20, pdImage.getWidth() / 2, pdImage.getHeight() / 2);
}
doc.save(pdfPath);
System.out.println("Tiff converted to PDF succussfully..!");
}
}
Hope it helps.
If your intention is an A4 sized pic on a PDF, then i guess you find the actual size of typical A4 in pixels.
Also you should be aware of the extension of the picture that you want to view like jpg, gif, or bmp ...
from what I saw in your code, the dimensions of the picture are 10 X 700 which I believe is pretty small size.
contentStream.drawImage(img, 10, 700);
And the extension of the picture is : jpg
InputStream in = new FileInputStream(new File("img.jpg"));
check those and return for more info.
that's all.
good luck'''
As per the new API 2.0.x, one can use the PDRectangle to fetch Pdf page width and height. One can use PDPageContentStream to draw the image in accordance with PDF page.
For reference:
try (PDPageContentStream contents = new PDPageContentStream(pdDocument, pdPage)) {
final PDRectangle mediaBox = pdPage.getMediaBox();
final PDImageXObject pdImage = PDImageXObject.createFromFile(image, pdDocument);
contents.drawImage(pdImage, 0, 0, mediaBox.getWidth(), mediaBox.getHeight());
}
Here is my code :
void MainWindow::on_actionOpen_Image_triggered()
{
QString fileName = QFileDialog::getOpenFileName(this,"Open Image File",QDir::currentPath());
if(!fileName.isEmpty())
{
QImage image(fileName);
if(image.isNull())
{
QMessageBox::information(this,"Image Viewer","Error Displaying image");
return;
}
QGraphicsScene scene;
QGraphicsView view(&scene);
QGraphicsPixmapItem item(QPixmap::fromImage(image));
scene.addItem(&item);
view.show();
}
}
I want to display image from file, code works fine but image disappiars very fast.
How can I pause image screen?
And how can I load image in "graphicsView" widget?
My code:
void MainWindow::on_actionOpen_Image_triggered()
{
QString fileName = QFileDialog::getOpenFileName(this,"Open Image File",QDir::currentPath());
if(!fileName.isEmpty())
{
QImage image(fileName);
if(image.isNull())
{
QMessageBox::information(this,"Image Viewer","Error Displaying image");
return;
}
QGraphicsScene scene;
QGraphicsPixmapItem item(QPixmap::fromImage(image));
scene.addItem(&item);
ui->graphicsView->setScene(&scene);
ui->graphicsView->show();
}
}
It does not work.
How to fix this?
You need to create all your objects on the heap, otherwise they get deleted when they go out of scope:
QGraphicsScene* scene = new QGraphicsScene();
QGraphicsView* view = new QGraphicsView(scene);
QGraphicsPixmapItem* item = new QGraphicsPixmapItem(QPixmap::fromImage(image));
scene->addItem(item);
view->show();
Your second question might be related - scene is assigned to ui->graphicsView but it gets deleted immediately after, so again create all your objects on the heap.
If you don't have to stick with QGraphicsView one possibility is to use QLabel instead. I didn't manage to solve it for QGraphicsView...
QString filename = "X:/my_image";
QImage image(filename);
ui->label->setPixmap(QPixmap::fromImage(image));
I'm trying to ascertain wither there is a limitation on the camera access in the j2me implementation on the HTC Touch2. The native camera is 3MP however it seams that the quality is notably reduced when accessed via j2me, in fact it seams that the only size and format the .getSnapshot() method is able to return is a 240x320 pixel jpeg. I'm trying to confirm that this is a limitation if the j2me implementation and not my coding. Hears and example of some of the things I have tried:
private void showCamera() {
try {
mPlayer = Manager.createPlayer("capture://video");
// mPlayer = Manager.createPlayer("capture://video&encoding=rgb565&width=640&height=480");
mPlayer.realize();
mVideoControl = (VideoControl)mPlayer.getControl("VideoControl");
canvas = new CameraCanvas(this, mVideoControl);
canvas.addCommand(mBackCommand);
canvas.addCommand(mCaptureCommand);
canvas.setCommandListener(this);
mDisplay.setCurrent(canvas);
mPlayer.start();
}
catch (Exception ex) {}
}
public void capture() {
try {
// Get the image.
byte[] raw = mVideoControl.getSnapshot("encoding=jpeg&quality=100&width=640&height=480");
// byte[] raw = mVideoControl.getSnapshot("encoding=png&quality=100&width=
// 640&height=480");
// byte[] raw = mVideoControl.getSnapshot(null);
Image image = Image.createImage(raw, 0, raw.length);
// Image thumb = createThumbnail(image);
// Place it in the main form.
if (mMainForm.size() > 0 && mMainForm.get(0) instanceof StringItem)
mMainForm.delete(0);
mMainForm.append(image);
If anyone could help it would be much appreciated.
I have reseved word from a number of sources that there is indeed a limitation on the camera access the JVM has witch is put in place by the operating system.