Rasmus/docs.sheetjs.com
1
Fork 0
forked from sheetjs/docs.sheetjs.com
Code Pull Requests Activity

android

Browse Source
This commit is contained in:
SheetJS 2023-01-25 03:25:06 -05:00
parent e130103ad3
commit ad00a8fa3c
1 changed files with 88 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

102
docz/docs/02-getting-started/02-example.mdx
View File

@ -532,12 +532,6 @@ dialog box. After selecting a path, the app will write the file.
</TabItem>
<TabItem value="mobile" label="Mobile App">
:::caution
This demo runs in iOS and requires a Macintosh computer with Xcode installed.
:::
:::note Initial Setup
Follow the [Environment Setup](https://reactnative.dev/docs/environment-setup)
@ -552,14 +546,6 @@ npx react-native init SheetJSPres --version="0.70.6"
cd SheetJSPres
npm i -S https://cdn.sheetjs.com/xlsx-latest/xlsx-latest.tgz react-native-blob-util@0.17.1
mkdir -p patches
curl -L -o patches/react-native+0.70.6.patch https://github.com/facebook/react-native/files/10356761/react-native%2B0.70.6.patch
npx patch-package
cd ios
pod install
cd ..
```
Save the following to `App.js` in the project:
@ -623,6 +609,91 @@ const App = () => ( <SafeAreaView><View style={{ marginTop: 32, padding: 24 }}>
export default App;
```
<Tabs>
<TabItem value="asim" label="Android">
:::note
The Android demo has been tested in Windows 10 and in macOS.
:::
Test the app in the Android simulator:
```bash
npm run android
```
After clicking "Press to Export", the app will show an alert with the location
to the generated file.
In the Android simulator, pulling the file requires additional steps. This
command will pull a Base64-encoded string from the simulator:
```bash
adb exec-out run-as com.sheetjspres base64 files/Presidents.xlsx > pres.b64
```
Decoding the file requires an OS-specific command:
<Tabs>
<TabItem value="windows" label="Windows">
```powershell
certutil -decode .\pres.b64 .\Presidents.xlsx
```
</TabItem>
<TabItem value="macos" label="macOS">
```bash
base64 -D pres.b64 > Presidents.xlsx
```
</TabItem>
</Tabs>
This command generates `Presidents.xlsx` which can be opened.
:::note Device Testing
For testing on a real device, Android 10+ requires an additional step to access
the generated file. Add highlighted lines to `App.js`:
```jsx title="App.js"
/* write buffer to file */
const filename = RNFetchBlob.fs.dirs.DocumentDir + "/Presidents.xlsx";
await RNFetchBlob.fs.writeFile(filename, Array.from(buf), 'ascii');
// highlight-start
await RNFetchBlob.MediaCollection.copyToMediaStore({
parentFolder: "",
mimeType: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
name: "Presidents.xlsx"
}, "Download", filename);
// highlight-end
return filename;
```
`Presidents.xlsx` will be copied to the `Downloads` folder.
:::
</TabItem>
<TabItem value="ios" label="iOS">
:::caution
This demo runs in iOS and requires a Macintosh computer with Xcode installed.
:::
The native component must be linked:
```bash
cd ios; pod install; cd ..
```
Test the app in the iOS simulator:
```bash
@ -632,5 +703,8 @@ npm run ios
After clicking "Press to Export", the app will show an alert with the location
to the generated file.
</TabItem>
</Tabs>
</TabItem>
</Tabs>