Skip to content

Commit 7e2fe78

Browse files
Merge pull request #4 from SceneView/docs
Docs
2 parents aeea2c4 + ab01423 commit 7e2fe78

File tree

7 files changed

+166
-328
lines changed

7 files changed

+166
-328
lines changed

README.md

Lines changed: 11 additions & 255 deletions
Original file line numberDiff line numberDiff line change
@@ -1,312 +1,68 @@
1-
21
### Features
32

4-
5-
63
- Remote and local assets
7-
84
- Augmented Faces
9-
105
- Cloud anchors
11-
126
- Plane detection
13-
147
- Feature quality indicator
15-
168
- Depth API
17-
189
- Location anchors
19-
2010
- Video recording
21-
2211
- Screenshots
2312

24-
25-
2613
# react-native-sceneform
2714

28-
29-
3015
![](https://raw.githubusercontent.com/kboy-silvergym/ARCore-Kotlin-Sampler/master/readmeImages/sceneform.jpg)
3116

3217
| Location markers | Augmented Faces | Object placing | Cloud anchors |
3318
|--|--|--|--|
3419
|![](https://raw.githubusercontent.com/SceneView/react-native-sceneform/master/docs/location.gif)|![](https://raw.githubusercontent.com/SceneView/react-native-sceneform/master/docs/face.gif)|![](https://raw.githubusercontent.com/SceneView/react-native-sceneform/master/docs/placing.gif)|![](https://raw.githubusercontent.com/SceneView/react-native-sceneform/master/docs/resolving.gif)|
3520

36-
3721
# Requirements
3822

3923
This package requires your app to target Android SDK 24 at least and react-native 0.66+
4024

41-
42-
4325
Also, this package does not handle permissions, be sure to request:
4426

4527
- CAMERA: for AR view.
46-
4728
- WRITE_EXTERNAL_STORAGE: for screenshots.
48-
4929
- RECORD_AUDIO: for recording video.
50-
5130
- ACCESS_FINE_LOCATION/ACCESS_COARSE_LOCATION: for location-based AR.
5231

53-
54-
5532
# Installation
5633

57-
58-
59-
Install from npm running `npm install --save @sceneview/react-native-sceneform`
60-
61-
Then, add the following to your AndroidManifest.xml inside the Application node.
62-
34+
- Install from npm running `npm install --save @sceneview/react-native-sceneform`
35+
- Add the following to your AndroidManifest.xml inside the Application node.
6336
```xml
64-
6537
<meta-data android:name="com.google.ar.core" android:value="required" />
66-
6738
```
68-
69-
39+
- In your app/build.gradle, set your minSdkVersion to 24.
7040

7141
If you are going to use Cloud Anchors, be sure to add your API Key to the AndroidManifest or to sign your application in the Google Cloud Platform console (keyless auth)
7242

73-
74-
7543
# Loading the library
7644

7745
`import { SceneformView, AugmentedFacesView } from 'react-native-sceneform';`
7846

79-
80-
81-
# SceneformView
82-
83-
### Props, Methods and Events
84-
85-
The `SceneformView` component supports the following props:
86-
87-
88-
89-
| name | values | default | required |
90-
| :------------ | :------------ | :------------ | :------------ |
91-
| viewMode | `true` for hosting, `false` for resolving | `false` | no |
92-
| discoverMode | `true` for cloud anchors, `false` for location anchors | `true` | no |
93-
| locationMarkers | `LocationMarker`[] | [] | no |
94-
| displayPlanes | boolean | `true` | no |
95-
96-
97-
98-
Also, supports the following methods:
99-
100-
101-
102-
| name | params | return |
103-
| :------------ | :------------ | :------------ |
104-
| addObject | `Model` | void |
105-
| hostCloudAnchor | `Plane` | void |
106-
| resolveCloudAnchor | `CloudAnchorId` | void |
107-
| takeScreenshot | | `Screenshot` promise |
108-
| startVideoRecording | | boolean promise |
109-
| stopVideoRecording | | `VideoRecording` promise |
110-
111-
112-
113-
The following events are supported:
114-
115-
116-
117-
| name | description | returns |
118-
| :------------ | :------------ | :------------ |
119-
| onSessionCreate | Triggered when a sceneform session has been initialised | |
120-
| onTapPlane | Triggered when the user taps a plane | `Plane` |
121-
| onAnchorResolve | Triggered when a cloud anchor has been resolved | `CloudAnchor` |
122-
| onAnchorHost | Triggered when a cloud anchor has been hosted correctly | `CloudAnchor` |
123-
| onFeatureMapQualityChange | Triggered when the feature map quality changes (HOSTING ONLY) | `FeatureMapQuality` |
124-
125-
126-
127-
## AugmentedFacesView
128-
129-
### Props, Methods and Events
130-
131-
132-
133-
The AugmentedFacesView supports the following props:
134-
135-
| name | values |
136-
| :------------ | :------------ |
137-
| setAugmentedFace | `index` returned by the `addAugmentedFace` method. Use -1 as starting value. |
138-
139-
140-
141-
It also supports the following methods:
142-
143-
| name | params | return |
144-
| :------------ | :------------ | :------------ |
145-
| addAugmentedFace | `AugmentedFaceModel` | `Promise` returning an `index` to be used by the `setAugmentedFace` prop |
146-
147-
148-
149-
# Type definitions
150-
151-
152-
153-
### AugmentedFaceModel
154-
155-
An `AugmentedFaceModel` is a structure meant to be used by the `addAugmentedFace` method. It has two properties:
156-
157-
- model: `URL`/`path` (inside android's assets folder) referencing a GLB object.
158-
159-
- texture: (nullable) `URL`/`path` (inside android's assets folder) referencing an image object.
160-
161-
Example:
162-
163-
`{model: 'models/fox.glb', texture: 'textures/freckles.png'}`
164-
165-
166-
167-
### Plane
168-
169-
A plane is any touchable surface discovered in the AR session.
170-
171-
When the user taps on a plane it is automatically saved and an index is sent back to the bridge via the `onTapPlane` event.
172-
173-
174-
175-
You can access the value using `event.planeId`.
47+
# Components and Definitions
17648

177-
It can be used to host a cloud anchor or to place objects on tap.
49+
### » [SceneformView](./docs/SCENEFORMVIEW.md)
50+
### » [AugmentedFacesView](./docs/AUGMENTED_FACES.md)
51+
### » [Type Definitions](./docs/TYPES.md)
17852

179-
53+
# Examples
18054

181-
### CloudAnchor
182-
183-
It is a simple structure containing the CloudAnchorId in the `event.anchorId` value.
184-
185-
186-
187-
### FeatureMapQuality
188-
189-
The FeatureMapQuality is an indicator used to get sure there is enough quality in the environment scan previous to host an anchor.
190-
191-
192-
193-
It is a value from 0 to 2 indicating the quality:
194-
195-
- 0: Insufficient
196-
197-
- 1: Sufficient
198-
199-
- 2: Good
200-
201-
202-
203-
You can access the value via `event.quality`
204-
205-
Host the anchor when the event returns at least 1.
206-
207-
208-
209-
### VideoRecording
210-
211-
After `stopVideoRecording` is called (`startVideoRecording` must be called first), the video is copied into storage and its path is returned when the promise fulfills.
212-
213-
214-
215-
You can get the path via `response.path`
216-
217-
218-
219-
### Screenshot
220-
221-
When `takeScreenshot` is called, the session's current view is copied into a bitmap and saved as a JPEG image. When the promise fulfills you can access the image via `response.path`
222-
223-
224-
225-
### Model
226-
227-
The `addObject` method is used to insert a renderable into scene, it supports a `Model` object described as follows:
228-
229-
230-
231-
##### model
232-
233-
It must be an URL pointing to a glb asset.
234-
235-
236-
237-
##### anchorId
238-
239-
It can be a CloudAnchorId or a PlaneId (returned by onTapPlane)
240-
241-
242-
243-
##### isCloudAnchor
244-
245-
`boolean`, if true then the `anchorId` value will be taken as a CloudAnchorId and the session will attempt to resolve it, triggering `onAnchorResolve` if succeed.
246-
247-
248-
249-
Otherwise, if `false` , `anchorId` will be taken as `Plane` and the object will be attached to it.
250-
251-
252-
253-
### LocationMarker
254-
255-
A location marker is placed calculating its real world position related to the user location.
256-
257-
258-
259-
There are two types of tags currently supported, showing a label or a simple one with an icon.
260-
261-
262-
263-
The location marker structure is:
264-
265-
266-
267-
##### title
268-
269-
`String` , it is the label to be shown by the marker.
270-
271-
272-
273-
##### lat
274-
275-
`Double`, the latitude value.
276-
277-
278-
279-
##### lng
280-
281-
`Double`, the longitude value.
282-
283-
284-
285-
##### isAnchor
286-
287-
`boolean`, if `false` the title is shown in the marker, if `true` then the icon marker is used,
288-
289-
290-
291-
### CloudAnchorId
292-
293-
A `String` value returned by the `onAnchorHost` event, you can use it to resolve the same anchor lately or share it with friends to get the same experience.
294-
295-
296-
55+
#### » [Augmented Faces](https://github.com/doranteseduardo/augmented-faces-demo)
29756

29857
# To do
29958

59+
- Augmented images
30060
- No-AR view (3D model viewer)
301-
30261
- Runtime renderable creation
303-
30462
- Custom lights
305-
30663
- Animation manipulation (currently animations are played automatically)
307-
30864
- Depth toggling
30965

31066
# Credits
31167

312-
![ARCore-Location](https://github.com/appoly/ARCore-Location)
68+
[ARCore-Location](https://github.com/appoly/ARCore-Location)

android/src/main/java/com/reactnativesceneform/scene/ARScene.java

Lines changed: 0 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -400,45 +400,6 @@ private void onUpdateListener(FrameTime frameTime) {
400400
}
401401
}
402402

403-
public void killProcess() {
404-
try {
405-
Log.e("REMOVE_KILL", "RUN START");
406-
((AppCompatActivity) Objects.requireNonNull(context.getCurrentActivity())).getSupportFragmentManager().beginTransaction().remove(arFragment).commitAllowingStateLoss();
407-
Thread threadPause = new Thread() {
408-
@Override
409-
public void run() {
410-
try {
411-
sleep(100);
412-
Objects.requireNonNull(arFragment.getArSceneView().getSession()).pause();
413-
} catch (Exception e) {
414-
e.printStackTrace();
415-
}
416-
}
417-
};
418-
Thread thread = new Thread() {
419-
@RequiresApi(api = Build.VERSION_CODES.LOLLIPOP)
420-
@Override
421-
public void run() {
422-
try {
423-
threadPause.start();
424-
sleep(100);
425-
Objects.requireNonNull(arFragment.getArSceneView().getSession()).close();
426-
((AppCompatActivity) context.getCurrentActivity()).finish();
427-
} catch (Throwable e) {
428-
e.printStackTrace();
429-
} finally {
430-
System.gc();
431-
Log.e("REMOVE_KILL", "END START");
432-
}
433-
}
434-
};
435-
thread.start();
436-
} catch (Exception e) {
437-
System.out.println(e.toString());
438-
}
439-
440-
}
441-
442403
@Override
443404
protected void onDetachedFromWindow() {
444405
super.onDetachedFromWindow();

docs/AUGMENTED_FACES.md

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
## AugmentedFacesView
2+
3+
### Props, Methods and Events
4+
5+
The AugmentedFacesView supports the following props:
6+
7+
| name | values |
8+
| :------------ | :------------ |
9+
| setAugmentedFace | `index` returned by the `addAugmentedFace` method. Use -1 as starting value. |
10+
11+
12+
It also supports the following methods:
13+
14+
| name | params | return |
15+
| :------------ | :------------ | :------------ |
16+
| addAugmentedFace | `AugmentedFaceModel` | `Promise` returning an `index` to be used by the `setAugmentedFace` prop |
17+
18+
[Example](https://github.com/doranteseduardo/augmented-faces-demo)

0 commit comments

Comments
 (0)