Configure Sceneform in your ARCore app -Part2
If you have not yet read the first part of this article, find it here.
Import the Sceneform plugin into your project
Once installed, the Sceneform plugin lets you import, view, and build 3D assets in the Sceneform SDK for AR apps in Android Studio. It requires Android Studio versions 3.1 and above.
To install the plugin:
- In Android Studio open the Plugins settings:
- Windows: File > Settings > Plugins > Browse Repositories
- macOS: Android Studio > Preferences > Plugins
2. Click Browse repositories, and install the Google Sceneform Tools (Beta).
Configure your project’s build.gradle
files
Update your app’s build.gradle
to add the Sceneform UX dependencies,
dependencies {
// Provides ArFragment, and other UX resources.
implementation 'com.google.ar.sceneform.ux:sceneform-ux:1.8.0'
// Alternatively, use ArSceneView without the UX dependency.
implementation 'com.google.ar.sceneform:core:1.8.0'
}
create a scene view
The easiest way to get started using Sceneform and create a scene view is by using an ArFragment
, which automatically handles ARCore session management.
ArFragment
creates:
- An
ArSceneView
, accessible viagetArSceneView()
, that:
- Renders the camera images from the session on to its surface
- Renders a built-in Sceneform UX animation that shows users how they should move their phone to activate the AR experience.
- Highlights detected
Planes
using the defaultPlaneRenderer
- An ARCore
Session
, accessible viagetSession()
To use ArFragment
in your app, add the following code to your activity's layout.
<fragment android:name="com.google.ar.sceneform.ux.ArFragment"
android:id="@+id/ux_fragment"
android:layout_width="match_parent"
android:layout_height="match_parent" />
Create renderable
A Renderable
is a 3D model that can be placed anywhere in the scene and consists of Meshes, Materials, and Textures.
Renderables can be created from:
- Standard Android
ViewRenderable
s are rendered as flat 2D cards in the 3D scene while maintaining the ability to interact with them via touch. - 3D asset files (OBJ, FBX, glTF) can be imported, converted, and previewed using the Android Studio plugin. For more information, see Import and Preview 3D Assets.
- Basic shapes and materials can be programmatically combined to create more complicated objects at runtime.
We are here now just coping the sampledata package from hellosceneform sample sceneform application and paste it in our ARCore app folder. After this folder is imported, updates the app’s build.gradle
to apply the plugin and add a sceneform.asset()
entry.
apply plugin: 'com.google.ar.sceneform.plugin'
sceneform.asset('sampledata/models/andy.obj', // 'Source Asset Path' specified during import.
'default', // 'Material Path' specified during import.
'sampledata/models/andy.sfa', // '.sfa Output Path' specified during import.
'src/main/res/raw/andy') // '.sfb Output Path' specified during import.
Then Build -> Make Project, an andy.sfb file will be created in the raw resource. then:
private ModelRenderable andyRenderable;
@Override
protected void onCreate(Bundle savedInstanceState) {
…
ModelRenderable.builder()
.setSource(this, R.raw.andy)
.build()
.thenAccept(renderable -> andyRenderable = renderable)
.exceptionally(
throwable -> {
Log.e(TAG, "Unable to load Renderable.", throwable);
return null;
});
}
Build the Scene and PlaneTapListener
Initialize the ArFragment
arFragment = (ArFragment) getSupportFragmentManager().findFragmentById(R.id.ux_fragment);
Create the Anchor and the transformable andy and add it to the anchor.
arFragment.setOnTapArPlaneListener(
(HitResult hitResult, Plane plane, MotionEvent motionEvent) -> {
if (andyRenderable == null) {
return;
}
// Create the Anchor.
Anchor anchor = hitResult.createAnchor();
AnchorNode anchorNode = new AnchorNode(anchor);
anchorNode.setParent(arFragment.getArSceneView().getScene());
// Create the transformable andy and add it to the anchor.
TransformableNode andy = new TransformableNode(arFragment.getTransformationSystem());
andy.setParent(anchorNode);
andy.setRenderable(andyRenderable);
andy.select();
});
You can find the sample project here.