Sencha Touch 1.1 - отображение PDF на панели - PullRequest
Новая
       1

Sencha Touch 1.1 - отображение PDF на панели

1 голос
/ 27 марта 2012

Я создаю приложение в Sencha Touch 1.1 для iPad. Как я могу отобразить PDF в Ext.Panel?

Я попытался использовать элементы embed и iframe, установив их атрибут src в файл PDF. IPad отображает файл PDF, но прокрутка отключена - то есть я вижу первую страницу PDF, но не могу прокрутить вниз, чтобы просмотреть другие страницы.

Далее я попытался использовать window.open (url_to_pdf). Это откроет файл PDF в новой вкладке, что нормально, если пользователь просматривает приложение из Safari, но если они добавили приложение на главный экран, концепция вкладок отсутствует: пользователь может увидеть файл PDF. (и пролистайте его), но не можете вернуться к приложению.

Я кратко рассматривал рендеринг PDF как HTML, используя эту библиотеку: http://andreasgal.com/2011/06/15/pdf-js/, но это просто кажется излишним.

Ответы [ 2 ]

1 голос
/ 28 марта 2012

К сожалению, вы не можете прокручивать что-либо внутри фрейма при использовании Safari (UIWebView) на iPad.

iPad - невозможно прокручивать внутри фрейма

Можно подуматьесли у вас есть серверная генерация PDF, то вы должны создать PDF, который, как вы знаете, будет соответствовать содержимому, поскольку у вас фиксированное разрешение.Вы можете взять свою одну большую страницу PDF и разделить ее на несколько меньших страниц.Для этого должна быть библиотека на языке вашего сервера.Затем вы можете использовать карусель или табуляцию, чтобы позволить пользователю переключать страницы, что-то вроде чтения книги.

0 голосов
/ 07 октября 2012

Мне кажется, что проблема немного в другом. Вы можете добиться прокрутки (но двумя пальцами) на iPad Safari, но когда вы помещаете тот же код в поле «html» Ext.Panel, это не работает.

Возьмите этот пример: 

<!DOCTYPE HTML>
    <html>
    <head>
      <title>Testing iFrames on iPad</title>
      <style>
      div {
        border: solid 1px green;
        height:100px;
      }

    .scroller{
        border:solid 1px #66AA66;
        height: 400px;
        width: 400px;
        overflow: auto;
        text-align:center;
    }
    </style>

</head>

<body>

    <table>
      <tr>
        <td><div class="scroller">
        <iframe width="400" height="400" src="http://www.supremecourt.gov/opinions/11pdf/11-393c3a2.pdf" ></iframe>
    </div>
        </td>
        <td><div class="scroller">
        <iframe width="400" height="400" src="http://www.supremecourt.gov/opinions/11pdf/11-393c3a2.pdf" ></iframe>
    </div>
        </td>
      </tr>
      <tr>
      <td><div class="scroller">
        <iframe width="400" height="400" src="http://www.supremecourt.gov/opinions/11pdf/11-393c3a2.pdf" ></iframe>
    </div>
        </td>
        <td>
        <div id="scroller" style="border:solid 1px #66AA66;
        height: 400px;
        width: 400px;
        overflow: auto;
        text-align:center;">
        <iframe src="http://ctan.mackichan.com/macros/latex/contrib/bibleref/samples/sample.pdf" width="100%" height="100%"></iframe>
        </div>
    </div>
        </td>
      </tr>
    </table>
    <div> Here are some additional contents.</div>
</body>
</html>

Это прекрасно работает в iOS Safari, но если вы попытаетесь получить последний div и поместить его в поля Ext.Panel.html, это не сработает !!

У вас есть идеи по этому поводу? Извините, это не реальный ответ, но это не было бы возможно поместить в комментарий:)

...