Preview a PDF inside your AIR application inside transparent and custom window - apache-flex

I have a transparent windows (skinnable).
Inside, I'd like to preview some pdf file.
BUT, in the only a black screen appear, can you help me?
Thanks

The only solution I found is to have a window with no tranparence option
Thanks

Please provide more details. If you embed the respective component inside a standard window, does it show the PDF as expected?
Additionally, these links might be of interest:
http://cookbooks.adobe.com/post_How_do_I_display_a_PDF_file_in_an_AIR_desktop_appl-19323.html
http://cookbooks.adobe.com/post_Preview_a_PDF_inside_your_AIR_application-10183.html

Are you using an HTML component? If so, it's impossible to show PDF if your window is transparent. Here's the note from the Adobe documentation. I highlighted the interesting part. (source : http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/html/HTMLLoader.html)
Note: When displayed in a transparent window, SWF content embedded in
an HTML page must be embedded using either the transparent or opaque
wmode. The default value for wmode is window, so if you do not specify
a value, SWF content may not be displayed. On Windows and Linux, SWF
content always appears on top of other content when wmode is set to
window or opaque. PDF content cannot be displayed in a transparent
window no matter which wmode setting is used.
You could show the PDF inside another window perhaps ? If you can't maybe you can find a way to open an invisible window, load the PDF there, draw it into a BitmapData oject then display the snapshot instead. Off course, this means no user interaction with the PDF whatsoever.

Related

How to modify the scroll bar style of <embed> tag

for example,<embed src="xxx.pdf"></embed> or <iframe src="xxx.pdf"></iframe>. I want to modify the scrollbar style in embed
or pdf. embed::-webkit-scrollbar, embed::-webkit-scrollbar-track, embed::-webkit-scroll-thumb is invalid.
Duplicate answer to duplicate question until closed see Making a scrollable div that encompasses the entire height of the PDF
The scrollbars in the pdf viewer are controlled INSIDE the viewer not from outside so here I can switch toolbar or scrollbars on and off by pressing keys but browsers do not permit external programable entries inside a pdf workspace. The instructions must be from the pdf internal script As done by setting inside Acrobat PDFs OR it must be either user or their program inside the binary viewer

Change button height in WebDynpro ABAP

For a touchscreen I need to increase the height of my buttons in a ABAP WebDynpro Application.
Because there's no attribute for the height I read that it should be possible to add an image to the MIME Repository and then add this image to the button.
I also read that it might be possible to create a own theme with a .css file.
The last one sounds a little bit better to me. Does anyone know how I can create such a theme and apply it to my application?
Thanks for your help!
The simpliest way of resizing height is using MIME image, which I want to describe here:
Create your image with exactly those height that you need. The image could be opaque, transparent or whatever. Image format doesn't matter, as most common formats (jpg, gif, png) are supported.
Import it to your Webdyn Pro component like this: right click on component in repository tree, then -> Create -> MIME object -> Import
After image was successfully imported, just select it using imageSource property of button element, where you can find it on Component images tab.
Voilá! The button adopted the dimensions of the image.

RibbonToggleButton - icon is corrupted

I have a ribbon-base app and on it's toggle buttons I'm placing PNG icons - 32x32, 32 bits. But when I'm launching the app the image on the ribbon button looks corrupted. Just to checkk I've create a simple button control with the same image on it - and it looks ok. see the screenshot here - http://i.imgur.com/0zct9cf.jpg
I've tried to add RenderOptions.BitmapScalingMode="HighQuality" and RenderOptions.EdgeMode="Aliased" to my app window tag - no luck.
Can someone explain whyRibbonToggleButton corrupts the images on it?
Thank you!
Try saving the image with a program that supports setting the DPI in the metadata, for example IrfanView. I had a similar problem and changing the images DPI to match the screen fixed it for me.
Open the image in IrfanVIew and press shift+i to open the image information dialog
Change the DPI to match your screen
Save the image
I have not tested this on a screen that is set to a different DPI, so I have no idea if this will look even more horribly wrong then.

Chrome adding gray outline to printed transparent png/gif

I'm working on a printing template in the browser for print-to-pdf, and am using a transparent .png overlay in one section.
This happens both with transparent .png files and transparent .gif files:
Chrome, when printing (both to .pdf, and in the print preview window), seems to outline transparent images with a 1px gray line:
Exhibit A:
I've tried this in several other browsers (including Safari) and none appear to do what Chrome does. Has anyone seen this before? I need to find a way to disable it or hack it on the Chrome side so that this will work across browsers.
To see this in action, click here: http://jsfiddle.net/brandonscript/nELwd/ (just an <img /> tag) and press Cmd/Ctrl+P to bring up the print preview. You'll see this in the preview and if you print to .pdf. Make sure you have "Background colors and images" enabled, or you won't see any images.
Note: I'm not looking for workarounds after it's been printed and I'm aware that if you size the image to 100% and view the .pdf at 100% zoom you don't see the gray line. I need to programmatically (or otherwise) remove the gray line prior to printing the .pdf.
I have experimented enough and considered all the answers above while doing so.
Suspiciously, Upon saving your image and opening in gimp and some pokes into it, What I found was this.
Which makes me think that your image in truth, containing the gray border around it. My suggestion is you remove that layer and make that empty space around the actual image to transparent.
EDIT(response to #remus comment)
I do not know if my claim is correct, but I am believing that the image is not what you are expecting it to be. You need to correct that image. I have tested with another image of mine, pasted on the fiddle is not having any border around it in screen and print preview. (And the final pdf too). Sorry if this Answer is correct and hurts you.
Though I haven't come across this exact issue, I do a lot of work with css printing (for pdf and browser printing) and more often than not I have to use 2 images: 1 for screen and 1 for printing (do not use transparency for the printing one in yuour case):
<img src='http://apigee.ignite.ms/iloveapis/portal/badge/heart-overlay.gif' width='300' height='400' class="screen"/>
<img src='http://apigee.ignite.ms/iloveapis/portal/badge/heart-overlay_print.gif' width='300' height='400' class="forPrinting"/>
in your main css file:
img.forPrinting { display:none }
in your print css file which should be declared after your main css file:
img.screen {display:none }
img.forPrinting { display:block; }
Short Answer:
Change your PDF printing preset to a higher resolution.
you'll get:
The Long version:
I noticed you have re-sized the image by changing its width height properties in the HTML code.
So I made sure your image is exactly in the size you need it and it will not have this strange contour.
See Link: jsfiddle.net/cyVqw/
I have a print preview:
PDF screenshot:
To verify that in any size the PDF will keep your image transparency I checked
PDF saved in a Higher resolution preset i.e. "Print Quality". this resulted in a large file but with better zooming quality:
Here is High Resolution 33% preview:
High Resolution 200% preview
So, what you need to do is to adjust your PDF quality preset.

Is there a way to make the native `browse` button on a file input larger cross browser?

As you may know, you can make your own file input control using the (hacky) approach of positioning the file input over your custom button and using opacity: 0 on the file input itself.
The image below shows the intended design with the file input absolutely positioned over the browse button.
As you can see, the faux browse button is much larger than the one the browser (Firefox 4) has drawn.
If I increase the width of the input, it seems to reach a limit where it won't increase anymore.
Here is a jsFiddle to play with, demonstrating the problem. The real browse button should be the same size as the faux one.
Is there a way to pull this off, or must I use Flash or make the button smaller?
font-size:70px;
http://jsfiddle.net/rH5SY/9/

Resources