• home
  • forum
  • my
  • kt
  • download
  • How to create a simple drag and drop paint interface in flash

    Author: 2008-09-27 08:52:07 From:

    How to create simple drag and drop painting interface:

    1.Create the art movie clip:

    • In the main menu go to Insert > New Symbol.
    • Then in the "Create New Symbol" window:
      • Set the symbol type to " Movie Clip".
      • Set the name to "art".
      • Press the "OK" button.
    • Drag the graphic "artw" on stage.
    • Then right click on frame 2 and select "Insert Blank Keyframe".
    • Repeat this for frames "3" and "4".
    • Then select frame 2 and drag graphic "artr" from the library and center on stage.
    • Select frame 3 and drag graphic "artg" from the library and center on stage.
    • Select frame 4 and drag graphic "artb" from the library and center on stage.
    • Select frame 1 then open the "actions" panel and enter the following script:

    stop();

    • Click on "Scene 1" to return to the main timeline.
    • Select the first frame of the "Painting" layer and drag the mc "art" from the library.
      • In the properties panel set the instance name to "art_mc".

    2. Add the paint bucket tools:

    • Select the first frame of the "buckets" layer.
      • Drag the mc "symbol 5" from the library on stage.
      • Name the instance "rbucket_mc"
      • Drag the mc "symbol 5" from the library on stage.
      • Name the instance "rbucket_mc"
      • Drag the mc "symbol 4" from the library on stage.
      • Name the instance "gbucket_mc"
      • Drag the mc "symbol 3" from the library on stage.
      • Name the instance "bbucket_mc"
    • Select the first frame of the "actions" layer then open the "actions" panel and enter the following script:

    rbucket_mc.onPress = function(){
    this.startDrag();
    }
    rbucket_mc.onRelease = function(){
    this.stopDrag();
    if(this._droptarget == "/art_mc"){
    art_mc.gotoAndStop(2);
    }
    }
    rbucket_mc.onReleaseOutside = function(){
    this.stopDrag();
    }

    gbucket_mc.onPress = function(){
    this.startDrag();
    }
    gbucket_mc.onRelease = function(){
    this.stopDrag();
    if(this._droptarget == "/art_mc"){
    art_mc.gotoAndStop(3);
    }
    }
    gbucket_mc.onReleaseOutside = function(){
    this.stopDrag();
    }

    bbucket_mc.onPress = function(){
    this.startDrag();
    }
    bbucket_mc.onRelease = function(){
    this.stopDrag();
    if(this._droptarget == "/art_mc"){
    art_mc.gotoAndStop(4);
    }
    }
    bbucket_mc.onReleaseOutside = function(){
    this.stopDrag();
    }

    • Then in the main menu go to Control > Test Movie.

    discuss this topic to forum

    relation tutorial

    No relevant information

    Category

      3D (20)
      Math Physics (14)
      3rd Party (5)
      Navigation (60)
      Actionscripting (26)
      Optimization (16)
      Animation (32)
      Projector (9)
      Audio (46)
      Special Effects (112)
      Backend (25)
      Text Effects (65)
      Drawing (18)
      Tips and Techniques (41)
      Dynamic Content (25)
      Tricks (6)
      Games (66)
      Utilities (19)
      Getting Started (71)
      Video (10)
      Interactivity (36)
      Web Design (29)

    New

    Hot