I’m evaluating the touchkit and built a sample application using NavViews.
On the left side is a hierarchical structure and on item touch the right side shows up an pre-rendered PDF within an Embedded object.
In Chrome and Safari (both on Desktop) they’re shown correctly with the ability of resizing.
iPads Safari Browser shows the PDF, but it is not possible to scroll or resize the PDF.
How can this be achieved on the iPad?
The code to show the preview data looks like this and will be called on touching an item on the left side hierarchy
private void showPreviewData(Object id) {
preview.removeAllComponents();
if (id != null) {
final byte[] previewData = (byte[]
) havDS.getDetailData(id);
if (previewData != null) {
Embedded embedded = new Embedded();
embedded.setType(Embedded.TYPE_BROWSER);
embedded.setSource(getEmbeddedResource(previewData));
embedded.setSizeFull();
embedded.setImmediate(true);
embedded.setMimeType("application/pdf");
preview.addComponent(embedded);
preview.setSizeFull();
preview.setImmediate(true);
embedded.requestRepaint();
}
else {
AxionApplication.getApp().getMainWindow().showNotification(Messages.get().errorNoPreview,
Notification.TYPE_HUMANIZED_MESSAGE | Notification.POSITION_CENTERED);
}
}
setModuleArea();
}
private StreamResource getEmbeddedResource(final byte[] data) {
StreamResource sr = new StreamResource(new StreamSource() {
@Override
public InputStream getStream() {
return new ByteArrayInputStream(data);
}
}, Messages.get().preview, AxionApplication.getApp());
sr.setMIMEType("application/pdf");
// Do not cache embedded data
sr.setCacheTime(0);
return sr;
}
preview is a CSSLayout.
The right side view is a NavigationView containing a CSSLayout like in the MobileMail sample
preview will be set as a component to the CSSLayout of the NavigationView
public void setModuleArea(Component component) {
layout.removeAllComponents();
layout.setSizeFull();
layout.addComponent(component);
}
It is an OSGI application consisting of a set of plugins (main, module1, … moduleN, … DataSets, …) which runs on Equinox and Felix.
The method
setModuleArea in the latter code snippet belongs to the main plugin whereas the call to
setModuleArea() belongs to a module, just for clarification.
I’d assume native browsers on mobile devices treat pdf like an image if it is embedded into a host page. I don’t know if there is a setting to enable native zoom controls.
One way to enable zoom controls etc would be to open pdf “fullscreen”. I guess you could add a click listener that opens the file fullscreen if it is clicked.