添加嵌套影片剪辑并设置动态文本 AS3

Question

我有一张美国地图，上面有许多城市（大约 12 个）的图标。当用户将鼠标悬停在这些图标之一上时，图标上方会弹出带有两个动态文本字段的动画剪辑。

每个城市的图标动画剪辑均以其所在州命名：state_（缩写） 即：state_TX

弹出的文本气球命名为：cityTag_mc 其中有两个动态文本字段：title_txt & subTitle_txt

逻辑是当用户将鼠标悬停在 state_TX 上并输入该州的标题和副标题时添加 cityTag_mc。

我的主要难题是如何将文本输入字段（并为气球设置动画）。我不太知道从哪里开始。我想在动作脚本中设置每个状态的文本。我从哪里开始？最佳实践是什么？

Answer 1

创建所有城市图标并将它们放在舞台上并给它们指定实例名称后，然后将它们放入数组中。这只是为了让事情更容易管理。

cityIcons.push(state_tx), cityIcons.push(state_ca) 等

现在我们需要添加代码来显示气球。你也提到了动画化。将在 cityTag_mc 中​​生长的气球动画放置在文本字段下方。为其指定一个实例名称，例如气球_mc。

现在我们需要添加监听器。我们将循环遍历数组，因此只需编写一次。

//instead of manually adding to listeners to every city icon movielip we can now
//just loop over all the items in the array
for (var i:int = 0; i < cityIcons.length;i++)
{
     var mcCity:MovieClip = cityIcons[i] as MovieClip;
     myCity.addEventListener(MouseEvent.MOUSE_OVER, onMouseOver)
     myCity.addEventListener(MouseEvent.MOUSE_OUT, onMouseOut)

}

function onMouseOut(e:MouseEvent):void
{
  cityTag_mc.visible = false;
  //TODO any animating of balloon, maybe you could have
  //different labels so instead of changing visible change alpha when your tweening

}

function onMouseOver(e:MouseEvent):void
{

   //move balloon to where the city icon is
   //e.target refers to the object you have added the listener to
   cityTag_mc.x = e.target.x; // move the balloons position to the city's position
   cityTag_mc.x = e.target.y; 
   //you may want to add an offset so its not directly overthe top

   cityTag_mc.visible = true;

   switch(e.target)
   {
      //testing which city instance icon we rolled over
      case:state_tx
        cityTag_mc.title_txt.text ="Texas";
        cityTag_mc.balloon_mc.play(); //don't worry about this for now
        //do remaining stuff
        break;
      case:state_ca
        //same as above

   }

}

您可以将一个名为 cityTag_mc 的气球实例放置在舞台上并将“visible”设置为 false，也可以根据需要创建和删除。这只是一个指南，不要认为它是 100%，因为这只是我的想法。