4.4. A szövegbeíró eszköz

iDevice ikon

// szövegbeíró eszköz
text_btn.onRelease = function() {
    // az canvas_ mc esetlegesen létező fölös gomb eseménykezelőit töröljük,
    // hogy véletlenül se okozhassanak galibát (*31)
    delete canvas_mc.onPress;
    delete canvas_mc.onReleaseOutside;
    canvas_mc.onRelease = function() {
        // a rajzlapon való klikkeléskor rögtön le is tiltjuk a rajzlap gombként való hazsnálhatóságát (*32-1)
        this.enabled = 0;
        txtFrmt = new TextFormat(); //dinamikusan létrehozott szövegmezők formázása (*33)
        //ismét a globális penColor változót használjuk a szöveg színének meghatározására
        txtFrmt.color = penColor;
        txtFrmt.size = 25;
        txtFrmt.font = "embeddedFont"; //(*33)
        drawingID++;
        // szövegbevitelnél azzal az apró módosítással élünk, hogy nem üres mc-t,
        // hanem üres szövegmezőt hozunk létre........
        this.createTextField("text"+drawingID, this.getNextHighestDepth(), this._xmouse, this._ymouse, 100, 25);
        this["text"+drawingID].embedFonts = true; //(*33)....
        this["text"+drawingID].type = "input";
        this["text"+drawingID].multiline = true;
        this["text"+drawingID].selectable = 1;
        this["text"+drawingID].text = " ";
        this["text"+drawingID].setTextFormat(txtFrmt); //....(*33)
        //........aminek rögtön át is adjuka fókuszt (megjelenik a villogó kurzor),
        // hogy a felhasználó lássa, hogy kezdhet írni. (*34)
        Selection.setFocus(this["text"+drawingID]);
        Selection.setSelection(0, 0);
        // némi szépészeti beavatkozás (*35)
        this["text"+drawingID].onChanged = function() {
            this.text = this.text.toUpperCase();
            this.autoSize = "left";
        };
        // amint a felhasználó 'kilép' a szövegmezőböl, azaz a szövegmezőröl lekerül a fókusz,
        // a canvas_mc ismét klikkelhető lesz, új szövegbeviteli lehetőségre készen (*32-2)
        this["text"+drawingID].onKillFocus = function() {
            this.type = "dynamic";
            this.selectable = 0;
            this._parent.enabled = 1;
        };
    };
};

*31 - szövegbeviteli eszköz működése a vonal és görberajzolóhoz képest annyiban más, hogy nincs szükség a nyomva tartott egérgomb lekezelésére, így a felesleges gomb eseménykezelőket érdemes törölni, és csak a klikkeléskor történő eseményre koncentrálunk a továbbiakban.
*32-1 - terv szerint amikor a felhasználó klikkelt a rajzterületen, megjelenik majd a villogó kurzor és megkezdődhet a szövegbevitel. a rajzlap klikkelhetőségét a a szövegmezőn lévő fókuszhoz viszonyítva fogjuk kezelni: - amíg a szövegmező aktív, addig a rajzlapon klikkelés nem hoz létre új szövegmezőt, mivel valószínűleg a user csak a bevitel végét jelzi a külső klikkeléssel (*32-2 ekkor a fókusz elvesztése révén a szövegmező egyben 'be is égetődik' a rajzba, tovább nem szerkeszthető (type = "dynamic", selectable = 0).
*33 - szövegmezők formázása saját propertyken keresztül
*34 - a setFocus segítségével rögtön a frissen létrejött szövegmezőnek adhatjuk a fókuszt, míg a setSelection-nel megadhatjuk, hogy hol is villogjon a kurzorszár (illetve mely szövegszakasz legyen kijelölve) a szövegmezőn belül.
*35 - csak nagy betűvel írhatunk, és a szövegmező méretét mindig a tartalma méretéhez igazítjuk, minden olyan esetben, amikor a tartalom a felhasználó révén változik (Ezt hivatott figyelni az onChanged eseménykezelő.)