показать задержку скрыть показать … на объекте в aframe для AR

#javascript #aframe #8thwall-xr

#javascript #aframe #8thwall-xr

Вопрос:

Я немного разработчик, но я хотел бы создать поток в AR-приложении, который позволяет мне показывать / задерживать / скрывать / показывать тип поведения.

Я использую aframe в качестве платформы, поэтому сейчас пытаюсь ее спроектировать.

Опыт будет состоять из 5 сцен с отображением нескольких ресурсов, которые затем скрываются после воспроизведения некоторых анимаций.

Я попытался изменить видимое значение = true / false на уровне сцены, но 8-я стена не загружается, как только я добавил дополнительную сцену.

Это лучший способ создать функцию для управления отображением на уровне объекта? любая помощь была бы очень признательна.

вот что у меня есть до сих пор

 <a-entity
    id="model"
    gltf-model="#animatedModel"
    class="cantap"
    scale="55 55 55"
    animation-mixer="clip: FLOAT"
    xrextras-hold-drag 
    xrextras-two-finger-rotate
    xrextras-pinch-scale
    shadow
    visible="true">
  </a-entity>
  

и на данный момент это контролируется кнопкой, но я бы хотел, чтобы это произошло автоматически по истечении x секунд

 const nextButtonComponent = () => ({
  init() {
    const visibilityList = ['text', 'sun']
   const model = document.getElementById('model')
   const sunmodel = document.getElementById('sunmodel')
    const nextButton = document.getElementById('nextbutton')

    nextButton.style.display = 'block'

   
    const nextAnimation = () => {
      model.setAttribute('visible', false)
      sunmodel.setAttribute('visible', true)
    
    }
    nextButton.onclick = nextAnimation // Switch to the next animation when the button is pressed.
  },
})

export {nextButtonComponent}
  

Ответ №1:

Вы могли бы сделать это несколькими различными способами.

Да, у вас могут быть обе модели в вашей сцене, и при желании скрыть одну, показать другую. В вашем примере нажатие кнопки выполняет обмен, но если вам нужна временная задержка, посмотрите на использование setTimeout()

В качестве альтернативы вы можете поменять одну модель на другую. Посмотрите на этот пример: https://www.8thwall.com/playground/model-swap

Он также использует нажатие кнопки для изменения модели (путем удаления gltf-model атрибута вашего объекта, а затем установки нового). Здесь вы также можете изменить код таким образом, чтобы вместо запуска нажатием кнопки ваша функция «изменить» могла вызываться через X секунд с помощью setTimeout()

https://www.w3schools.com/jsref/met_win_settimeout.asp