Dwaw a line to match answers with questions - elearning activity for my classroom
I need some AS3 code for drawing lines between Movieclips to match questions with answers. I have 7 questiions and 7 answers. I also need some feedback like "Correct" and "Try again". also it needs to have a counter so I know when its complete.
Thanks so much!
Here is a quick and dirty mockup. Just make this class a document class in a fresh fla:
package {
import flash.display.Sprite;
import flash.text.TextField;
import flash.text.TextFieldAutoSize;
import flash.text.TextFormat;
public class Help extends Sprite
{
private var panelHeight:Number = 30;
private var panelWidth:Number = 100;
private var questionsUI:Vector.<Sprite> = new Vector.<Sprite>();
private var answersUI:Vector.<Sprite> = new Vector.<Sprite>();
private var qColors:Vector.<uint> = new <uint>[0xC40000, 0xFF712D, 0x008000, 0x5353FF, 0x800040, 0xFF0080, 0x0000FF];
private var answerFillColor:uint = 0x00C663;
private var sprite:Sprite;
private var gap:Number = 10;
private var numQuestions:int = 7;
private var i:int = 0;
public function Help()
{
init();
}
private function init():void
{
for (i = 0; i < numQuestions; i++) {
questionsUI.push(drawRect("Question " + i, qColors[i], 0xFFFFFF));
answersUI.push(drawRect("Answer " + i, answerFillColor));
}
placeObjects();
drawConnectors();
}
private function drawConnectors():void
{
for (i = 0; i < numQuestions; i++) {
graphics.lineStyle(2, qColors[i]);
sprite = questionsUI[i];
graphics.moveTo(sprite.x + sprite.width, sprite.y + sprite.height * .5);
sprite = answersUI[i];
graphics.lineTo(sprite.x, sprite.y + sprite.height * .5);
}
}
private function placeObjects():void
{
placeCollection(questionsUI, gap);
placeCollection(answersUI, panelWidth + 200);
}
private function placeCollection(v:Vector.<Sprite>, xPos:Number):void {
var tempVector:Vector.<Sprite> = v.slice();
var r:int;
var nextY:Number = gap;
while (tempVector.length > 0) {
r = Math.random() * tempVector.length;
sprite = tempVector[r];
addChild(sprite)
sprite.x = xPos;
sprite.y = nextY;
nextY += sprite.height + gap;
tempVector.splice(r, 1);
}
}
private function drawRect(text:String, fillColor:uint, color:uint = 0x000000):Sprite {
var t:TextField = new TextField();
t.autoSize = TextFieldAutoSize.LEFT;
t.defaultTextFormat = new TextFormat("Arial", 12, color);
t.text = text;
t.x = 6;
t.y = (panelHeight - t.height) * .5;
sprite = new Sprite();
sprite.graphics.beginFill(fillColor);
sprite.graphics.drawRoundRect(0, 0, panelWidth, panelHeight, 5);
sprite.addChild(t);
return sprite;
}
}
}
North America
Europe, Middle East and Africa
Asia Pacific