Flashforum - Die Community zu Adobe Flash, Flex AIR. Web Design und Inspiration.

labrar · 17-10-2011, 10:02

Hallo liebe Flasher

Ich habe ein kleines Problem.
Ich baue gerade einen HTML Editor. Der User hat die Möglichkeit die Textbox per Anfasser zu verkleinern bzw. zu vergrößern.

Funktioniert auch alles.

NUR:
Wenn ich das Textfeld verkleinere , kann ich die dadurch entstandenen Umbrüche nicht speichern. Und genau das brauche ich.

Beispiel:

PHP-Code:

  Ich wäre jetzt
der Htmltext 
der umgebrochen
wurde weil das
Textfeld
zu schmal ist.

Würde ich dann benötigen als HTML Text Rückgabe

PHP-Code:

  Ich wäre jetzt<br>der Htmltext<br>der umgebrochen<br>wurde weil das<br>Textfeld<br>zu schmal ist.

Oder auch möglich (Wahrscheinlich sogar besser) als Text

PHP-Code:

  Ich wäre jetzt#der Htmltext#der umgebrochen#wurde weil das#Textfeld#zu schmal ist.

Wobei # hier für '\n' steht.

Ich bekomme aber leider folgenden String zurückgeliefert

PHP-Code:

  Ich wäre jetzt der Htmltext der umgebrochen wurde weil das Textfeld zu schmal ist.

Das Textfeld ist ein normales Feld mit den Eigenschaften

Width:200
Height:200
autoSize:false
wordWrap:true
multiline:true
embedFonts:true
html:true

Danke euch schonmal im vorraus

**sonar** · 17-10-2011, 10:43

Hilft dir das hier weiter?
Automatische Umbrüche in HTML-Textfeld erkennen

labrar · 17-10-2011, 11:27

Hmmm. Ist das AS3?

Unerwartetes Auftreten von '/'

Jup. Scheint as3 zu sein da die Flashhilfe unter numlines nur was bei as3 ausspuckt.
Gibt es da auch ein AS2 Pendant?

**sonar** · 17-10-2011, 11:29

Zitat:

Zitat von labrar

Hmmm. Ist das AS3?

Äh ja, natürlich …

labrar · 17-10-2011, 11:38

Ja AS3 ist noch nicht so ganz in meinem Hause angekommen

Gibt es da auch etwas vergleichbares für AS2?

labrar · 17-10-2011, 13:40

Es scheint als wäre meine einzige Möglichkeit doch über textExtend zu gehen.

es funktioniert zwar, bricht aber nicht immer da um wo es umbrechen soll.

PHP-Code:

  function br2nl(textfield,changer){

    str=textfield.text.split('');

    maxwidth=textfield._width;

    w=0;

    breakpoints=new Array();

    for(i=0;i<str.length;i++){

        

        if(str[i]==' '){lastSpace=i;}

        if(str[i]=='\n' || str[i]=='\r'){w=0;}

        fmt=textfield.getTextFormat(i,(i+1));

        var metrics:Object = fmt.getTextExtent(str[i],maxwidth);

        w+=(metrics.width);

        if(w>maxwidth){

            breakpoints.push(lastSpace); w=0;

            }

        }

        for(i=0;i<breakpoints.length;i++){

            str[breakpoints[i]]=str[breakpoints[i]]+changer;

            }

        return str.join('');

    }

Aufruf via br2nl(textfeldname,einfügeparameter);

Gibt es da noch eine sauberere Lösung?

**shin10** · 17-10-2011, 17:53

Hi,

also in as2 ist das wirklich ein Gefrickel. Das Beste was mir vorerst einfällt ist folgendes:

PHP-Code:

  var charClasses:Array = ["\n\r", " \t- "];

function as2WordWrapDetection(tf:TextField, linebreak:String):String{

    if (linebreak == undefined)linebreak = "<br />";

    var bu:String = tf.htmlText;

    var l:Number = tf.text.length;

    var lth:Number = tf.textHeight;

    var cc:Number = getCharacterClass(tf.text.charAt(l-2));

    var lcc:Number = -1;

    var res:String = "";

    while(l > 0){

        lcc = cc;

        while(cc == lcc && l> 0){

            var ch:String = tf.text.charAt(--l-1);

            cc = getCharacterClass(ch);

        }

        res = tf.text.substr(l, tf.text.length) + res;

        tf.replaceText(l,tf.text.length, "");

        if(tf.textHeight < lth){

            lth = tf.textHeight;

            if(cc!=0){

                res = linebreak+res;

            }

        }

    }

    tf.htmlText = bu; // textfeld zurücksetzen

    

    //harte umbrüche in linebreak wandeln (unter berücksichtigung des autoumbruchs)

    res = res.split(linebreak+"\r").join(linebreak);

    res = res.split(linebreak+"\n").join(linebreak);

    res = res.split("\r").join(linebreak);

    res = res.split("\n").join(linebreak);

    res = res.substr(0, l-6);

    

    return res;

}

function getCharacterClass(ch:String):Number{

    for(var i:Number=0; i<charClasses.length; i++){

        if(charClasses[i].indexOf(ch)!=-1)

        return i;

    }

    return -1;

}

Funktioniert nach meinen kurzen Tests soweit auch mit unterschiedlichen Formaten. Was jedoch nicht berücksichtigt wird, sind Worte, deren Länge allein über die Zeilenbreite hinausgeht. Es kann auch sein, dass es noch Zeichen gibt, die für einen Umbruch sorgen (wie der Mittestrich im Wort - wer weiß was es da noch alles gibt) an die ich nicht gedacht habe. Also so gesehen das Ganze mal unter Vorbehalt.

mfg

sx

labrar · 21-10-2011, 17:21

Danke. Sieht auch nicht schlecht aus.
Ich probiere damit mal rum

labrar · 29-10-2011, 11:22

shin10
Danke nochmal. Deine methode funzt besser als meine. Aus unerfindlichen Gründen werden zwar die letzten 5 Zeichen abgeschnitten, was aber nicht weiter schlimm ist, da ich ja lediglich die Umbrüche benötige.

Wunder dich nicht über die nochmals eingefügten Textfelder in deiner Version. Im realen Projekt verliere ich ohne diese immer den Focus zum Textfeld.

Nächstes Problem.

Ich möchte jetzt Boxen um die jeweiligen Zeichen legen.

Funktioniert fast bei gleichem Font und size.
Beim Beispiel das ich jetzt hier poste leider nicht mehr.
Ich weiß, dass Textextent nur 6 Parameter liefert. ascent, descent und zweimal width und height.
Von daher ist ein x, y auslesen der Zeichen innerhalb des Textfeldes mit AS2 wahrscheinlich nicht möglich. Mit meiner Funktion geht es annähernd (schlecht)

Vieleicht weiß ja jemand noch einen Ansatz.

Hier erstmal der Code

PHP-Code:

  //Farbboxcontainer erstellen

createEmptyMovieClip('boxes',3000);

//Textfeld erstellen

createTextField('inp',0,0,0,300,300);

inp.type='input';

inp.autoSize=false;

inp.html=true;

inp.wordWrap=true;

inp.multiline=true;

inp.border=true;

inp.htmlText='<P ALIGN="LEFT"><FONT FACE="Verdana" SIZE="12" COLOR="#000000" LETTERSPACING="0" KERNING="0"><B>Testtext</B><FONT FACE="Times New Roman"><B> </B><FONT FACE="Comic" SIZE="40" COLOR="#FF0000"><B>Testtext Testtext</B></FONT></FONT></FONT></P><P ALIGN="LEFT"><FONT FACE="Comic" SIZE="40" COLOR="#FF0000" LETTERSPACING="0" KERNING="0"><B> sa asf </B></FONT></P><P ALIGN="LEFT"><FONT FACE="Comic" SIZE="10" COLOR="#FF0000" LETTERSPACING="0" KERNING="0"><B></B></FONT></P><P ALIGN="LEFT"><FONT FACE="Comic" SIZE="40" COLOR="#FF0000" LETTERSPACING="0" KERNING="0"><B>  asf  fsaasf </B></FONT></P><P ALIGN="LEFT"><FONT FACE="Comic" SIZE="40" COLOR="#FF0000" LETTERSPACING="0" KERNING="0"><B></B></FONT></P><P ALIGN="LEFT"><FONT FACE="Comic" SIZE="40" COLOR="#FF0000" LETTERSPACING="0" KERNING="0"><B> fsaasf fsaasf fsa</B></FONT></P>';

inp.onChanged=function(){

    slicer=br2nl(inp,'\n');

    makeDimBoxes(inp,slicer);

    trace(inp.htmlText);

    }

createEmptyMovieClip('box',1);

box.beginFill(0x000000,100);

box.moveTo(0,0);

box.lineTo(10,0);

box.lineTo(10,10);

box.lineTo(0,10);

box.lineTo(0,0);

box.endFill();

box._x=inp._width;

box._y=inp._height;

box.onPress=function(){this.startDrag(false);

this.onMouseMove=function(){

    

    inp._width=this._x;

    inp._height=this._y;

}}

box.onRelease=box.onReleaseOutside=function(){

    this.stopDrag();

    delete this.onMouseMove;

    slicer=br2nl(inp,'\n');

    makeDimBoxes(inp,slicer);

}

 
var charClasses:Array = ["\n\r", " \t- "];

function br2nl(tfx:TextField, linebreak:String):String{

    

    tfx._parent.createTextField('xmtitd',2000,0,0,tfx._width,tfx._height);

    tfx._parent.xmtitd.autoSize=true;

    //tfx._parent.xmtitd.embedFonts=true;

    tfx._parent.xmtitd.wordWrap=true;

    tfx._parent.xmtitd.multiline=true;

    tfx._parent.xmtitd.html=true;

    tfx._parent.xmtitd.htmlText=tfx.htmlText;

    tf=tfx._parent.xmtitd;

    

    if (linebreak == undefined)linebreak = "\n";

    var bu:String = tf.htmlText;

    var l:Number = tf.text.length;

    var lth:Number = tf.textHeight;

    var cc:Number = getCharacterClass(tf.text.charAt(l-2));

    var lcc:Number = -1;

    var res:String = "";

    while(l > 0){

        lcc = cc;

        while(cc == lcc && l> 0){

            var ch:String = tf.text.charAt(--l-1);

            cc = getCharacterClass(ch);

            

        }

        

        res = tf.text.substr(l, tf.text.length) + res;

        tf.replaceText(l,tf.text.length, "");

        if(tf.textHeight < lth){

            lth = tf.textHeight;

            if(cc!=0){

                res = linebreak+res;

            }

        }

    }

    tfx._parent.xmtitd.removeTextField();

    res = res.split(linebreak+"\r").join(linebreak);

    res = res.split(linebreak+"\n").join(linebreak);

    res = res.split("\r").join(linebreak);

    res = res.split("\n").join(linebreak);

    res = res.substr(0, l-6);

    return res;

}

function getCharacterClass(ch:String):Number{

    for(var i:Number=0; i<charClasses.length; i++){

        if(charClasses[i].indexOf(ch)!=-1)

        return i;

    }

    return -1;

} 

function makeDimBoxes(inp,breaktxt){

    boxes.bo.removeMovieClip();

    boxes.createEmptyMovieClip('bo',0);

    var org=inp.text.split('');

    var brea=breaktxt.split('');

    var y=0;

    var x=0;

    for(i=0;i<org.length;i++){

        var format=inp.getTextFormat(i,(i+1));

        var extend:Object=format.getTextExtent(org[i]);

        w=extend.width;

        h=extend.height;

        if(brea[i]=='\n'){

            y+=(extend.ascent);

            x=0;

            }

        if(org[i]==' '){

        x+=w;

        }

    if(org[i]!=' '){

    boxes.bo.createEmptyMovieClip('l'+i,i);

    boxes.bo['l'+i].lineStyle(0.5,0x000000,100);

    col=new Array(0xFF0000,0x00FF00,0x0000FF);

    boxes.bo['l'+i].beginFill(col[random(col.length)],30);

    boxes.bo['l'+i].moveTo(0,0);

    boxes.bo['l'+i].lineTo(w,0);

    boxes.bo['l'+i].lineTo(w,h);

    boxes.bo['l'+i].lineTo(0,h);

            boxes.bo['l'+i].lineTo(0,0);

            boxes.bo['l'+i].endFill();

    boxes.bo['l'+i]._x=x;

    boxes.bo['l'+i]._y=y;

    

    }

    x+=w;

    inp._parent.xmtitd.removeTextField();

        }

        boxes._x=2;

        boxes._y=2;

    }

Und im Anhang die entsprechende swf

Danke

labrar · 29-10-2011, 14:46

Bin ein Stück weiter.
Shin ich habe mich wieder von deiner Funktion getrennt auch wenn sie sogar innerhalb eines Strings richtig umbricht.

Y Position stimmt noch nicht beim jetzigen Stand

PHP-Code:

  //Farbboxcontainer erstellen

createEmptyMovieClip('boxes',3000);

//Textfeld erstellen

createTextField('inp',0,0,0,300,300);

inp.type='input';

inp.autoSize=false;

inp.html=true;

inp.wordWrap=true;

inp.multiline=true;

inp.border=true;

inp.htmlText='<P ALIGN="LEFT"><FONT FACE="Verdana" SIZE="12" COLOR="#000000" LETTERSPACING="0" KERNING="0"><B>Testtext</B><FONT FACE="Times New Roman"><B> </B><FONT FACE="Comic" SIZE="40" COLOR="#FF0000"><B>Testtext Testtext</B></FONT></FONT></FONT></P><P ALIGN="LEFT"><FONT FACE="Comic" SIZE="40" COLOR="#FF0000" LETTERSPACING="0" KERNING="0"><B> sa asf </B></FONT></P><P ALIGN="LEFT"><FONT FACE="Comic" SIZE="10" COLOR="#FF0000" LETTERSPACING="0" KERNING="0"><B></B></FONT></P><P ALIGN="LEFT"><FONT FACE="Comic" SIZE="40" COLOR="#FF0000" LETTERSPACING="0" KERNING="0"><B>  asf  fsaasf </B></FONT></P><P ALIGN="LEFT"><FONT FACE="Comic" SIZE="40" COLOR="#FF0000" LETTERSPACING="0" KERNING="0"><B></B></FONT></P><P ALIGN="LEFT"><FONT FACE="Comic" SIZE="40" COLOR="#FF0000" LETTERSPACING="0" KERNING="0"><B> fsaasf fsaasf fsa</B></FONT></P>';

inp.onChanged=function(){

    slicer=br2nl(inp,'\n');

    makeDimBoxes(inp,slicer);

    trace(inp.htmlText);

    }

createEmptyMovieClip('box',1);

box.beginFill(0x000000,100);

box.moveTo(0,0);

box.lineTo(10,0);

box.lineTo(10,10);

box.lineTo(0,10);

box.lineTo(0,0);

box.endFill();

box._x=inp._width;

box._y=inp._height;

box.onPress=function(){this.startDrag(false);

this.onMouseMove=function(){

    

    inp._width=this._x;

    inp._height=this._y;

}}

box.onRelease=box.onReleaseOutside=function(){

    this.stopDrag();

    delete this.onMouseMove;

    slicer=br2nl(inp,'\n');

    makeDimBoxes(inp,slicer);

}

slicer=br2nl(inp);

 
function makeDimBoxes(inp,breaktxt){

    trace(breaktxt);

    boxes.bo.removeMovieClip();

    boxes.createEmptyMovieClip('bo',0);

    var org=inp.text.split('');

    var brea=breaktxt.split('');

    var y=0;

    var x=0;

    for(i=0;i<org.length;i++){

        var format=inp.getTextFormat(i,(i+1));

        var extend:Object=format.getTextExtent(org[i]);

        w=extend.width;

        

        top=extend.ascent;

        h=extend.height-extend.descent;

        if(brea[i]=='\n'){

            

            y+=(extend.ascent);

            x=0;

            }

        //if(org[i]==' '){

        //x+=w;

    //    }

    if(org[i]!=' '){

    boxes.bo.createEmptyMovieClip('l'+i,i);

    boxes.bo['l'+i].lineStyle(0.5,0x000000,100);

    col=new Array(0xFF0000,0x00FF00,0x0000FF);

    boxes.bo['l'+i].beginFill(col[random(col.length)],30);

    boxes.bo['l'+i].moveTo(0,0);

    boxes.bo['l'+i].lineTo(w,0);

    boxes.bo['l'+i].lineTo(w,h);

    boxes.bo['l'+i].lineTo(0,h);

            boxes.bo['l'+i].lineTo(0,0);

            boxes.bo['l'+i].endFill();

    boxes.bo['l'+i]._x=x;

    boxes.bo['l'+i]._y=top+y;

    

    }

    

    x+=w;

    inp._parent.xmtitd.removeTextField();

        }

        boxes._x=2;

        boxes._y=2;

    }

function br2nl(inp){

    tx=inp.text.split('\r').join('\n').split('');

    absw=inp.textWidth;

    trenner=new Array('  ',' ','-','.',',',':');

    x=0;

    

    for(i=0;i<tx.length;i++){

        

        var format:Object=inp.getTextFormat(i,(i+1));

        var extent:Object=format.getTextExtent(tx[i]);

        for(u=0;u<trenner.length;u++){

            if(trenner[u]==tx[i]){lastbreak=i;

            }

            }

        w=extent.width;

        

        x+=(w);

        if(tx[i]=='\n' || tx[i]=='\r'){x=0;}

        if(x>(absw)){

            x=0;

            if(lastbreak<1){

                tx[i]='\n'+tx[i];

                }else{

                    

            tx[lastbreak]+='\n';

            

            lastbreak=0;

            }

            }

    }

        return tx.join('');

    }

**shin10** · 29-10-2011, 15:12

Also das mit den letzten 5 Zeichen liegt an

PHP-Code:

   res = res.substr(0, l-6);

Hatte ich drin, weil ich immer noch ein <BR /> am Ende des Strings hatte. Sollte man eigentlich prüfen, ob das notwendig ist oder nicht.

Was die Boxen angeht ... pff - da müsst ich erst mal schauen.

labrar · 29-10-2011, 15:19

Ja ist kniffelig. Ich komme langsam ran. Wobei das ziemliches eiergecode ist.
Nein das mit den 5 Zeichen war mir auch wurst da ich ja wie gesagt, eh mit dem Orginalstring gegenprüfe.
Deine Funktion musste ich kappen, da die nur funktioniert hat mit gleichbleibender Schriftgröße. Sobald mehrere Formatierungen im Text waren, liefs nicht mehr so.

PHP-Code:

  //Farbboxcontainer erstellen

createEmptyMovieClip('boxes',3000);

//Textfeld erstellen

createTextField('inp',0,0,0,300,300);

inp.type='input';

inp.autoSize=false;

inp.html=true;

inp.wordWrap=true;

inp.multiline=true;

inp.border=true;

inp.htmlText='<P ALIGN="LEFT"><FONT FACE="Verdana" SIZE="12" COLOR="#000000" LETTERSPACING="0" KERNING="0"><B>Testtext</B><FONT FACE="Times New Roman"><B> </B><FONT FACE="Comic" SIZE="40" COLOR="#FF0000"><B>Testtext Testtext</B></FONT></FONT></FONT></P><P ALIGN="LEFT"><FONT FACE="Comic" SIZE="40" COLOR="#FF0000" LETTERSPACING="0" KERNING="0"><B> sa asf </B></FONT></P><P ALIGN="LEFT"><FONT FACE="Comic" SIZE="10" COLOR="#FF0000" LETTERSPACING="0" KERNING="0"><B></B></FONT></P><P ALIGN="LEFT"><FONT FACE="Comic" SIZE="40" COLOR="#FF0000" LETTERSPACING="0" KERNING="0"><B>  asf  fsaasf </B></FONT></P><P ALIGN="LEFT"><FONT FACE="Comic" SIZE="40" COLOR="#FF0000" LETTERSPACING="0" KERNING="0"><B></B></FONT></P><P ALIGN="LEFT"><FONT FACE="Comic" SIZE="40" COLOR="#FF0000" LETTERSPACING="0" KERNING="0"><B> fsaasf fsaasf fsa</B></FONT></P>';

inp.onChanged=function(){

    slicer=br2nl(inp,'\n');

    makeDimBoxes(inp,slicer);

    trace(inp.htmlText);

    }

createEmptyMovieClip('box',1);

box.beginFill(0x000000,100);

box.moveTo(0,0);

box.lineTo(10,0);

box.lineTo(10,10);

box.lineTo(0,10);

box.lineTo(0,0);

box.endFill();

box._x=inp._width;

box._y=inp._height;

box.onPress=function(){this.startDrag(false);

this.onMouseMove=function(){

    

    inp._width=this._x;

    inp._height=this._y;

}}

box.onRelease=box.onReleaseOutside=function(){

    this.stopDrag();

    delete this.onMouseMove;

    slicer=br2nl(inp,'\n');

    makeDimBoxes(inp,slicer);

}

slicer=br2nl(inp);

 
function makeDimBoxes(inp,breaktxt){

    trace(breaktxt);

    boxes.bo.removeMovieClip();

    boxes.createEmptyMovieClip('bo',0);

    var org=inp.text.split('');

    var brea=breaktxt.split('');

    var y=0;

    var x=0;

    for(i=0;i<org.length;i++){

        nl=false;

        nr=false;

        var format=inp.getTextFormat(i,(i+1));

        var extend:Object=format.getTextExtent(org[i]);

        w=extend.width+2;

        

        top=0; //extend.ascent;

        h=extend.height;//-(extend.descent+extend.ascent);

        if(brea[i]=='\n' || brea[i]=='\r'){

            if(brea[i]=='\n' || brea[i]=='\r'){nl=true;}

            if(brea[(i+1)]=='\n' || brea[(i+1)]=='\r'){nr=true;}

            if(nl && nr){y+=(h/2); trace('Doppelt');}else{trace('Einfach');y+=h;}

            x=0;

            }

            

        

    if(org[i]!=' ' && org[i]!='\n' && org[i]!='\r'){

    boxes.bo.createEmptyMovieClip('l'+i,i);

    boxes.bo['l'+i].lineStyle(0.5,0x000000,100);

    col=new Array(0xFF0000,0x00FF00,0x0000FF);

    boxes.bo['l'+i].beginFill(col[random(col.length)],30);

    boxes.bo['l'+i].moveTo(0,0);

    boxes.bo['l'+i].lineTo(w,0);

    boxes.bo['l'+i].lineTo(w,h);

    boxes.bo['l'+i].lineTo(0,h);

            boxes.bo['l'+i].lineTo(0,0);

            boxes.bo['l'+i].endFill();

    boxes.bo['l'+i]._x=x;

    boxes.bo['l'+i]._y=top+y;

    

    }

    

    x+=(w-2);

    inp._parent.xmtitd.removeTextField();

        }

        boxes._x=2;

        boxes._y=2;

        

    }

function br2nl(inp){

    tx=inp.text.split('\r').join('\n').split('');

    absw=inp.textWidth;

    trenner=new Array('  ',' ','-','.',',',':');

    x=0;

    

    for(i=0;i<tx.length;i++){

        

        var format:Object=inp.getTextFormat(i,(i+1));

        var extent:Object=format.getTextExtent(tx[i]);

        for(u=0;u<trenner.length;u++){

            if(trenner[u]==tx[i]){lastbreak=i;

            }

            }

        w=extent.width;

        

        x+=(w);

        if(tx[i]=='\n' || tx[i]=='\r'){x=0;}

        if(x>(absw)){

            x=0;

            if(lastbreak<1){

                tx[i]='\n'+tx[i];

                }else{

                    

            tx[lastbreak]+='\n';

            

            lastbreak=0;

            }

            }

    }

        return tx.join('');

    }

labrar · 29-10-2011, 15:56

Wird besser solange ich nix am Text ändere

PHP-Code:

  function makeDimBoxes(inp,breaktxt){

    trace(breaktxt);

    absdown=0;

    boxes.bo.removeMovieClip();

    boxes.createEmptyMovieClip('bo',0);

    var org=inp.text.split('');

    var brea=breaktxt.split('');

    var y=0;

    var x=0;

    for(i=0;i<org.length;i++){

        nl=false;

        nr=false;

        var format=inp.getTextFormat(i,(i+1));

        var extend:Object=format.getTextExtent(org[i]);

        

        w=extend.width+2;

        if(extend.ascent>absdown){absdown=extend.ascent;}

        top=(extend.descent+1)-extend.ascent+2;

        h=extend.height-(extend.descent*2);

        //trace(org[i]+' '+extend.ascent+' '+extend.height+' '+h);

        hbr=extend.height;

        //-(extend.descent+extend.ascent);

        if(brea[i]=='\n' || brea[i]=='\r'){

            if(brea[i]=='\n' || brea[i]=='\r'){nl=true;}

            if(brea[(i+1)]=='\n' || brea[(i+1)]=='\r'){nr=true;}

            if(nl && nr){y+=(hbr/2); }else{y+=hbr;}

            x=0;

            }

            

        

    if(org[i]!='' && org[i]!=' ' && org[i]!='\n' && org[i]!='\r'){

    boxes.bo.createEmptyMovieClip('l'+i,i);

    boxes.bo['l'+i].lineStyle(0.5,0x000000,100);

    col=new Array(0xFF0000,0x00FF00,0x0000FF);

    boxes.bo['l'+i].beginFill(col[random(col.length)],30);

    boxes.bo['l'+i].moveTo(0,0);

    boxes.bo['l'+i].lineTo(w,0);

    boxes.bo['l'+i].lineTo(w,(h));

    boxes.bo['l'+i].lineTo(0,(h));

            boxes.bo['l'+i].lineTo(0,0);

            boxes.bo['l'+i].endFill();

    boxes.bo['l'+i]._x=x;

    boxes.bo['l'+i]._y=top+y;

    

    }

    

    x+=(w-2);

    inp._parent.xmtitd.removeTextField();

        }

        boxes._x=2;

        boxes._y=absdown;

        

    }

**shin10** · 30-10-2011, 04:33

Hmm ... also ich weiß ja nicht was du da vorhast und ob das wirklich der Weg ist, aber hier mein letzter Versuch. Dafür noch zwei Kleinigkeiten an der ersten Funktion geändert.

PHP-Code:

  var charClasses:Array = ["\n\r", " \t- "];
function as2WordWrapDetection(tf:TextField, linebreak:String):String
{
    if (linebreak == undefined)
    {
        linebreak = "<br />";
    }
    var bu:String = tf.htmlText;
    var l:Number = tf.text.length;
    var lth:Number = tf.textHeight;
    var cc:Number = getCharacterClass(tf.text.charAt(l - 2));
    var lcc:Number = -1;
    var res:String = "";
    var lh:Number = 0;
    
    while (l > 0)
    {
        
        lcc = cc;
        while (cc == lcc && l > 0)
        {
            var ch:String = tf.text.charAt(--l - 1);
            cc = getCharacterClass(ch);
            var fmt = tf.getTextFormat(l-1, 1);
            var metrics:Object = fmt.getTextExtent(ch);
            lh = Math.max(lh, metrics.height);
        }
        res = tf.text.substr(l, tf.text.length) + res;
        tf.replaceText(l, tf.text.length, "");
        if (tf.textHeight < lth - (lh+4))
        {
            lth = tf.textHeight;
            if (cc != 0)
            {
                res = linebreak + res;
                lh = 0;
            }
        }
    }
    tf.htmlText = bu;// textfeld zurücksetzen 
    //harte umbrüche in linebreak wandeln (unter berücksichtigung des autoumbruchs) 
    res = res.split(linebreak + "\r").join(linebreak);
    res = res.split(linebreak + "\n").join(linebreak);
    res = res.split("\r").join(linebreak);
    res = res.split("\n").join(linebreak);
    while (res.substr(l - linebreak.length) == linebreak)
    {
        res = res.substr(0, l - linebreak.length);
        l = res.length;
    }
    
    return res;
}
function getCharacterClass(ch:String):Number
{
    for (var i:Number = 0; i < charClasses.length; i++)
    {
        if (charClasses[i].indexOf(ch) != -1)
        {
            return i;
        }
    }
    return -1;
}



function drawCharBoundingBoxes(tf:TextField):Void
{
    var bck:String = tf.text;
    var linebreak:String = String.fromCharCode(255);
    var str:String = as2WordWrapDetection(tf, linebreak);
    var arr:Array = str.split("");
    trace(str);

    var x:Number = 0;
    var y:Number = 0;
    var w:Number = 0;
    var h:Number = 0;
    var d:Number = 0;
    
    var lineHeight:Number = 0;
    var line:Number = 0;

    var chrMetrics:Array = [];
    var fmt_idx = 0;
    for (var i:Number = 0; i < arr.length; i++)
    {
        var fmt = tf.getTextFormat(fmt_idx, fmt_idx+1);
        var metrics:Object = fmt.getTextExtent(arr[i]);

        if (!chrMetrics[line])
        {
            chrMetrics[line] = {lineY:0, arr:[]};
        }

        w = metrics.width;
        h = metrics.height;
        d = Math.max(d, metrics.descent);
        
        if (arr[i] != linebreak)
        {
            lineHeight = Math.max(lineHeight, h);
            chrMetrics[line].arr.push({x:x, w:w, h:h, d:metrics.descent});
            x += w;
        }
        if (arr[i] == linebreak || i == arr.length-1){
            x = 0;
            y += lineHeight;
            
            chrMetrics[line].lineY =  y;
            chrMetrics[line].baseLine = d;
            lineHeight = 0;
            d = 0;
            line++;
        }
        fmt_idx += arr[i-1]==" " && arr[i]==linebreak ? 0 : 1;
    }

    for (i = 0; i < chrMetrics.length; i++){
        for (var j:Number = 0; j < chrMetrics[i].arr.length; j++){
            var b:MovieClip = chrMetrics[i].arr[j].box = this.createEmptyMovieClip("box_"+i+"|"+j, this.getNextHighestDepth()); 
            w = chrMetrics[i].arr[j].w;
            h = chrMetrics[i].arr[j].h;
            
            b.lineStyle(0.5, 0, 100); 
            b.beginFill(Math.random()*0xFFFFFF, 30); 
            b.moveTo(0,0); 
            b.lineTo(w,0); 
            b.lineTo(w,-h); 
            b.lineTo(0,-h); 
            b.lineTo(0,0); 
            b.endFill(); 
            b._x = chrMetrics[i].arr[j].x + tf._x +2; 
            b._y = chrMetrics[i].lineY      + tf._y +2 -chrMetrics[i].baseLine +  chrMetrics[i].arr[j].d;
        }
    }
}


drawCharBoundingBoxes(dasTextField);

Man sollte halt noch einen extra mc erstellen in dem die ganzen boxen landen, aber bei mir is momentan die Luft raus.

mfg

sx

labrar · 30-10-2011, 07:21

Halb sechs???

Danke shin ich teste das mal.

Bzgl. was ich damit vorhabe.

Ich baue gerade einen Druckdesigner (Postkarten usw.)
Die ganzen Daten werden zu SVG gewandelt.
Um auch beim Text später Pfade zu haben, werden auch diese in SVG umgewandelt. Jetzt benötige ich aber die ungefähr exakte x, Y Position jedes einzelnen Buchstabens um die entsprechenden Buchstabenpfadmc's auch richtig im Verhältnis zur Usereingabemaske anzuordnen.

17-10-2011, 10:02	#1 (permalink)
labrar Isch kucke Registriert seit: Jan 2005 Beiträge: 1.616	htmltext verkleinern und Umbrüche erkennen Hallo liebe Flasher Ich habe ein kleines Problem. Ich baue gerade einen HTML Editor. Der User hat die Möglichkeit die Textbox per Anfasser zu verkleinern bzw. zu vergrößern. Funktioniert auch alles. NUR: Wenn ich das Textfeld verkleinere , kann ich die dadurch entstandenen Umbrüche nicht speichern. Und genau das brauche ich. Beispiel: PHP-Code: `Ich wäre jetzt der Htmltext der umgebrochen wurde weil das Textfeld zu schmal ist.` Würde ich dann benötigen als HTML Text Rückgabe PHP-Code: `Ich wäre jetzt<br>der Htmltext<br>der umgebrochen<br>wurde weil das<br>Textfeld<br>zu schmal ist.` Oder auch möglich (Wahrscheinlich sogar besser) als Text PHP-Code: `Ich wäre jetzt#der Htmltext#der umgebrochen#wurde weil das#Textfeld#zu schmal ist.` Wobei # hier für '\n' steht. Ich bekomme aber leider folgenden String zurückgeliefert PHP-Code: `Ich wäre jetzt der Htmltext der umgebrochen wurde weil das Textfeld zu schmal ist.` Das Textfeld ist ein normales Feld mit den Eigenschaften Width:200 Height:200 autoSize:false wordWrap:true multiline:true embedFonts:true html:true Danke euch schonmal im vorraus __________________ Gesehen auf einem Türschild: Niederknien, anklopfen und um Audience betteln Har Har http://www.flashforum.de/forum/flash-mx-2004/uberblenden-tutorial-180341.html Mp3 Player http://www.flashforum.de/forum/stuff/stuff-jukebox-196373.html Geändert von labrar (17-10-2011 um 10:04 Uhr)

17-10-2011, 10:43	#2 (permalink)
sonar mod_rewrite Registriert seit: Feb 2003 Ort: München Beiträge: 15.621	Hilft dir das hier weiter? Automatische Umbrüche in HTML-Textfeld erkennen __________________ RTFM Wie man Fragen richtig stellt. Achim Bindannmalweg Money makes the world go round, fear makes it turn much faster. (New Model Army)

17-10-2011, 11:27	#3 (permalink)
labrar Isch kucke Registriert seit: Jan 2005 Beiträge: 1.616	Hmmm. Ist das AS3? Unerwartetes Auftreten von '/' Jup. Scheint as3 zu sein da die Flashhilfe unter numlines nur was bei as3 ausspuckt. Gibt es da auch ein AS2 Pendant? __________________ Gesehen auf einem Türschild: Niederknien, anklopfen und um Audience betteln Har Har http://www.flashforum.de/forum/showthread.php?t=180341 Mp3 Player http://www.flashforum.de/forum/showthread.php?t=196373 Geändert von labrar (17-10-2011 um 11:34 Uhr)

17-10-2011, 11:38	#5 (permalink)
labrar Isch kucke Registriert seit: Jan 2005 Beiträge: 1.616	Ja AS3 ist noch nicht so ganz in meinem Hause angekommen Gibt es da auch etwas vergleichbares für AS2? __________________ Gesehen auf einem Türschild: Niederknien, anklopfen und um Audience betteln Har Har http://www.flashforum.de/forum/showthread.php?t=180341 Mp3 Player http://www.flashforum.de/forum/showthread.php?t=196373

17-10-2011, 13:40	#6 (permalink)
labrar Isch kucke Registriert seit: Jan 2005 Beiträge: 1.616	Es scheint als wäre meine einzige Möglichkeit doch über textExtend zu gehen. es funktioniert zwar, bricht aber nicht immer da um wo es umbrechen soll. PHP-Code: function br2nl(textfield,changer){ str=textfield.text.split(''); maxwidth=textfield._width; w=0; breakpoints=new Array(); for(i=0;i<str.length;i++){ if(str[i]==' '){lastSpace=i;} if(str[i]=='\n' \|\| str[i]=='\r'){w=0;} fmt=textfield.getTextFormat(i,(i+1)); var metrics:Object = fmt.getTextExtent(str[i],maxwidth); w+=(metrics.width); if(w>maxwidth){ breakpoints.push(lastSpace); w=0; } } for(i=0;i<breakpoints.length;i++){ str[breakpoints[i]]=str[breakpoints[i]]+changer; } return str.join(''); } Aufruf via br2nl(textfeldname,einfügeparameter); Gibt es da noch eine sauberere Lösung? __________________ Gesehen auf einem Türschild: Niederknien, anklopfen und um Audience betteln Har Har http://www.flashforum.de/forum/showthread.php?t=180341 Mp3 Player http://www.flashforum.de/forum/showthread.php?t=196373

17-10-2011, 17:53	#7 (permalink)
shin10 in the boondocks Registriert seit: Feb 2006 Ort: Augsburg Beiträge: 3.498	Hi, also in as2 ist das wirklich ein Gefrickel. Das Beste was mir vorerst einfällt ist folgendes: PHP-Code: var charClasses:Array = ["\n\r", " \t- "]; function as2WordWrapDetection(tf:TextField, linebreak:String):String{ if (linebreak == undefined)linebreak = "<br />"; var bu:String = tf.htmlText; var l:Number = tf.text.length; var lth:Number = tf.textHeight; var cc:Number = getCharacterClass(tf.text.charAt(l-2)); var lcc:Number = -1; var res:String = ""; while(l > 0){ lcc = cc; while(cc == lcc && l> 0){ var ch:String = tf.text.charAt(--l-1); cc = getCharacterClass(ch); } res = tf.text.substr(l, tf.text.length) + res; tf.replaceText(l,tf.text.length, ""); if(tf.textHeight < lth){ lth = tf.textHeight; if(cc!=0){ res = linebreak+res; } } } tf.htmlText = bu; // textfeld zurücksetzen //harte umbrüche in linebreak wandeln (unter berücksichtigung des autoumbruchs) res = res.split(linebreak+"\r").join(linebreak); res = res.split(linebreak+"\n").join(linebreak); res = res.split("\r").join(linebreak); res = res.split("\n").join(linebreak); res = res.substr(0, l-6); return res; } function getCharacterClass(ch:String):Number{ for(var i:Number=0; i<charClasses.length; i++){ if(charClasses[i].indexOf(ch)!=-1) return i; } return -1; } Funktioniert nach meinen kurzen Tests soweit auch mit unterschiedlichen Formaten. Was jedoch nicht berücksichtigt wird, sind Worte, deren Länge allein über die Zeilenbreite hinausgeht. Es kann auch sein, dass es noch Zeichen gibt, die für einen Umbruch sorgen (wie der Mittestrich im Wort - wer weiß was es da noch alles gibt) an die ich nicht gedacht habe. Also so gesehen das Ganze mal unter Vorbehalt. mfg sx __________________ flintfabrik.de

21-10-2011, 17:21	#8 (permalink)
labrar Isch kucke Registriert seit: Jan 2005 Beiträge: 1.616	Danke. Sieht auch nicht schlecht aus. Ich probiere damit mal rum __________________ Gesehen auf einem Türschild: Niederknien, anklopfen und um Audience betteln Har Har http://www.flashforum.de/forum/showthread.php?t=180341 Mp3 Player http://www.flashforum.de/forum/showthread.php?t=196373

29-10-2011, 15:12	#11 (permalink)
shin10 in the boondocks Registriert seit: Feb 2006 Ort: Augsburg Beiträge: 3.498	Also das mit den letzten 5 Zeichen liegt an PHP-Code: `res = res.substr(0, l-6);` Hatte ich drin, weil ich immer noch ein <BR /> am Ende des Strings hatte. Sollte man eigentlich prüfen, ob das notwendig ist oder nicht. Was die Boxen angeht ... pff - da müsst ich erst mal schauen. __________________ flintfabrik.de

30-10-2011, 04:33	#14 (permalink)
shin10 in the boondocks Registriert seit: Feb 2006 Ort: Augsburg Beiträge: 3.498	Hmm ... also ich weiß ja nicht was du da vorhast und ob das wirklich der Weg ist, aber hier mein letzter Versuch. Dafür noch zwei Kleinigkeiten an der ersten Funktion geändert. PHP-Code: var charClasses:Array = ["\n\r", " \t- "]; function as2WordWrapDetection(tf:TextField, linebreak:String):String { if (linebreak == undefined) { linebreak = "<br />"; } var bu:String = tf.htmlText; var l:Number = tf.text.length; var lth:Number = tf.textHeight; var cc:Number = getCharacterClass(tf.text.charAt(l - 2)); var lcc:Number = -1; var res:String = ""; var lh:Number = 0; while (l > 0) { lcc = cc; while (cc == lcc && l > 0) { var ch:String = tf.text.charAt(--l - 1); cc = getCharacterClass(ch); var fmt = tf.getTextFormat(l-1, 1); var metrics:Object = fmt.getTextExtent(ch); lh = Math.max(lh, metrics.height); } res = tf.text.substr(l, tf.text.length) + res; tf.replaceText(l, tf.text.length, ""); if (tf.textHeight < lth - (lh+4)) { lth = tf.textHeight; if (cc != 0) { res = linebreak + res; lh = 0; } } } tf.htmlText = bu;// textfeld zurücksetzen //harte umbrüche in linebreak wandeln (unter berücksichtigung des autoumbruchs) res = res.split(linebreak + "\r").join(linebreak); res = res.split(linebreak + "\n").join(linebreak); res = res.split("\r").join(linebreak); res = res.split("\n").join(linebreak); while (res.substr(l - linebreak.length) == linebreak) { res = res.substr(0, l - linebreak.length); l = res.length; } return res; } function getCharacterClass(ch:String):Number { for (var i:Number = 0; i < charClasses.length; i++) { if (charClasses[i].indexOf(ch) != -1) { return i; } } return -1; } function drawCharBoundingBoxes(tf:TextField):Void { var bck:String = tf.text; var linebreak:String = String.fromCharCode(255); var str:String = as2WordWrapDetection(tf, linebreak); var arr:Array = str.split(""); trace(str); var x:Number = 0; var y:Number = 0; var w:Number = 0; var h:Number = 0; var d:Number = 0; var lineHeight:Number = 0; var line:Number = 0; var chrMetrics:Array = []; var fmt_idx = 0; for (var i:Number = 0; i < arr.length; i++) { var fmt = tf.getTextFormat(fmt_idx, fmt_idx+1); var metrics:Object = fmt.getTextExtent(arr[i]); if (!chrMetrics[line]) { chrMetrics[line] = {lineY:0, arr:[]}; } w = metrics.width; h = metrics.height; d = Math.max(d, metrics.descent); if (arr[i] != linebreak) { lineHeight = Math.max(lineHeight, h); chrMetrics[line].arr.push({x:x, w:w, h:h, d:metrics.descent}); x += w; } if (arr[i] == linebreak \|\| i == arr.length-1){ x = 0; y += lineHeight; chrMetrics[line].lineY = y; chrMetrics[line].baseLine = d; lineHeight = 0; d = 0; line++; } fmt_idx += arr[i-1]==" " && arr[i]==linebreak ? 0 : 1; } for (i = 0; i < chrMetrics.length; i++){ for (var j:Number = 0; j < chrMetrics[i].arr.length; j++){ var b:MovieClip = chrMetrics[i].arr[j].box = this.createEmptyMovieClip("box_"+i+"\|"+j, this.getNextHighestDepth()); w = chrMetrics[i].arr[j].w; h = chrMetrics[i].arr[j].h; b.lineStyle(0.5, 0, 100); b.beginFill(Math.random()0xFFFFFF, 30); b.moveTo(0,0); b.lineTo(w,0); b.lineTo(w,-h); b.lineTo(0,-h); b.lineTo(0,0); b.endFill(); b._x = chrMetrics[i].arr[j].x + tf._x +2; b._y = chrMetrics[i].lineY + tf._y +2 -chrMetrics[i].baseLine + chrMetrics[i].arr[j].d; } } } drawCharBoundingBoxes(dasTextField); Man sollte halt noch einen extra mc erstellen in dem die ganzen boxen landen, aber bei mir is momentan die Luft raus. mfg sx __________________ flintfabrik.de Geändert von shin10 (30-10-2011 um 04:34 Uhr)*

30-10-2011, 07:21	#15 (permalink)
labrar Isch kucke Registriert seit: Jan 2005 Beiträge: 1.616	Halb sechs??? Danke shin ich teste das mal. Bzgl. was ich damit vorhabe. Ich baue gerade einen Druckdesigner (Postkarten usw.) Die ganzen Daten werden zu SVG gewandelt. Um auch beim Text später Pfade zu haben, werden auch diese in SVG umgewandelt. Jetzt benötige ich aber die ungefähr exakte x, Y Position jedes einzelnen Buchstabens um die entsprechenden Buchstabenpfadmc's auch richtig im Verhältnis zur Usereingabemaske anzuordnen. __________________ Gesehen auf einem Türschild: Niederknien, anklopfen und um Audience betteln Har Har http://www.flashforum.de/forum/showthread.php?t=180341 Mp3 Player http://www.flashforum.de/forum/showthread.php?t=196373 Geändert von labrar (30-10-2011 um 08:02 Uhr)

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Ansicht
Linear-Darstellung Zur Hybrid-Darstellung wechseln Zur Baum-Darstellung wechseln

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Automatische Umbrüche in HTML-Textfeld erkennen	sonar	ActionScript 3	19	30-03-2011 16:44
htmlText += htmlText macht neuen Absatz	harego	ActionScript 1	1	24-12-2006 12:16
umbrüche in txt-datei erkennen	AneBanane	Flash MX	11	25-04-2005 08:25
Umbrüche in XML	gummipinsel	ActionScript 1	11	11-03-2004 11:53
autmatische umbrüche in textfeld erkennen und daraus manuelle machen!	kendal	ActionScript 1	2	29-03-2003 21:50