Tracking Forums, Newsgroups, Maling Lists
Home Scripts Tutorials Tracker Forums
  Advanced Search
  HOME    TRACKER    Flash




Sketchpad That Is Savable



i have been asked, by an educational company, to create a sketchpad that sudents can draw on. Some questions, on an online test, require the students to draw geometric shapes that can be graded later.

i have created the sketchpad with no problems. We have figured out how to use a naming convention by passing a parameter to flash that will allow each user a unique xml file.

I am not certain how to pull off (if it is possible) what we are trying to do. Is there a way to allow the user to save the "sketch" they have drawn in a Flash Sketchpad application? I was hoping to be able to add a "save" feature that would read and write to an XML file. I am famailiar with reading and writing external xml files, but i have only used text and pics for the most part. However, I have never attempted saving graphics that are drawn with a flash sketchpad.

any suggestion would be EXTREMELY appreciated!

thanks a million,

shae waters



ActionScript.org Forums > ActionScript Forums Group > ActionScript 2.0
Posted on: 09-29-2006, 04:15 PM


View Complete Forum Thread with Replies

See Related Forum Messages: Follow the Links Below to View Complete Thread

Savable Whiteboard?
I'm looking for a flash program/tutorial to build a simple whiteboard (MS pain anyone?) but I need to be able to save what is created on the server... as an image or as some sort of other data i dont care. so long as i can re-load the data later.

If anyone knows where I can buy something like this that would be awsome

Savable Flash Game
how do you make a game so that a player can save and load data?

Savable Online Drawing Pad
hi there,

im looking for some info, fla file or tutorial on how to create my own drawing pad which my users can save and view previous drawings. like in...

http://www.flashyourspace.com/

is ther anyone that can help me or point me in the right direction

Thankyou very much

Tim

Sketchpad Guestbook
Hey all

Does anyone know if it is possible to create a sketchbook style guestbook using AS 1 ? I know how to do it using AS 2, but i have to use AS 1 for one of the main parts of my site, if anyone knows of a tutorial or anything that could help I would be very gratefull

Thanks

Ryan

Background To Sketchpad
Hey all,
So I'm working with this tutorial Sketchpad tutorial and everything worked out great. But now I'd like to put a background on, so you can draw on a picture. I can't seem to figure it out. The actionscript is on step 27 of the tutorial, so any help would be appreciated. Thanks

Help With Drawing API Sketchpad
Hallo all!

Long time 'browse'r first time poster here... Having gone thro so many exciting uses of flash, I am itching to try it out for myself. What better way than to try my hand at a sketchpad (ok many other better ways but still)

So I made an elementary sketchpad, and it works fine, different colors and everything, however, after a while, when I have drawn or written something on it (planned to use it as a cool guestbook), the lines start to get very jagged, circles become triangles, and everything just laaaags. I tried setting interval to 1, and most everything, with framerates and what not... just can't seem to make the jagged lines go away after a while.

I am at my wits end here Would really appreciate any help in this regard.. just need to keep the drawing smooth..

My basic code


ActionScript Code:
Xex = Math.round(_xmouse);
    Yey = Math.round(_ymouse);
    line.lineTo(Xex, Yey);
    updateAfterEvent();

Thanks! =)

Help Creating A Sketchpad
Hi there. trying to develop a sketchpad/drawing application in flash 8.

so far i have managed to produce buttons that control the line thickness and color and created a button that loads up an image which you can draw over. this was found at

www.lukamaras.com/tutorials/cool-design/flash-drawing-pad.html

i was wondering if anyone could help me further advance this by possible guidance to tutorials or resources that i could look at. I would like to create various filters and possibly a color palette like the one in flash.

basically any help would be appreciated.

thanks in advance

Sketchpad Background
Ok im very new to this. I used a tutorial to create a sketchpad from http://www.lukamaras.com/tutorials/cool-design/flash-drawing-pad.html

I would like to draw on a background image but dunno how to add this. i read somewhere about using empty movie clip but got stuck. anyone can help me!!!

SketchPad Drawing Then Sent By Email ?
Hi im looking to use this (look at link below) a sketch pad on my site then give the visitors the ability to draw something then send it to me by email or post it some how!?

http://www.flashkit.com/movies/Scrip...7252/index.php

Any suggestions on how to do this please let me know.

Many thanks

Sketchpad/Whiteboard Background
I'm having a bit of trouble with a Sketchpad I'm trying to create for a university project. I'm trying to create an online graffiti board and I have the drawing working fine with this code:


Code:
lineThickness = 3;
selectedColour = "0x000000";
_root.onMouseDown = startDrawing;
_root.onMouseUp = stopDrawing;

function startDrawing() {
_root.lineStyle(lineThickness, selectedColour);
_root.moveTo(_root._xmouse, _root._ymouse);
_root.onMouseMove = drawLine;
}

function drawLine() {
_root.lineTo(this._xmouse, this._ymouse);
}

function stopDrawing() {
delete this.onMouseMove;
}

colourRed.onPress = function() {
selectedColour = "0xFF0000";
};
colourGreen.onPress = function() {
selectedColour = "0x00FF00";
};
colourBlue.onPress = function() {
selectedColour = "0x0000FF";
};
colourYellow.onPress = function() {
selectedColour = "0xFFFF00";
};
colourBlack.onPress = function() {
selectedColour = "0x000000";
};
colourWhite.onPress = function() {
selectedColour = "0xFFFFFF";
};
but when i try and add an image for the background, i can't draw on the image. it only lets me draw on the white. anyone have any idea why?



the coding is on the top layer 'Background' and the image is on the layer below 'Test'.
Thanks!

Help Having Problems With Scripting Of Sketchpad
Basically what i want to achieve is a sketch pad (within an image) with colour swatches (where ppl can draw on it, and change colour). I tried out this tutorial which works nicely, however, the funny part is, i can only draw STARTING from the left area. If i were to start drawing from the right, nothing appears. But if i start drawing from the left ONLY then i can continue drawing to the right. It's weird and i dun understand why is this is so. Can anyone help me out pls? Wud really appreciate it. If possible, fast answer as i am stuck with my project. Hope to hear from someone soon.

By the way, this is the script that i used,

lineThickness = 0;
selectedColour = "0x000000";
drawOn.onMouseDown = startDrawing;
drawOn.onMouseUp = stopDrawing;
function startDrawing() {
if (_xmouse<455) {
drawOn.lineStyle(lineThickness, selectedColour);
drawOn.moveTo(drawOn._xmouse,drawOn._ymouse);
drawOn.onMouseMove = drawLine;
}
}
function drawLine() {
drawOn.lineTo(this._xmouse, this._ymouse);
}
function stopDrawing() {
delete this.onMouseMove;
}
line0.onPress = function() {
lineThickness = 0;
};
line3.onPress = function() {
lineThickness = 3;
};
line6.onPress = function() {
lineThickness = 6;
};
colourRed.onPress = function() {
selectedColour = "0xFF0000";
};
colourGreen.onPress = function() {
selectedColour = "0x00FF00";
};

Creating A Sketchpad - Problems
Hi all

I'm trying to write a Flash sketchpad where you can save what is draw online as a JPG to the server.

At present I'm trying to write the sketchpad code and am stuck.

I have created a button that prints the screen no problem, but when I try and print screen anything I have drawn on the sketchpad, it doesn't do it. Anyone have any idea what is going wrong? here is my code:

CODE FOR DRAWING:


Code:
lineThickness = 8;
selectedColour = "0x000000";

_root.createEmptyMovieClip("mcDrawing", 1);
mcDrawing.onMouseDown = startDrawing;
mcDrawing.onMouseUp = stopDrawing;

function startDrawing() {
mcDrawing.lineStyle(lineThickness, selectedColour);
mcDrawing.moveTo(mcDrawing._xmouse, mcDrawing._ymouse);
mcDrawing.onMouseMove = drawLine;
}

function drawLine() {
mcDrawing.lineTo(this._xmouse, this._ymouse);
}

function stopDrawing() {
delete this.onMouseMove;
}
CODE FOR CREATING IMAGE OF STAGE:


Code:
import flash.display.BitmapData;

snapshot = new BitmapData(500, 400);
snapshot.draw(_root);
CODE ON BUTTON FOR CREATING IMAGE:


Code:
on(release) {
_root.createEmptyMovieClip("capture", 2);
capture._x = 425;
capture._y = 20;
capture._xscale = 20;
capture._yscale = 20;
capture.attachBitmap(snapshot, 2);
}
here is an image of the problem.

see the background colours are drawn but not the black line drawn by me...

Thanks all!

Help Having Problems With Scripting Of Sketchpad
Basically what i want to achieve is a sketch pad (within an image) with colour swatches (where ppl can draw on it, and change colour). I tried out this tutorial which works nicely, however, the funny part is, i can only draw STARTING from the left area. If i were to start drawing from the right, nothing appears. But if i start drawing from the left ONLY then i can continue drawing to the right. It's weird and i dun understand why is this is so. Can anyone help me out pls? Wud really appreciate it. If possible, fast answer as i am stuck with my project. Hope to hear from someone soon.

By the way, this is the script that i used,

lineThickness = 0;
selectedColour = "0x000000";
drawOn.onMouseDown = startDrawing;
drawOn.onMouseUp = stopDrawing;
function startDrawing() {
if (_xmouse<455) {
drawOn.lineStyle(lineThickness, selectedColour);
drawOn.moveTo(drawOn._xmouse,drawOn._ymouse);
drawOn.onMouseMove = drawLine;
}
}
function drawLine() {
drawOn.lineTo(this._xmouse, this._ymouse);
}
function stopDrawing() {
delete this.onMouseMove;
}
line0.onPress = function() {
lineThickness = 0;
};
line3.onPress = function() {
lineThickness = 3;
};
line6.onPress = function() {
lineThickness = 6;
};
colourRed.onPress = function() {
selectedColour = "0xFF0000";
};
colourGreen.onPress = function() {
selectedColour = "0x00FF00";
};
colourBlue.onPress = function() {
selectedColour = "0x000099";
};
colourWhite.onPress = function() {
selectedColour = "0xFFFFFF";
};
colourBlack.onPress = function() {
selectedColour = "0x000000";
};
colourViolet.onPress = function() {
selectedColour = "0xCC00FF";
};
colourPurple.onPress = function() {
selectedColour = "0x9900FF";
};
colourYellow.onPress = function() {
selectedColour = "0xFFFF00";
};

I've Problems About Flash Sketchpad...
I'm just start to do flash sketchpad and I've problems about store data in array.

in head script I'm coding.

----------------------------
var pixelData:Array=new Array();
----------------------------

and store data in function

_root.onMouseMove=function(){
pixelData.push({lineThickness:lineThickness,lineCo lor:selectedColor,x11,y1:y1});
}

---------------------------------------------------------------------------------
and when click replay button I need to replay everthing I draw,but data in array is clear away and I don't know why?

---------------------------------------------------------------------------------
and if I've data in array,can I replay it by code below?

createEmptyMovieClip("Line",1);
for(i=0;i<pixelData.length;i++)
{
lineThickness=pixelData[i].lineThickness;
selectedColor=pixelData[i].lineColor;
x1=pixelData[i].x1;
y1=pixelData[i].y1;
Line.getNextHighestDepth();
Line.lineStyle(lineThickness,selectedColor);
Line.moveTo(x1,y1);
Line.lineTo(x1,y1);
}
-------------------------------------[I use AS2]-------------------------------------

please tell me , thanks for you advance.

Sketchpad Needed, Any Recommendations?
I'm basically wanting a sketchpad where someone can draw on it and click submit where it emails me what they drew. Any ideas on this?

http://www.lukamaras.com/tutorials/c...awing-pad.html is exactly what I'm looking for except bigger and with the submission option.

Flash Sketchpad(Replay And Save) - Please Help
I have this basic sketchpad. But I need to put replay drawing and save drawing features. Can someone help me how to add replay and save as picture in my basic flash sketchpad. Something similar with this flashpaint . I have this kind of sketchpad for your reference jontoews . Any help would be appreciate. Thanks.

Interactivity With Sketchpad And Mouse Issue?
I found this tutorial on the internet
"

Saving JPGs From A Sketchpad - Lines Not Colour
Hi all

I posted yesterday about an online graffiti board that i'm doing and it was all going well until a couple of hours ago.

At the moment it allows you to draw on the board, to click a button to show a preview, then to click another button to create a JPG of the drawing using PHP. it is a modified version of the flash-db.com one.

The problem i have is that the JPGs that are created show the background (a brick wall), but the graffiti lines that are drawn on by the user are all in white with no colour (you start off drawing in black but at current can choose red too). Anyone have any idea why this may be? I shall put the code i have so far below:

Code in the 'Interface' layer to draw on the board:


Code:
lineThickness = 8;
selectedColour = "0x000000";

_root.createEmptyMovieClip("mcDrawing", 1);

mcDrawing.onMouseDown = startDrawing;
mcDrawing.onMouseUp = stopDrawing;

function startDrawing() {
mcDrawing.lineStyle(lineThickness, selectedColour);
mcDrawing.moveTo(mcDrawing._xmouse, mcDrawing._ymouse);
mcDrawing.onMouseMove = drawLine;
}

function drawLine() {
mcDrawing.lineTo(this._xmouse, this._ymouse);
}

function stopDrawing() {
delete this.onMouseMove;
}

colourRed.onPress = function() {
selectedColour = "0xFF0000";
};
colourGreen.onPress = function() {
selectedColour = "0x00FF00";
};
colourBlue.onPress = function() {
selectedColour = "0x0000FF";
};
colourYellow.onPress = function() {
selectedColour = "0xFFFF00";
};
colourBlack.onPress = function() {
selectedColour = "0x000000";
};
colourWhite.onPress = function() {
selectedColour = "0xFFFFFF";
};
Code in the 'Actions' for saving the JPGs, etc:


Code:
import flash.display.BitmapData;
import flash.filters.DropShadowFilter
import flash.geom.Matrix;

preloader._visible = false
preview_btn.onPress = mx.utils.Delegate.create(this, previewDraw);
function previewDraw() { capture(1) }

//FUNCTION capture
function capture(nr){
snapshot = new BitmapData(600,350);
snapshot.draw(_root,new Matrix());
var myDraw_mc:MovieClip = createEmptyMovieClip("snapshot_mc",2);
myDraw_mc._x = 500; myDraw_mc._y = 20; myDraw_mc._xscale = myDraw_mc._yscale = 20
myDraw_mc.attachBitmap(snapshot, 2);
var filterArray = new Array(myFilters[nr])
myDraw_mc.filters = filterArray
attachMovie("print_but", "bot", 100, {_x:myDraw_mc._x+myDraw_mc._width+10, _y:myDraw_mc._y+myDraw_mc._height+10})
}

//FUNCTION output
function output(outputDraw){
preloader._visible = true
var pixels:Array = new Array()
var snap = new BitmapData(outputDraw.width, outputDraw.height);

myMatrix = new Matrix();
myMatrix.scale(0.5, 0.5)
snap.draw(outputDraw, myMatrix);
snap.applyFilter(snap, snap.rectangle, snap.rectangle.topLeft, myFilters[nr])

var w:Number = snap.width, tmp
var h:Number = snap.height
var a:Number = 0

this.onEnterFrame = function(){
for(var b=0; b<=h; b++){
tmp = snap.getPixel32(a, b).toString(16)
pixels.push(tmp.substr(1))
}

perc = int((a*100)/w)
preloader.perc.text = perc+" %"
preloader.barra._xscale = perc
a++

if(a>w){
preloader._visible = false
sendData(pixels, h, w)
snap.dispose()
delete this.onEnterFrame
}
}
}

//FUNCTION outputClip
function outputClip(outputDraw){
preloader._visible = true
var pixels:Array = new Array()
var snap = new BitmapData(outputDraw._width, outputDraw._height);
snap.draw(outputDraw);

var w:Number = snap.width, tmp
var h:Number = snap.height
var a:Number = 0

this.onEnterFrame = function(){
for(var b=0; b<=h; b++){
tmp = snap.getPixel32(a, b).toString(16)
pixels.push(tmp.substr(1))
}

perc = int((a*100)/w)
preloader.perc.text = perc+" %"
preloader.barra._xscale = perc
a++

if(a>w){
preloader._visible = false
sendData(pixels, h, w)
snap.dispose()
delete this.onEnterFrame
}
}
}

//FUNCTION sendData
function sendData(pixels:Array, h:Number, w:Number){
var output:LoadVars = new LoadVars()
output.img = pixels.toString()
output.height = h
output.width = w
output.send("show.php", "output", "POST")
}
stop()
Here's an image of what is going wrong, see the first window is what was meant to be saved as a JPG with the window in front showing the red and black lines saved only as white lines...



Thanks!

Creating An Interactive Online Community Sketchpad
Hey all,

Quick question. I'm currently building a site, and I'd like to include a sketchpad similar (but perhaps more basic) to the one like this http://www.lukamaras.com/tutorials/c...awing-pad.html

My goal is to create a community canvas that will allow other users to see what is currently drawn, and add stuff of their own. I'm not sure if it'd be better to include an erase tool for users, or just have the whole canvas wipe clean at the end of each day/week/whatever, but that's getting into the finer details. I'm no whiz with PHP so I'm not sure if I'll completely grasp the process, but I'm also willing to pay someone to just build it for me if I can't figure it out. For now I'm just interested in picking everybodies brains. Thanks

Issue Drawing A Line In A SketchPad Appl
I have written a sketchPad application using ActionScript 3.0 and it looks like everything is working correctly EXCEPT the drawn line never shows up! I'm attaching the code below for your reference. I feel like an idiot here. Been looking at this code for like 12 hours today. So I would appreciate any pointers on where I'm going wrong...
package {

import flash.display.Sprite;
import flash.events.*;
import flash.display.SimpleButton;
import flash.display.Graphics;
import flash.display.Shape;
import flash.filters.DropShadowFilter;

public class MyPad extends Sprite {

var currentColor:Number;
var doDraw:Boolean = false;
var lineSize:Number = 1;

public function MyPad() {

trace("MyPad");
var spBoard:Sprite = new Sprite();
this.addChild(spBoard);
spBoard.x = 75;
spBoard.y = 75;

//add shDrawing as a child of spBoard. When the drawing area is cleared, the board will still be there.
var shDrawing:Shape = new Shape();
spBoard.addChild(shDrawing);


spBoard.graphics.lineStyle(1,0x000000);
spBoard.graphics.beginFill(0xFFFFFF);
spBoard.graphics.drawRect(0,0,250,250);
spBoard.graphics.endFill();
spBoard.filters = [new DropShadowFilter() ];

//add event listener for drawing board

spBoard.addEventListener(MouseEvent.MOUSE_DOWN,boa rdDown);

}



function boardDown(e:MouseEvent):void {
trace("boardDown");
doDraw = true;

currentColor = cpColor.selectedColor;
trace(currentColor);
graphics.lineStyle(lineSize,currentColor);
graphics.moveTo(mouseX,mouseY);

//boardOut is used to control out of bounds lines
this.addEventListener(MouseEvent.ROLL_OUT,boardOut );
this.addEventListener(MouseEvent.MOUSE_MOVE,boardM ove);

//add listeners for each of the line thickness buttons
btnLine0.addEventListener(MouseEvent.MOUSE_DOWN,bt nLine0Down);
btnLine3.addEventListener(MouseEvent.MOUSE_DOWN,bt nLine3Down);
btnLine6.addEventListener(MouseEvent.MOUSE_DOWN,bt nLine6Down);

}

function boardOut(e:MouseEvent):void {
trace("boardOut");
doDraw = false;
trace(doDraw);
//trace(doDraw);
}

//when the mouse is pushed down and then moved, this function is SUPPOSED to draw the line
function boardMove(e:MouseEvent):void {
trace("boardMove");
var curX:Number = mouseX;
var curY:Number = mouseY;
trace(curX);
trace(curY);
trace(doDraw);

if (doDraw && checkCoords(curX,curY)) {
var shDrawing:Shape = new Shape();
addChild(shDrawing);
shDrawing.graphics.lineStyle(lineSize,currentColor );
shDrawing.graphics.moveTo(curX,curY);
shDrawing.graphics.lineTo(mouseX,mouseY);
trace(mouseX);
trace(mouseY);
e.updateAfterEvent();
}

}

function checkCoords(a:Number,b:Number):Boolean {

if (a >= 250 - lineSize / 2 || a <= lineSize / 2 || b >= 250 - lineSize / 2 || b <= lineSize / 2) {
return false;
}
else {
return true;
}

}


function btnLine0Down(e:MouseEvent):void {
lineSize = 1;
trace(lineSize);
}

function btnLine3Down(e:MouseEvent):void {
lineSize = 3;
trace(lineSize);
}

function btnLine6Down(e:MouseEvent):void {
lineSize = 6;
trace(lineSize);
}
}
}

SketchPad HELP - Saving/Redrawing Dynamic Drawings...
Hi guys

I am currently making a sketchpad in flash, the user can draw dynamic squares, line, circles, freehand etc....

I need to be able to save what the user has drawn, or click a "redraw" button and then flash re-creates what the user has just drawn.

Each different line, circle etc is draw in a new movieclip on a higher depth than the previous movieclip.

Does anyone know how to do this, or any good tutorials or .fla files I could use to help me!?

Many thanks

Jonny

Flash Sketchpad On Web Page That Sends Image To Administrator
Hi all, my first ever post so please bare with me.

I'm trying to create a sketchpad that will sit on a web page where users can sketch an image with there mouse and send the image back to the me via e-mail.

Setting up a sketchpad in flash is not a problem, it is just the saving of image and e-mailing back that I am having difficulty with.

Firstly, is this possible and secondly, could you give me some idea of how I would do it?

Many thanks in advance,

K

Full-Featured Open Source Flash Sketchpad?
Hi guys, could anyone recommend a nice full-featured (with saving to server, etc.) open source sketchpad in flash? I'd hate to write one from scratch

Flash Sketchpad On Web Page That Sends Image To Administrator
Hi all, my first ever post so please bare with me.

I'm trying to create a sketchpad that will sit on a web page where users can sketch an image with their mouse and send the image back to me via e-mail.

Setting up a sketchpad in flash is not a problem, it is just the saving of image and e-mailing back that I am having difficulty with.

Firstly, is this possible and secondly, could you give me some idea of how I would do it?

Many thanks in advance,

K

Flash Script - Create A Flash Sketchpad
This is a dedicated thread for discussing the SitePoint article 'Flash Script - Create a Flash Sketchpad'

"Community Sketchpad"
I have recently added an interesting feature on my site called "Community Sketchpad". Users draw whatever they like- and it is added to a txt file as"S1X=34&S1Y=1&SN=false". Coordinates are taken every second and recorded in the format listed above. This gibberish is then sent to a PHP file, which then writes it to a *.txt file...within a few days (from the feature's upload) I began to receive some interesting sketches... I am interested to see what other users think of this concept...

(I should probably put a form for users to attribute work...cause I have absolutely no idea who drew this...)

The sketchpad can be found here:
http://ryan.cyberemail.org/sketch.htm

Copyright © 2005-08 www.BigResource.com, All rights reserved