How to add a button to trigger animation in addition to the current one

🧑‍💻 Technical Support
,
1

Hi guys, here is the link to my published experience. Now I want to add one more animation to the dog which is dog defecate. And I have already added the animation to the model asset. The defecate animation should happen when tapping the button"tap to poop". However, I couldn’t figure out how to add the button triggering the animation.

keiraliu.8thwall.app/lets-dog-out/

2

Do you need to see the code?

3

Please reference our simple button example project here:

1 Like
4

You will need to add some custom code:

AFRAME.registerComponent('button', {
  init() {
    const btn = document.getElementById('myButton')
    const yourModel = document.getElementById('dog')
    btn.addEventListener('click', () => {
      yourModel.setAttribute('animation-mixer', {
            clip: 'yourAnimation',
            loop: 'once',
          })
    })
  }
})

Make sure to write console logs to register your button click and help debug if you have any problems.

1 Like