?
Solved

Vertically Align Center Dynamic Text

Posted on 2003-11-14
4
Medium Priority
?
283 Views
Last Modified: 2010-05-18
How do I vertically align center the text in this menu ?  http://dev.fusionapps.com/wboe/flash/right_nav/flashmenu.html

Here's the code so far:


data_var = new LoadVars();
data_var.path = this;
data_var.onLoad = function(ok)
{
     if(ok){
          this.path.menuGeneration(this);
     } else {
          trace("CFM PAGE MISSING");    
     }
};

function menuGeneration()
{
     var startY = 1, depth = 0;
     var temp = data_var.cats.split("|");
     var style1_fmt = new TextFormat("textFont", 13, 0x000000, false, false, false, "", "", "center");
     var style2_fmt = new TextFormat("textFont", 10, 0x000000, false, false, false, "", "", "left");
     for(var i = 0; i < temp.length; i++){
          var mc = this.createEmptyMovieClip("main" + depth, depth);
          depth++;
          mc.lineStyle(1, 0x912211, 100);
          mc.beginFill(0xFF0000, 20);
          mc.lineTo(198, 0);     mc.lineTo(198, 18);     mc.lineTo(0, 18);     mc.lineTo(0, 0);
          mc.endFill();
          mc.createTextField("text_txt", 1, 0, 0, 198, 18);
          mc.text_txt.selectable = false;
          mc.text_txt.embedFonts = true;
          mc.text_txt.text = temp[i];
          mc.text_txt.setTextFormat(style1_fmt);
          mc._x = 1;     mc._y = startY;
          startY += mc._height + 3;
          var subText = data_var["subcats" + i].split("|");
          var subLink = data_var["urls" + i].split("|");
          for(var j = 0; j < subText.length; j++){
               var sc = this.createEmptyMovieClip("sub" + depth, depth);
               depth++;
               sc.createTextField("text_txt", 3, 0, 0, 198, 18);
               sc.text_txt.multiline = true;
               sc.text_txt.wordWrap = true;
               sc.text_txt.autoSize = "left";
               sc.text_txt.selectable = false;
               sc.text_txt.embedFonts = true;
               sc.text_txt.text = subText[j];
               sc.text_txt.setTextFormat(style2_fmt);
               var hgt = sc.text_txt._height + 1 > 18 ? sc.text_txt._height + 1 : 18;
               sc.lineStyle(1, 0x912211, 100);
               sc.lineTo(198, 0);     sc.lineTo(198, hgt);     sc.lineTo(0, hgt);     sc.lineTo(0, 0);
               sc._x = 1;     sc._y = startY;
               startY += sc._height + 3;
               var lc = sc.createEmptyMovieClip("click_btn", 2);
               lc._x = lc._y = 1;
               lc.lineStyle(0, 0, 0);
               lc.beginFill(0xEDD593, 100);
               lc.lineTo(196, 0);     lc.lineTo(196, hgt - 2);     lc.lineTo(0, hgt - 2);     lc.lineTo(0, 0);
               lc.endFill();     lc._alpha = 0;
               lc.link = subLink[j];
               lc.onRollOut = lc.onDragOut = function()     {     this._alpha = 0;               };
               lc.onPress = lc.onDragOver = function()     {     this._alpha = 100;               };
               lc.onRelease = function()          {     this.getURL(this.link);          };
          }
     }
     delete data_var;
}
data_var.load("cats.cfm");
0
Comment
Question by:madasczik
  • 2
4 Comments
 
LVL 5

Expert Comment

by:zenlion420
ID: 9750870
>> sc.text_txt.autoSize = "left"

 sc.text_txt.autoSize = "center"  ?

I would just highlight the text and choose:

Text>Align>Center

or, select all text boxes and choose:

Modify>align>center vertically

Good luck,

j
0
 

Author Comment

by:madasczik
ID: 9753375
that's not what I was looking for, sc.text_txt.autoSize = "center" is for horizontal alignment, and I can't select and center the text because the text boxes are created dynamically. I messed around with the positioning of the text fields in the code to get it the text exactly where I wanted.  It was a real pain to get it just right, I guess what I want to do is find an easier way to do it.  Ideally I would like to make the border and the text field the same size and position and have some code that determines the height of the text in pixels and adjusts the variables I changed automatically so I don't need to spend so much time when I change the font.


Here's the changes I made:
data_var = new LoadVars();
data_var.path = this;
data_var.onLoad = function(ok)
{
     if(ok){
          this.path.menuGeneration(this);
     } else {
          trace("CFM PAGE MISSING");    
     }
};

function menuGeneration()
{
     var startY = 1, depth = 0;
     var temp = data_var.cats.split("|");
      
                     //new TextFormat([font, [size, [color, [bold, [italic, [underline, [url, [target, [align, [leftMargin, [rightMargin, [indent, [leading]]]]]]]]]]]]])
     var style1_fmt = new TextFormat("textFont", 14, 0x000000, bold, false, false, "", "", "center");
     var style2_fmt = new TextFormat("Verdana", 12, 0x000000, true, false, false, "", "", "left", "3", "5", "");
     for(var i = 0; i < temp.length; i++){
          var mc = this.createEmptyMovieClip("main" + depth, depth);
          depth++;
          mc.lineStyle(1, 0x912211, 100);
          mc.beginFill(0xEDD593, 100);
          mc.lineTo(198, 0);     mc.lineTo(198, 20);     mc.lineTo(0, 20);     mc.lineTo(0, 0);
          mc.endFill();
          mc.createTextField("text_txt", 1, 0, 0, 198, 20); //name, depth, x, y, width, height
          mc.text_txt.selectable = false;
          mc.text_txt.embedFonts = true;
          mc.text_txt.text = temp[i];
          mc.text_txt.setTextFormat(style1_fmt);
          mc._x = 1;     mc._y = startY;
          startY += mc._height + 4;
          var subText = data_var["subcats" + i].split("|");
          var subLink = data_var["urls" + i].split("|");
          for(var j = 0; j < subText.length; j++){
               var sc = this.createEmptyMovieClip("sub" + depth, depth);
               depth++;
               sc.createTextField("text_txt", 3, 0, 1, 198, 20);  //name, depth, x, y, width, height
               sc.text_txt.multiline = true;
               sc.text_txt.wordWrap = true;
               sc.text_txt.autoSize = "left";
               sc.text_txt.selectable = false;
               sc.text_txt.embedFonts = false;
               sc.text_txt.text = subText[j];
               sc.text_txt.setTextFormat(style2_fmt);
               var hgt = sc.text_txt._height + 2 > 20 ? sc.text_txt._height + 2 : 20;
               sc.lineStyle(1, 0x912211, 100);
               sc.lineTo(198, 0);     sc.lineTo(198, hgt);     sc.lineTo(0, hgt);     sc.lineTo(0, 0);
               sc._x = 1;     sc._y = startY;
               startY += sc._height + 4;
               var lc = sc.createEmptyMovieClip("click_btn", 2);
               lc._x = lc._y = 1;
               lc.lineStyle(0, 0, 0);
               lc.beginFill(0xEDD593, 100);
               lc.lineTo(197, 0);     lc.lineTo(197, hgt - 1);     lc.lineTo(0, hgt - 1);     lc.lineTo(0, 0);
               lc.endFill();     lc._alpha = 0;
               lc.link = subLink[j];
                     lc.onRollOver = function()     {     this._alpha = 100;               };
               lc.onRollOut = lc.onDragOut = function()     {     this._alpha = 0;               };
               lc.onPress = lc.onDragOver = function()     {     this._alpha = 100;               };
               lc.onRelease = function()          {     this.getURL(this.link);          };
                    
          }
     }
     delete data_var;
}
data_var.load("cats.cfm");

0
 
LVL 27

Expert Comment

by:negatyve
ID: 9753387
I don't understand the question. Do you want to center the text, or the buttons to dinamically resize to fit the font size?
0
 
LVL 27

Accepted Solution

by:
negatyve earned 2000 total points
ID: 9757346
let's try it. this resize all buttons according to given text size (try as you like):

data_var = new LoadVars();
data_var.path = this;
data_var.onLoad = function(ok)
{
      if (ok) {
            this.path.menuGeneration(this);
      } else {
            trace("CFM PAGE MISSING");
      }
};
function menuGeneration()
{
      var startY = 1, depth = 0;
      var temp = data_var.cats.split("|");
      //new TextFormat([font, [size, [color, [bold, [italic, [underline, [url, [target, [align, [leftMargin, [rightMargin, [indent, [leading]]]]]]]]]]]]])
      var style1_fmt = new TextFormat("textFont", "30", "0x000000", "bold", "false", "false", "", "", "center");
      var style2_fmt = new TextFormat("Verdana", "15", "0x000000", "true", "false", "false", "", "", "left", "3", "5", "");
      for (var i = 0; i < temp.length; i++) {
            if (depth > 0)startY += 30; // spacer
            var mc = this.createEmptyMovieClip("main" + depth, depth);
            //name, depth, x, y, width, height
            mc.createTextField("text_txt", "1", "0", "0", "198", "20");
            mc.text_txt.autoSize = "center";
            mc.text_txt.selectable = false;
            mc.text_txt.embedFonts = true;
            mc.text_txt.text = temp[i];
            mc.text_txt.setTextFormat(style1_fmt);
            mc.text_txt._height
            var hgt = mc.text_txt._height + 2; // > 20 ? sc.text_txt._height + 2 : 20;
            depth++;
            mc.lineStyle(1, 0x912211, 100);
            mc.beginFill(0xEDD593, 100);
            mc.lineTo(198, 0);            mc.lineTo(198, hgt);            mc.lineTo(0, hgt);            mc.lineTo(0, 0);
            mc.endFill();
            mc._x = 1;      mc._y = startY;
            startY += mc._height + 4;
            var subText = data_var["subcats" + i].split("|");
            var subLink = data_var["urls" + i].split("|");
            for (var j = 0; j < subText.length; j++) {
                  var sc = this.createEmptyMovieClip("sub" + depth, depth);
                  depth++;
                  sc.createTextField("text_txt", "3", "0", "1", "198", "20");
                  //name, depth, x, y, width, height
                  sc.text_txt.multiline = true;
                  sc.text_txt.wordWrap = true;
                  sc.text_txt.autoSize = "left";
                  sc.text_txt.selectable = false;
                  sc.text_txt.embedFonts = false;
                  sc.text_txt.text = subText[j];
                  sc.text_txt.setTextFormat(style2_fmt);
                  var hgt = sc.text_txt._height + 2;// > 20 ? sc.text_txt._height + 2 : 20;
                  sc.lineStyle(1, 0x912211, 100);
                  sc.lineTo(198, 0);            sc.lineTo(198, hgt);            sc.lineTo(0, hgt);            sc.lineTo(0, 0);
                  sc._x = 1;            sc._y = startY;
                  startY += sc._height + 4;
                  var lc = sc.createEmptyMovieClip("click_btn", 2);
                  lc._x = lc._y = 1;
                  lc.lineStyle(0, 0, 0);
                  lc.beginFill(0xEDD593, 100);
                  lc.lineTo(197, 0);      lc.lineTo(197, hgt - 1);      lc.lineTo(0, hgt - 1);            lc.lineTo(0, 0);
                  lc.endFill();
                  lc._alpha = 0;
                  lc.link = subLink[j];
                  lc.onRollOver = function()                              {      this._alpha = 100;            };
                  lc.onRollOut = lc.onDragOut = function ()      {      this._alpha = 0;            };
                  lc.onPress = lc.onDragOver = function ()      {      this._alpha = 100;            };
                  lc.onRelease = function()                              {      this.getURL(this.link);      };
            }
      }
      delete data_var;
}
data_var.load("cats.cfm");
0

Featured Post

Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

I have been doing hardcore actionscripting for some time; and needless to say I have faced a lot of problems in just understanding others' code rather than understanding what the code executes. A programmer's life can become hell when there are a lo…
While working over numerous projects I often had the requirement for doing a screen capture in AS3.0. Unfortunately I found no "ready made" solutions in google search that suited my requirements. But I did come across some great resources which help…
The goal of the tutorial is to teach the user how to select which audio input to use. Once you have an audio input plugged into the laptop or computer, you will go into the audio input settings and choose which audio input you want to use.
The goal of the tutorial is to teach the user what frame rate is, how to control it and what effect it has on the video.
Suggested Courses

807 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question