Replacing the texture of a 3D model with CraftAR Augmented Reality SDK

This article applies only to the Augmented Reality SDK.
There are certain applications, such as interactive catalogs where the user is interested in configuring or browsing through different samples of a product. Such interaction can be implemented by changing the visual aspect of a 3D model.

The Augmented Reality SDK lets you render 3D models into the AR scene. This article explains how to replace the texture of a 3D model at run-time with a few lines of code on iOS and on Android.
In the example of this article, we added a button in our layout. When the user taps the button, the model is replaced with a copy of the same model but with different pre-loaded textures. In order to do this, we need to add all resources to our project and initialize the two models we want to display, one with the normal texture and the other with the texture colors inverted. This step has to be done after the video capture has started.
Below are two screenshots of a 3D model where the user can tap a button to change its visual appearance (texture).

Replace texture on Android

Start by adding all the resources:

String appDataDir = getAppDataDirectory();

boyNormal = new CraftARTrackingContent3dmodel(appDataDir + "/astroboy_walk.dae");

String texturePath = appDataDir + "/boy_10_inv.tga";

HashMap textures = new HashMap();

textures.put("./boy_10.tga", texturePath);

boyInverted = new CraftARTrackingContent3dmodel(appDataDir + "/astroboy_walk.dae", textures);

modelContent = boyNormal;

Once we have created our ARItem, we add the first model we want to display (in this case the model with the normal texture):

1	myARItem.addContent(modelContent);

Finally, when the user clicks on the button, we remove the model that is being displayed and set the other model with inverted colors as the current one:

Button invertButton = (Button)mainLayout.findViewById(R.id.invertButton);

invertButton.setOnClickListener(new OnClickListener() {

@Override

public void onClick(View v) {

mCurrentARItem.removeContent(modelContent);

modelContent = (modelContent == boyNormal) ? boyInverted : boyNormal;

mCurrentARItem.addContent(modelContent);

}

});

Replace texture on iOS

Start by adding all the resources:

- (void) didStartCapture {

{...}

boyNormal = [[CraftARTrackingContent3dModel alloc] initWithModelNamed:@"astroBoy_walk" ofType:@"dae"];

boyInvert = [[CraftARTrackingContent3dModel alloc] initWithModelNamed:@"astroBoy_walk" ofType:@"dae" andTextures: @{@"./boy_10.tga": @"./boy_10_inv.tga"}];

//...

}

Once we have created our ARItem, we add the first model we want to display (in this case the model with the normal texture):

1 2	currentModel = boyNormal; [(CraftARItemAR*)item addContent:currentModel];

Finally, when the user clicks on the button, we remove the model that is being displayed and set the model with the inverted colors texture as the current one: