Cross-platform file preview solution (iv) - Native plugin for Android and IOS

The introduction

PDF. Js, LibreOffice, or DCS, each has its own advantages and disadvantages, such as: PDF. Js does not support double finger zoom in and out, LibreOffice loading is slow, DCS charges and so on.

Online preview solution for cross-platform (Uni-app) files
Cross-platform Online File preview Solution (2)
LibreOffice vs OpenOffice

Seal-officeonline is a native plug-in for Office document preview based on UNI-app platform. Seal-officeonline supports Both Android and iOS

Seal-officeonline plug-in download address

Quick learning

Demo Project Address

Development tools: HBuilderX

Step1. Download the demo project and open it using HBuilderX

Step2. Download the plug-in of this article

Plug-in name: seal-officeonline

Download the plug-in unzip and place it under the project root directory nativePlugins, as shown in the figure below:

Step3. Select`Manifest.json ->App native plugin configuration`To load the local plug-in

Step4. Use plug-ins

In the VUE or NVUE component, import the plug-in

var testModule = uni.requireNativePlugin("Seal-OfficeOnline")
Copy the code

Use openFile to preview Office files in the following formats: PDF, TXT, doc, DOCx, XLS, XLSX, PPT, and PPTX

testModule.openFile({
	url: 'http://113.62.127.199:8090/fileUpload/1.xlsx'.topBarBgColor: '#3394EC'.topBarTextColor: '#FFFFFF'.title: 'Office Documents Online Preview '.isBackArrow: false.fileType: 'xlsx'.fileName: '1'
});
Copy the code

Parameter Description of openFile method

url

Url parameters support the following address modes:

File network addresses, such as: http://113.62.127.199:8090/fileUpload/1.xlsx
Mobile phone address of a local file, such as: / data/user / 0 / com. HBuilder. UniPlugin/files / 1. XLSX
File name, such as: 1. XLSX, access to the default directory file, the default directory: / data/user / 0 / com. HBuilder. UniPlugin

Note: The local address directory of the mobile phone requires access

title

Title represents the top column text, which defaults to SealOfficeOnline

topBarBgColor

TopBarBgColor indicates the top bar background color. Default: #177cb0 (indigo)

topBarTextColor

TopBarTextColor indicates the top column text color. Default: #FFFFFF (white)

isBackArrow

IsBackArrow indicates whether to display the return button. Default: true (to display)

fileType

FileType indicates that you can specify the fileType, for example, XLSX. You can specify the fileType when the url parameter cannot determine the fileType

fileName

FileName can specify a fileName, for example, file1. Note that the fileName extension is not included here. If both fileName and fileType are specified, the final fileName is combined with the two parameters, that is, filename.filetype

mo4tech.com (Moment For Technology) is a global community with thousands techies from across the global hang out!Passionate technologists, be it gadget freaks, tech enthusiasts, coders, technopreneurs, or CIOs, you would find them all here.

Cross-platform file preview solution (iv) – Native plugin for Android and IOS

The introduction

Quick learning

Step1. Download the demo project and open it using HBuilderX

Step2. Download the plug-in of this article