LEADTOOLS Leadtools.Topics.Documents.UI

フレームを表示

ドキュメントビューワはLEADTOOLSラスターを使います、そして、ドキュメントは、キャッシュに格納して、最小の量のcodeでデスクトップまたはウェブでドキュメントの任意型を表示することができて、編集することができて、修正することができるアプリケーションを作成するのを許すためにSVGOCRアノテーション画像ビューワ技術をサポートします。

機能

ドキュメントビューワを作成すること

DocumentViewerは、ドキュメントビューワにより用いられる主要なクラスです。それはコントロール自体でありません、代わりに、必要なUIコントロールを作成することはユーザーにより提供される親コンテナを使います。これらのコンテナは、呼び出し元プラットフォーム ― たとえば、Windowsフォームのネイティブなコントロールや、HTML/JavaScriptのDIV要素 ― のネイティブコントロールです。これによりアプリケーションは以下を実行できます。

以下は、ドキュメントビューワを使うアプリケーションを示します:

DocumentViewerは、以下のパーツを持っています:

  1. ビュー:ドキュメントの主なコンテンツが表示される部分。この部分は、オプションでありません。

  2. サムネイル:ページのサムネイルがビューワである部分。この部分はオプションです。

  3. ブックマーク:ドキュメントのブックマークと目次が追加される部分。この部分はオプションです。

  4. アノテーション:アノテーションツールバーとオブジェクトのリストが追加されている部分。この部分はオプションです。

  5. アプリケーションユーザーインターフェース:残りはユーザーアプリケーションのUI要素で、ドキュメントビューワの一部ではありません。これらは、ドキュメントビューワコマンドと結びつく通常標準的なメニューとツールバー項目です。

アプリケーションで新しいDocumentViewerを作成すること:

  1. DocumentViewerCreateOptionsの新しいインスタンスを作成して、以下のメンバを初期化します:

    • ViewContainer:アプリケーションで既存のコントロールに設定します。これは、主なビューが作成される(part 1)ところです。ドキュメントビューワはImageViewerのインスタンスを作成して、それをここで追加します。

    • ThumbnailsContainer(オプション):アプリケーションで既存のコントロールに設定します。これは、そこでサムネイルです作成します(パート2)。ドキュメントビューワはImageViewerのインスタンスを作成して、それをここで追加します。

    • BookmarksContainer(オプション):アプリケーションで既存のコントロールに設定します。これは、ブックマークと目次が作成される(パート3)ところです。ドキュメントビューワはツリーコントロールを作成して、それをここで追加します。

    • UseAnnotations(オプション):ドキュメントビューワでアノテーションを使うために、trueまたはfalseに設定します。あとであと、アノテーションツールバーとオートメーションオブジェクトは作成されます。

  2. 1つ前の手順から作成オプションを渡すDocumentViewerFactory.CreateDocumentViewerメソッドを呼び出します。

DocumentViewerが作成されたあと、コントロールにロードドキュメントを開始することができて、ビューワで操作を呼び出すためにいろいろなプロパティとメソッドを呼び出すことができます。

ドキュメントのロード

DocumentViewerは、任意のLEADTOOLSドキュメントオブジェクトを表示できます。このクラスを用いたドキュメントの任意型をロードする方法に関する情報については、「LEADTOOLSドキュメントライブラリを使用したロード」を参照してください。

Documentオブジェクトが得られたら、SetDocumentメソッドを用いたドキュメントビューワで設定します。ビューワはドキュメントをロードして、ページのラスターまたはSVG代表でビューを値を入力します。サムネイル、ブックマークまたはアノテーションが使われるならば、現段階でドキュメントビューワによっても値を入力されます。

コード例

以下は、ドキュメントビューワを作成して、文書ファイルをそれへロードするために必要な最小限のcodeの上の例です。

デスクトップアプリケーション

Windowsフォームプラットホームのために、新しいWindowsフォームアプリケーションを作成して、それからForm1:に以下を追加します


             protected override void OnLoad(EventArgs e)
             {
                // Create the UI of the application. Two panels, one
                // for the thumbnails (on the left) and one for the view (fill the form)
                var viewPanel = new Panel { Dock = DockStyle.Fill };
                this.Controls.Add(viewPanel);
                var thumbnailsPanel = new Panel { Dock = DockStyle.Left };
                this.Controls.Add(thumbnailsPanel);
            
                // Create the document viewer using the panels we created
                var createOptions = new DocumentViewerCreateOptions { ViewContainer = viewPanel, ThumbnailsContainer = thumbnailsPanel };
                var documentViewer = DocumentViewerFactory.CreateDocumentViewer(createOptions);
            
                // Set some options, such as Pan/Zoom interactive mode
                documentViewer.Commands.Run(DocumentViewerCommands.InteractivePanZoom);
                // And view the documents as SVG if available - no rasterization
                documentViewer.View.PreferredItemType = DocumentViewerItemType.Svg;
            
                // Load a PDF document
                var document = DocumentFactory.LoadFromFile(
                   @"C:\Users\Public\Documents\LEADTOOLS Images\Leadtools.pdf",
                   new LoadDocumentOptions { UseCache = false });
                // Set in the viewer
                documentViewer.SetDocument(document);
            
                base.OnLoad(e);
             }
             

デモを実行します、そして、ビューワは作成されて、完全に機能的です。PDF文書がロードされたあと、ビューをパンしてズームすることができて、ページを通してスクロールすることができます。サムネイルのどれでもクリックすることは、ページへ行きます。SVG描画が使用され、CTRL-Leftを使用してマウスをドラッグしてズームインすると、ページはラスタライズされずテキストはシャープなままになります。

ウェブアプリケーション

HTML5/JavaScriptプラットホームのために、body:で以下の要素で新しいHTMLファイルを作成します


             <!--View-->
             <div id="view"></div>
             <!-- Thumbnails -->
             <div id="thumbnails"></div>
             

以下のJavaScript codeを追加します:


             window.onload = function () {
                // Create the document viewer using the DIV elements
                var createOptions = new lt.Documents.UI.DocumentViewerCreateOptions();
                createOptions.viewContainer = document.getElementById("view");
                createOptions.thumbnailsContainer = document.getElementById("thumbnails");
                var documentViewer = lt.Documents.UI.DocumentViewerFactory.createDocumentViewer(createOptions);
            
                // Set some options, such as Pan/Zoom interactive mode
                documentViewer.commands.run(lt.Documents.UI.DocumentViewerCommands.interactivePanZoom);
                // And view the documents as SVG if available - no rasterization
                documentViewer.view.preferredItemType = lt.Documents.UI.DocumentViewerItemType.svg;
            
                // Load a PDF document
                var loadDocumentCommand = lt.Documents.LoadDocumentCommand.create("http://demo.leadtools.com/images/pdf/leadtools.pdf");
                var prom = loadDocumentCommand.run().done(function (document) {
                   // Ready, set in the viewer
                   documentViewer.setDocument(document);
                });
             };
             

任意のブラウザでデモを実行します、そして、ビューワは作成されて、そのデスクトップ対応する物のように完全に機能的です。PDFはロードされて、ネイティブJavaScript codeを用いたウェブブラウザの中にSVGを使うことを与えられます。マウスとタッチ両方は、サポートされます

参照

参照

ドキュメントビューワの操作
ドキュメントビューワのコマンド
ドキュメントライブラリ機能
LEADTOOLSドキュメントライブラリを使用したロード
LEADTOOLSドキュメントコンバーターの使用