如何使用a动画更改a帧中的文本？

Question

For example, I have some text "Hello" floating about in the scene, on mousing over it I want the text to change to "Hi"

Right now, when I try to use an animation, the text just disappears off, instead of changing. Any help? Thanks.

Answer 1

I would use the event-set component (download the dist and drop into your project), not the animation tag:

<a-entity text="text: Hello" event-set="_event: mouseenter; text: Hi"></a-entity>

0.2.0 build: https://github.com/ngokevin/aframe-event-set-component/tree/v0.2.0/dist

0.3.0 build https://github.com/ngokevin/aframe-event-set-component/tree/master/dist

Answer 2

Here is an example using JavaScript to change text on mouseover.

Ignoring the boilerplate used to wait for the scene to load, the code is:

var someText = document.querySelector('#someText');
someText.addEventListener('mouseenter', mouseenter);

function mouseenter () {
  someText.setAttribute('bmfont-text', 'text: Hi');
}

Where "someText" points to an entity with the bmfont-text component (though it would work for geometric text as well). This example uses Mayognaise's mouse cursor component but could easily be changed to a gaze-cursor.

-

Additionally, here is a CodePen demonstrating ngokevin's answer . I was going to post this as a comment to his answer, but I don't have enough reputation points...