5 Replies Latest reply on Jul 27, 2007 1:53 PM by Newsgroup_User

    setting color and font

    westonwoodbury Level 1
      I need a way to set the properties of a text box--color and font of the text inside it--upon an event, wether it's in the timeline or off a button release or even LoadMovie would work. Is this possible?

      woodbury
        • 1. Re: setting color and font
          Level 7
          Hi woodbury,

          Whether in your onPress handler or LoadMovie, create a TextFormat
          instance and assign it to the text field. Make sure you set all the
          properties you want to set before setting the format. For example:

          myButton.onPress=function() {
          var myFormat=new TextFormat();
          myFormat.font="Arial";
          myFormat.color=0xFF0000;
          this._parent.textField.setTextFormat(myFormat);
          }

          This is just an example but you should be able to work it into whatever
          you need.

          Regards,
          Patrick

          ---
          http://www.baynewmedia.com

          Faster, easier, better...ActionScript development taken to new heights.

          Download the BNMAPI today. You'll wonder how you ever did without it!

          Available for ActionScript 2.0/3.0.

          Firstodd wrote:
          > I need a way to set the properties of a text box--color and font of the text
          > inside it--upon an event, wether it's in the timeline or off a button release
          > or even LoadMovie would work. Is this possible?
          >
          > woodbury
          >


          --

          • 2. Re: setting color and font
            westonwoodbury Level 1
            That works great, on both input text and dynamic text. Thanks a bunch!
            • 3. Re: setting color and font
              Level 7
              My pleasure. One note of warning...unless you're using standard fonts
              that appear on all computers (Macs/PCs/Linux boxes), using non-standard
              fonts will only work on computers that actually have those fonts unless
              you dynamically embed them. For example, "Arial" is a nice safe font as
              is "Times New Roman". However, using "ComicBookGuy12" (for example) will
              probably not display anywhere except on your computer. You can embed
              fonts with your SWF but that's much more complex. If you need it, I can
              walk you through it. Otherwise, just be aware of this.

              Patrick

              Firstodd wrote:
              > That works great, on both input text and dynamic text. Thanks a bunch!

              --
              http://www.baynewmedia.com
              Faster, easier, better...ActionScript development taken to new heights.
              Download the BNMAPI today. You'll wonder how you ever did without it!
              Available for ActionScript 2.0/3.0.
              • 4. setting color and font
                westonwoodbury Level 1
                Actually, I did this to embed the fonts I wanted (they are all non-standard):

                The buttons to pick the fonts are broken down, so graphic and not text. Off the the side, out of the canvas, I made a text box for each font I wanted, and put a letter in each, anything would work. I applied the font to each of these letters/text boxes, and then on the properties, I clicked the "Embed..." button, and ctrl-selected "uppercase" "lowercase" "numerals" & "punctuation", for each font on each text box.

                Works great, the dynamic text that the user types in changes font and color correctly using the script you gave me, even on computers that don't have those ornamental fonts installed.

                --

                However, I do have a couple questions that any advice would be appreciated...

                1. When the playing the .swf (which is just 1 frame stopped), the buttons that change the font and color of the named dynamic box--they have to be pressed twice the first time to apply it to the text. But after it's been applied, and you change it, one click will do to get it back to that color again. I can't figure out what would be causing this. My scripts are all clones of this:
                on (release) {
                blackjack.onPress = function() {
                var myFormat = new TextFormat();
                myFormat.font = "BlackJack";
                this._parent.field.setTextFormat(myFormat);
                };
                }

                changed accordingly for the color buttons.

                2. My next step on this is to, upon the push of a button, extract the information of the instanced text box. As you can see, I named it "field". I don't know where to start with the script for these kinds of things. Properties... I mean what the user has typed, it's color, and it's font.
                Actually, this needs to go to some sort of check out system, which I'm not familiar with at all, so I'm not expecting a walk through setting it up, just some direction if you could =).

                Thanks again

                Woodbury
                • 5. Re: setting color and font
                  Level 7
                  Hi Firstodd,

                  1. Try re-assigning the text after you set the format:

                  blackjack.onPress = function() {
                  var oldText=this._parent.field.text;
                  var myFormat = new TextFormat();
                  myFormat.font = "BlackJack";
                  this._parent.field.setTextFormat(myFormat);
                  this._parent.field.text=oldText;
                  };

                  I haven't played around with the AS3.0 enough yet but I know that the
                  2.0 one applies changes to new text so you need to add "new" text to the
                  field by recopying the existing text. Basically...rewrite the text with
                  the new format.

                  2. Your formats are stored in the text field's format property. You can
                  either keep a reference to the original format you created ('myFormat'
                  above), or use:

                  var myFormat=this._parent.field.getTextFormat();

                  The text format has a variety of properties you can read such as font,
                  size, color, and so on. Have a look at the TextFormat class reference in
                  the Flash help. Most of these are completely optional so you can
                  set/read whatever you want.

                  About the text, you simply read or write to the field's text property
                  like we did in example 1:

                  this._parent.field.text="This is new text";
                  var fieldText=this._parent.field.text;

                  If you want the user to be able to input text into the field, make it an
                  input field:

                  this._parent.field.type='input';

                  Otherwise, it's just dynamic:

                  this._parent.field.type='dynamic';

                  Do you want it selectable?

                  this._parent.field.selectable=true;

                  If it's tall enough to support multiple lines, do you want multiline
                  support?

                  this._parent.field.multiline=true;

                  Automatic line wrapping on lines?

                  this._parent.field.wordWrap=true;

                  You can get even lower-level if you want. You can monitor what the user
                  types character by character (assuming this is AS2.0):

                  function onFieldChanged(fieldRef:TextField) {
                  trace ('Field now has text: '+fieldRef.text);
                  }

                  this._parent.field.onChanged=this.onFieldChanged;

                  A field can also cut off if you exceed the available area. You can set
                  auto-sizing so that the field adjusts itself to what you type:

                  this._parent.field.autoSize='left';
                  //Use 'center' to keep the text aligned to the center of the field, and
                  'right' for right alignment.

                  Dimensions of the typed text, in pixels, can be obtained through:

                  this._parent.field.textWidth;
                  and
                  this._parent.field.textHeight;

                  (You can get the dimensions of the field using _width and _height but
                  this is the field size, including borders).

                  Speaking of borders:

                  this._parent.field.border=true;

                  And background...

                  this._parent.field.backgroundColor=0x00FF00; //green backrgound
                  this._parent.field.background=true; //turn it on

                  I could go on for pages...have a look at the TextField class to see
                  everything else you can grab.

                  The TextField class is the actual field...TextFormat is the optional
                  format that's applied to the text.

                  Hope that helps,
                  patrick


                  Firstodd wrote:
                  > Actually, I did this to embed the fonts I wanted (they are all non-standard):
                  >
                  > The buttons to pick the fonts are broken down, so graphic and not text. Off
                  > the the side, out of the canvas, I made a text box for each font I wanted, and
                  > put a letter in each, anything would work. I applied the font to each of these
                  > letters/text boxes, and then on the properties, I clicked the "Embed..."
                  > button, and ctrl-selected "uppercase" "lowercase" "numerals" & "punctuation",
                  > for each font on each text box.
                  >
                  > Works great, the dynamic text that lets the user types in changes fonts and
                  > colors correctly using the script you gave me, even on computers that don't
                  > have those ornamental fonts installed.
                  >
                  > --
                  >
                  > However, I do have a couple questions that any advice would be appreciated...
                  >
                  > 1. When the playing the .swf (which is just 1 frame stopped), the buttons that
                  > change the font and color of the named dynamic box--they have to be pressed
                  > twice the first time to apply it to the text. But after it's been applied, and
                  > you change it, one click will do to get it back to that color again. I can't
                  > figure out what would be causing this. My scripts are all clones of this:
                  > on (release) {
                  > blackjack.onPress = function() {
                  > var myFormat = new TextFormat();
                  > myFormat.font = "BlackJack";
                  > this._parent.field.setTextFormat(myFormat);
                  > };
                  > }
                  >

                  > changed accordingly for the color buttons.
                  >
                  > 2. My next step on this is to, upon the push of a button, extract the
                  > information of the instanced text box. As you can see, I named it "field". I
                  > don't know where to start with the script for these kinds of things.
                  > Properties... I mean what the user has typed, it's color, and it's font.
                  > Actually, this needs to go to some sort of check out system, which I'm not
                  > familiar with at all, so I'm not expecting a walk through setting it up, just
                  > some direction if you could =).
                  >
                  > Thanks again
                  >
                  > Woodbury
                  >

                  --
                  http://www.baynewmedia.com
                  Faster, easier, better...ActionScript development taken to new heights.
                  Download the BNMAPI today. You'll wonder how you ever did without it!
                  Available for ActionScript 2.0/3.0.