Solved

Vertically Align Center Dynamic Text

Posted on 2003-11-14
4
277 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 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 500 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

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

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

Here are some practices and techniques that can be adopted into your Flash/Flex application development process. Note: Not all "performance tips" provide an immediately-recognizable benefit.   This article does not include timing validation data,…
I have found that much of my time doing support ends up being a constant repetition of the same steps to different people.  Early on I stated using web pages with Frequently Asked Questions (FAQs) to alleviate most of the burden.  Sometimes this jus…
The goal of the tutorial is to teach the user how to how to load their YouTube profile onto Flash Media Live Encoder.
The goal of the tutorial is to teach the user how to select the video input device. Make sure you have an input device that in connected and work and recognized by Adobe Flash Media Live Encoder and select it in the “video input” menu.

691 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