CSS knyttet til textfield

Der er et godt eks. her.

http://livedocs.macromedia.com/flash/8/main/wwhelp/wwhimpl/common/html/wwhelp.htm?context=LiveDocs_Parts&file=00002780.html

Kim

Du knytter tekstfeltet til css således: (init er mit textfelt)

init.styleSheet = myCSS;
init.text = "<span class='content'>"+text fra xml+</span>";

i din flash fil allerførst skriver du:

var myCSS = new TextField.StyleSheet();
// sti til stylesheet
var cssURL = "stylesheet/example.css";
   
//Load CSS file
myCSS.load(cssURL);
// tjek om css er loadet ok
myCSS.onLoad = function(success)
    {
            if (success)
            {
                   
                    // load XML fil hvis alt er ok
                   

            }
    };
   
eksternt styleshet ser i dette tilfælde således ud:
.content {
  color: #004f92;
  font-family: Frutiger LT Std 55 Roman;
  font-size: 22px;

  display: inline;
}

vh

KalleBalle

Tak begge 2
KalleBalle du skriver først:
init.styleSheet = myCSS;
init.text = "<span class='content'>"+text fra xml+</span>";
Hvor sætter jeg dette AS ind henne?

Når du har læst din xml fil og behandlet dine data og f.eks. lavet et textfelt med action script så sætter du det ind, - eller hvis du har lavet et textfelt uden actionscript med navnen init, - jammen så sætter du det bare ind i koden der hvor din xml er læst ind, - ellers er der jo ikke noget data at skrive :)

perfekt eksempel her:

http://www.actionscript.org/tutorials/beginner/css_in_flash/index.shtml

Hej igen
Jeg er desværre ikke så hård til AS som jeg kunne ønske mig :-(
Kan du ud fra nedenstående se hvor jeg er forkert på den, jeg har prøvet at sætte det sammen ud fra dit eksempel/linket. Mit textfield hedder til_text...

//Create a new style sheet object
var myCSS = new TextField.StyleSheet();

//Specify the location of the CSS file that you created earlier
var cssURL = "example.css";

function loadXML(loaded) {
    if (loaded) {
        image = [];
        description = [];
        vejltext = [];
        xmlNode = this.firstChild;
        subtotal = xmlNode.childNodes.length;
        total = 0;
        for (i=0; i<subtotal; i++) {
                if(xmlNode.childNodes[i].attributes["niveau"] == "3") {
                    image[total] = xmlNode.childNodes[i].childNodes[0].firstChild.nodeValue;
                    description[total] = xmlNode.childNodes[i].childNodes[1].firstChild.nodeValue;
                    vejltext[total] = xmlNode.childNodes[i].childNodes[2].firstChild.nodeValue;
                    total++;
                }
        }
        firstImage();
    } else {
        content = "file not loaded!";
    }
}
xmlData = new XML();
xmlData.ignoreWhite = true;
xmlData.onLoad = loadXML;
xmlData.load("./xml/images2.xml");

//Load CSS file
myCSS.load(cssURL);
//define onLoad handler
myCSS.onLoad = function(success) {
  if (success) {
    /* If the style sheet loaded without error,
    assign it to the text object, and assign the HTML text to the
    text field*/
    til_text.styleSheet = myCSS;
    til_text.text = "<span class='content'>"vejltext"</span>";
  }
};

Altså jeg ville først loade css efter at du har loadet xml dataen eller omvendt.

Så altså:

function loadXML(loaded) {
    if (loaded) {
        image = [];
        description = [];
        vejltext = [];
        xmlNode = this.firstChild;
        subtotal = xmlNode.childNodes.length;
        total = 0;
        for (i=0; i<subtotal; i++) {
                if(xmlNode.childNodes[i].attributes["niveau"] == "3") {
                    image[total] = xmlNode.childNodes[i].childNodes[0].firstChild.nodeValue;
                    description[total] = xmlNode.childNodes[i].childNodes[1].firstChild.nodeValue;
                    vejltext[total] = xmlNode.childNodes[i].childNodes[2].firstChild.nodeValue;
                    total++;
                }
        }




myCSS.load(cssURL);
myCSS.onLoad = function(success) {
  if (success) {
    /* If the style sheet loaded without error,
    assign it to the text object, and assign the HTML text to the
    text field*/
    til_text.styleSheet = myCSS;
    til_text.text = "<span class='content'>"vejltext"</span>";
firstImage();
  }
};
       
    } else {
        content = "file not loaded!";
    }
}

og du er helt sikker på at sti til xml data og css er rigtig?

vh

KalleBalle

Jeg rammer hele tiden panden imod denne fejl:
Syntax error.
        til_text.text = "<span class='content'>"vejltext"</span>";
??
Jeg forhøjer lige til 100p når der nu skal være så meget "bøvl" for dig...:-)

Og ja, stierne er rigtige. css´en ligger i samme mappe som .fla filen.

Al oventstående funktionalitet/AS ligger forresten i et MC. Har det noget at sige ift. syntaxen?

Der skal stå:

til_text.text = "<span class='content'>"+vejltext+"</span>";

Men såvidt jeg kan se er vejltext er et array, - vil du gerne vise det hele på en gang??

vh

KalleBalle

Du skal helst ikke lægge kode i movieclips, - det kan blive et værre rod, - tænk hvis du har 20 mc's og du har lagt kode i nogle af dem, - hvordan vil du finde rundt i det?

Det bedste er at bruge as 2 struktur og forsøge at få så meget som muligt ud i klasser, - dvs. små grupper extern kode der lige præcis gør det de skal uden at blande alt muligt sammen. Er det godt lavet vil du kunne genbruge disse klasser i andre programmer og dermed spare tid og fejl.

vh

KalleBalle

Hej kalleballe
Har ikke rigtigt haft tid til at kigge på det siden - og har heller ikke lige nu. Men jeg vil gerne give dig point for din velvillige hjælp. Mange tak. (Måske vil jeg gerne spørge lidt igen senere, hvis jeg må....?)

hej og tak selv,-  du skal da bare spørge løs, - måske er der nogen der ved bedre end jeg.

vh

KalleBalle

P.S jeg vil hellere have karma end point, - der var en eller anden der gav mig 0 i karma og det kan jeg slet ikke komme mig over ;)

Hej kalleballe
Hvem kunne ikke tænke sig at få et godt karma:-) You deserve it......jeg giver mit bidrag snarest.
Jeg har fået det hele til at virke. Fedt.
Der er kun en enkelt lille detalje som generer mig. Når den loader viser den (i et kort splitsekund): "<span class='content'>"+vejltext+"</span> inden den egentlige tekst fra xml´en loades. Det gælder kun første gang, de efterfølgende dele (billeder/tekst) kommer fint. Men det generer mit øje.
Har du et bud på hvordan det kan undgåes?

hm, - det er jo nok fordi du loader tingene oven i hinanden, - i stedet for først at loade xml og putte data i array/objekter så de er klar når de skal bruges.
Måske er det lige nu sådan at når du kommer til til_text.text= etc... så er variablen ikke loadet endnu, - det bliver den så og så er det ok.
Du kan tjekke det ved at trace text variablen lige før du skal bruge den, - altså:
trace("min dynamiske text var = "+vejltext);
før
til_text.text etc..
Hvis du får en undefined elign. så har den jo altså ikke dataen når den når sætningen og derfor viser den bare variablerne.
Du kan måske klare det ved at flyttet dit text felt i et kort øjeblik, - dvs. som udgangspunkt skrive:

til_text._x = 2000
så har vi flyttet feltet væk fra brugerens sysfelt, - der hvor de efterfølgende dele, som jo virker, kommer skriver du så:
til_text._x = den oprindelige x værdi, -

jeg vil tror at det virker, - selvom det stinker lidt ;)

vh
KalleBalle

Du kan evt. sende mig hele scriptet hvis det stadig er et problem.

vh
KalleBalle

Hej igen kalleballe
Du er bare super hjælpsom og engageret. Fedt!

Mit projekt tager udgangspunkt i denne tutorial:
http://www.kirupa.com/developer/mx2004/xml_flash_photogallery.htm

Men jeg ville gerne kunne samle forskellige billedserier i samme xml dokument.
Det fik jeg løst her:
http://www.eksperten.dk/spm/717566

Så kom så næste ønske om CSS´en som du blev involveret i. Og nu er den ved at være i mål med undtagelse af det allersidste som beskrevet 10/8. Du har sikkert ret i at jeg loader det hele på en uhensigtsmæssig måde. Sådan er det nok når en amatør actionscripter som mig er i sving...men meningen og hensigten er god nok.
Hvis du kan se mening i at gøre det anderledes ..og har lyst til at komme med et forslag er det sføli´sypærb.
Jeg har dette script på de frames der skal loade en billedserie (med variation i xml niveauet):


var myCSS = new TextField.StyleSheet();
var cssURL = "./flash/styles.css";

function loadXML(loaded) {
    if (loaded) {
        image = [];
        description = [];
        vejltext = [];
        xmlNode = this.firstChild;
        subtotal = xmlNode.childNodes.length;
        total = 0;
        for (i=0; i<subtotal; i++) {
                if(xmlNode.childNodes[i].attributes["niveau"] == "1") {
                    image[total] = xmlNode.childNodes[i].childNodes[0].firstChild.nodeValue;
                    description[total] = xmlNode.childNodes[i].childNodes[1].firstChild.nodeValue;
                    vejltext[total] = xmlNode.childNodes[i].childNodes[2].firstChild.nodeValue;
                    total++;
                }
        }
       
   
myCSS.load(cssURL);

myCSS.onLoad = function(success) {
  if (success) {
   
    desc_txt.styleSheet = myCSS;
    desc_txt.text = "<span class='overskrift'>"+description[p]+"</span>";
    til_text.styleSheet = myCSS;
    til_text.text = "<span class='vejledningstekst'>"+vejltext[p]+"</span>";
   
  }
};
        firstImage();
    } else {
        content = "file not loaded!";
    }
}
xmlData = new XML();
xmlData.ignoreWhite = true;
xmlData.onLoad = loadXML;
xmlData.load("./xml/content.xml");
/////////////////////////////////////
listen = new Object();
listen.onKeyDown = function() {
    if (Key.getCode() == Key.LEFT) {
        prevImage();
    } else if (Key.getCode() == Key.RIGHT) {
        nextImage();
    }
};
Key.addListener(listen);
previous_btn.onRelease = function() {
    prevImage();
};
next_btn.onRelease = function() {
    nextImage();
};
/////////////////////////////////////
p = 0;
this.onEnterFrame = function() {
    filesize = picture.getBytesTotal();
    loaded = picture.getBytesLoaded();
    preloader._visible = true;
    if (loaded != filesize) {
        preloader.preload_bar._xscale = 100*loaded/filesize;
    } else {
        preloader._visible = false;
        if (picture._alpha<100) {
            picture._alpha += 10;
        }
    }
};
function nextImage() {
    if (p<(total-1)) {
        p++;
        if (loaded == filesize) {
            picture._alpha = 0;
            picture.loadMovie(image[p], 1);
            desc_txt.text = "<span class='overskrift'>"+description[p]+"</span>";
            til_text.text = "<span class='vejledningstekst'>"+vejltext[p]+"</span>";
            picture_num();
        }
    }
}
function prevImage() {
    if (p>0) {
        p--;
        picture._alpha = 0;
        picture.loadMovie(image[p], 1);
        desc_txt.text = "<span class='overskrift'>"+description[p]+"</span>";
        til_text.text = "<span class='vejledningstekst'>"+vejltext[p]+"</span>";
        picture_num();
    }
}
function firstImage() {
    if (loaded == filesize) {
        picture._alpha = 0;
        picture.loadMovie(image[0], 1);
        desc_txt.text = "<span class='overskrift'>"+description[0]+"</span>";
        til_text.text = "<span class='vejledningstekst'>"+vejltext[0]+"</span>";
        picture_num();
    }
}
function picture_num() {
    current_pos = p+1;
    pos_txt.text = current_pos+" af "+total;
}

Hej, - fejlen er at du kalder firstImage() når du har loaded css, - du skal kalde firstImage() når du har loadet din xml data, - for så har description[0] værdi.

Nu har jeg ikke lige flash her, - men jeg vil mene at dette burde virke:

var myCSS = new TextField.StyleSheet();
var cssURL = "./flash/styles.css";

function loadXML(loaded) {
    if (loaded) {
        image = [];
        description = [];
        vejltext = [];
        xmlNode = this.firstChild;
        subtotal = xmlNode.childNodes.length;
        total = 0;
        for (i=0; i<subtotal; i++) {
                if(xmlNode.childNodes[i].attributes["niveau"] == "1") {
                    image[total] = xmlNode.childNodes[i].childNodes[0].firstChild.nodeValue;
                    description[total] = xmlNode.childNodes[i].childNodes[1].firstChild.nodeValue;
                    vejltext[total] = xmlNode.childNodes[i].childNodes[2].firstChild.nodeValue;
                    total++;
                }

firstImage();
        }
       
   
myCSS.load(cssURL);

myCSS.onLoad = function(success) {
  if (success) {
   
    desc_txt.styleSheet = myCSS;
    desc_txt.text = "<span class='overskrift'>"+description[p]+"</span>";
    til_text.styleSheet = myCSS;
    til_text.text = "<span class='vejledningstekst'>"+vejltext[p]+"</span>";
   
  }
};
xmlData = new XML();
xmlData.ignoreWhite = true;
xmlData.onLoad = _root.loadXML;
xmlData.load("./xml/content.xml");     



    } else {
        content = "file not loaded!";
    }
}

/////////////////////////////////////
listen = new Object();
listen.onKeyDown = function() {
    if (Key.getCode() == Key.LEFT) {
        prevImage();
    } else if (Key.getCode() == Key.RIGHT) {
        nextImage();
    }
};
Key.addListener(listen);
previous_btn.onRelease = function() {
    prevImage();
};
next_btn.onRelease = function() {
    nextImage();
};
/////////////////////////////////////
p = 0;
this.onEnterFrame = function() {
    filesize = picture.getBytesTotal();
    loaded = picture.getBytesLoaded();
    preloader._visible = true;
    if (loaded != filesize) {
        preloader.preload_bar._xscale = 100*loaded/filesize;
    } else {
        preloader._visible = false;
        if (picture._alpha<100) {
            picture._alpha += 10;
        }
    }
};
function nextImage() {
    if (p<(total-1)) {
        p++;
        if (loaded == filesize) {
            picture._alpha = 0;
            picture.loadMovie(image[p], 1);
            desc_txt.text = "<span class='overskrift'>"+description[p]+"</span>";
            til_text.text = "<span class='vejledningstekst'>"+vejltext[p]+"</span>";
            picture_num();
        }
    }
}
function prevImage() {
    if (p>0) {
        p--;
        picture._alpha = 0;
        picture.loadMovie(image[p], 1);
        desc_txt.text = "<span class='overskrift'>"+description[p]+"</span>";
        til_text.text = "<span class='vejledningstekst'>"+vejltext[p]+"</span>";
        picture_num();
    }
}
function firstImage() {
    if (loaded == filesize) {
        picture._alpha = 0;
        picture.loadMovie(image[0], 1);
        desc_txt.text = "<span class='overskrift'>"+description[0]+"</span>";
        til_text.text = "<span class='vejledningstekst'>"+vejltext[0]+"</span>";
        picture_num();
    }
}
function picture_num() {
    current_pos = p+1;
    pos_txt.text = current_pos+" af "+total;
}

altså, - du skal sørge for at data er loadet INDEN det skal vises ;)

vh

KalleBalle

Hej igen KB
Du har endnu engang ret! Jeg har dog ikke benyttet dit forslag helt som ovenfor, men ved at flytte CSS loadningen efter XML loadningen virker det fortrinligt.
Endnu engang 1000 tak!

Mvh
Jan

Selv tak, godt at du kunne bruge det ;)

vh

KalleBalle