Skip to main content
Inspiring
January 29, 2017
Question

Create highlither with AS3

  • January 29, 2017
  • 5 replies
  • 560 views

Dear Friends,

I want to create a highlighter with AS3. iam working with an elearning project LMS. when my application playing, I want to add a tool to highlight the screen wherever user wants and save it for future use. Please help me or suggest me to create highlighter (same like highlighter in snipping tool in our OS). Whenever user wants to delete the highlighter, he has to delete. pls help me.

pls check my ref screen : http://comptools.files.wordpress.com/2010/02/edit_screen.jpg.

Thanks and regards,

Syed Abdul Rahim

This topic has been closed for replies.

5 replies

rahimhajiAuthor
Inspiring
January 31, 2017

K, Thks Mr.Colin and Mr.Kglad. I will follow.. thks

rahimhajiAuthor
Inspiring
January 31, 2017

Dear Mr.Colin,

Greetings! thks for the reply. S, if I use alpha as 1, it is hiding the text behind the drawing we have created. That's why I used less alpha. In snipping tool we can create any shape like circle, square or lines...

Thanks and Regards,

Syed Abdul Rahim

Colin Holgate
Inspiring
January 31, 2017

You could put the drawing layer behind the text.

rahimhajiAuthor
Inspiring
January 31, 2017

Thks Mr.kglad,

Already I have used drawing api and created that highlighter, but it is giving some continuous circle shapes, it looks odd... it is not like our snipping tool. Please check my attached image. I have used the below code, pls check and help me:

//------------- DRAWING CODE STARTS----------------------------------------------
var isDrawingReady:Boolean;
var startX:Number,startY:Number;
stage.addEventListener(MouseEvent.MOUSE_DOWN, onDrawReady);
stage.addEventListener(MouseEvent.MOUSE_UP, onDrawStop);
stage.addEventListener(MouseEvent.MOUSE_MOVE, onDraw);
function onDrawReady(e:MouseEvent):void
{
startX = e.stageX;
startY = e.stageY;
isDrawingReady = true;
}

function onDraw(e:MouseEvent):void
{
if (isDrawingReady)
{
  this.graphics.lineStyle(30,0xff0000,.05);
  this.graphics.moveTo(startX,startY);
  this.graphics.lineTo(e.stageX,e.stageY);
  startX = e.stageX;
  startY = e.stageY;
}

e.updateAfterEvent();
}

function onDrawStop(e:MouseEvent):void
{
isDrawingReady = false;
}

function clear_screen(event:MouseEvent) {
this.graphics.clear();
}
//------------- DRAWING CODE END----------------------------------------------

Colin Holgate
Inspiring
January 31, 2017

You are using an alpha value of 0.05, so each mouse movement will just draw another almost seethrough red circle. If you mouse around slowly the circles will add up, and look less seethrough.

Is there a reason not to use an alpha of 1? The Windows snipping tool seems to use opaque lines.

kglad
Community Expert
Community Expert
January 29, 2017

your link is working for me.

you can use the drawing api to create a 'highlighter' tool that allows users to highlight items on display.  and you can create an eraser tool that allows users to undo their hightlight(s).

you can use the bitmapdata class to save the display (with and/or without highlights).

rahimhajiAuthor
Inspiring
January 29, 2017

hi friends given link is not working pls consider that as highlighter in snipping tool of windows OS.