Welcome to TalkGraphics.com
Page 1 of 2 12 LastLast
Results 1 to 10 of 13
  1. #1
    Join Date
    May 2016
    Posts
    4

    Default How do you align text in a NavBar so they align centres vertically?

    Hi,

    Using Xara Web Designer Premium [12.2.0.45774 DL x64]

    I've got a NavBar which wouldn't fit on the page. To shorten it, I made some of the menu options two lines of text.

    E.G.

    Click image for larger version. 

Name:	NavBarMenu-misaligned.png 
Views:	361 
Size:	14.8 KB 
ID:	114844

    I ungrouped the NavBar, and vertically aligned the button text:

    Click image for larger version. 

Name:	NavBar-VerticallyAlignedMenu.png 
Views:	370 
Size:	8.0 KB 
ID:	114845

    which produced:

    Click image for larger version. 

Name:	NavBarMenu-VAligned.png 
Views:	354 
Size:	14.8 KB 
ID:	114847


    But, when re-grouping the NavBar using Arrange | Create Navigation Bar WebDesigner prompts with 4 options to use as a template for the rest of the buttons.

    Click image for larger version. 

Name:	NavBarMenu - Create NavBar.png 
Views:	358 
Size:	15.0 KB 
ID:	114846

    The problem is, regardless of which of the 4 options that are used, after having aligned all the text so they're centred, the "Create Navigation Bar" breaks the vertical text alignment, as it uses either the first button or the second button as the placement for the rest of the buttons.

    Is there any way of getting the NavBar to keep vertically-aligned-text so it looks like this?:

    Click image for larger version. 

Name:	NavBarMenu-VAligned.png 
Views:	354 
Size:	14.8 KB 
ID:	114847


    Many thanks!

  2. #2
    Join Date
    Apr 2012
    Location
    SW England
    Posts
    18,448

    Default Re: How do you align text in a NavBar so they align centres vertically?

    Edit the NavBar (Ungroup to edit graphics).
    Select the Text Tool.
    For each button, change to Centred Text.
    Relink the Navbar. (Create Navigation bar).

    Most horizontal NavBars have centred text already.

    Acorn
    Acorn - installed Xara software: Cloud+/Pro+ and most others back through time (to CC's Artworks). Contact for technical remediation/consultancy for your web designs.
    When we provide assistance, your responses are valuable as they benefit the community. TG Nuggets you might like. Report faults: Xara Cloud+/Pro+/Magix Legacy; Xara KB & Chat

  3. #3
    Join Date
    May 2016
    Posts
    4

    Default Re: How do you align text in a NavBar so they align centres vertically?

    Quote Originally Posted by Acorn View Post
    Edit the NavBar (Ungroup to edit graphics).
    Select the Text Tool.
    For each button, change to Centred Text.
    Relink the Navbar. (Create Navigation bar).

    Most horizontal NavBars have centred text already.

    Acorn
    Thank you for the reply..

    Apologies if I'm being particularly dim here, but I don't seem to be able to follow your instructions.

    1. Edit the NavBar and Ungroup so I can edit the graphics - not a problem.
    2. Select the Text Tool - not a problem
    3. For each button, change to Centred Text - ?

    Could you expand on how to do this please?

    So, with the Text Tool selected, I click on the first button text - but where is the menu option to "centre text"?

    Are you referring to the Centre Justify option:

    Name:  Xara_TextTool_CentreAlign.png
Views: 546
Size:  890 Bytes

    because that only centres the text on the horizonal plane (centring between a left and right position)


    The problem I'm having is centring vertically (centred between a top and bottom position).


    I've tried using the Object Alignment tool (as shown in the original post) (CTRL+SHIFT+L) which works perfectly until you Relink the NavBar.

    It's the ReLinking of the NavBar: Arrange | Create Navigation Bar that's the problem - it uses the first button as a template for the rest of the buttons undoing the vertical centring.

    The Create Navigation Bar dialog that shows the 4 options (see original post) actually shows the problem in the 4 choices where it states: Design of 1st/2nd button is REPLICATED for all other buttons.


    Unless I'm missing something obvious (which is quite likely), I can't fathom out how to do what you're suggesting in your post. Could you spell out how to get Vertical Centring to work so that using Arrange | Create Navigation Bar doesn't mess it up?

    Is there an option other than Arrange | Create Navigation Bar to "relink" the NavBar?

    Many thanks

  4. #4
    Join Date
    Apr 2012
    Location
    SW England
    Posts
    18,448

    Default Re: How do you align text in a NavBar so they align centres vertically?

    You didn't miss anything - I misread your ask and totally blanked out the vertical!

    Create three lines in a text area by setting up three dots return three dots return three dots.
    Select the second and third lines and set the line spacing to 50%.

    For a single line of text use the middle line; for two lines use the first and last lines.
    Remove all spurious dots but keep the returns.

    Quite a fudge but might help you.

    Fingers crossed and someone else will come up with a better solution.

    Acorn
    Acorn - installed Xara software: Cloud+/Pro+ and most others back through time (to CC's Artworks). Contact for technical remediation/consultancy for your web designs.
    When we provide assistance, your responses are valuable as they benefit the community. TG Nuggets you might like. Report faults: Xara Cloud+/Pro+/Magix Legacy; Xara KB & Chat

  5. #5
    Join Date
    Aug 2000
    Location
    Placitas, New Mexico, USA
    Posts
    41,650

    Default Re: How do you align text in a NavBar so they align centres vertically?

    Welcome to TalkGraphics

    You need to manually center the text on the button (Arrange > Alignment)

    However, I don't think it is possible to have two lines of centered text on a button.

    But, you can create a master button with mouseoff and mouseover states, Arrange > Apply Soft Group, then duplicate the buttons and change the text as needed.

    Link each button to the appropriate page.
    Attached Thumbnails Attached Thumbnails Click image for larger version. 

Name:	align.png 
Views:	321 
Size:	10.4 KB 
ID:	114852  

  6. #6
    Join Date
    May 2016
    Posts
    4

    Default Re: How do you align text in a NavBar so they align centres vertically?

    Quote Originally Posted by Acorn View Post
    You didn't miss anything - I misread your ask and totally blanked out the vertical!

    Create three lines in a text area by setting up three dots return three dots return three dots.
    Select the second and third lines and set the line spacing to 50%.

    For a single line of text use the middle line; for two lines use the first and last lines.
    Remove all spurious dots but keep the returns.

    Quite a fudge but might help you.

    Fingers crossed and someone else will come up with a better solution.

    Acorn
    Many thanks Acorn - I was thinking along "fudging it" lines, and wanted to make sure I wasn't missing an obvious "this is how it's done" first.

    I really appreciate you taking the time to reply. Thank you.

  7. #7
    Join Date
    May 2016
    Posts
    4

    Default Re: How do you align text in a NavBar so they align centres vertically?

    Quote Originally Posted by gwpriester View Post
    Welcome to TalkGraphics

    You need to manually center the text on the button (Arrange > Alignment)

    However, I don't think it is possible to have two lines of centered text on a button.

    But, you can create a master button with mouseoff and mouseover states, Arrange > Apply Soft Group, then duplicate the buttons and change the text as needed.

    Link each button to the appropriate page.

    Thanks for your reply gwpriester.

    Yea.. I did ungroup the navbar, and use the Vertical Alignment tool and managed to get them all nicely lined up (as shown in the pictures I included in my original post).
    They all line up perfectly centred on the vertical access. I see no reason why they shouldn't as it's just taking the midline and putting it mid-way between a top and bottom point! That's exactly what the vertical alignment tool is for, right!

    Then you say "However, I don't think it is possible to have two lines of centred text on a button".

    When you say this, do you mean "I don't think it is possible to have to lines of centred text on a button along with one single line because the Create Navigation Bar option destroys it"?

    If ALL my button texts were 2 lines in height, there'd be no problem at all.

    When you say "but you can create a master button with m_on/m_over states, Arrange>Apply Soft Group and duplicate as needed, linking each button to the appropriate page" are you saying it doesn't have to be a NavBar?

    If so, then that might be another way of doing it. Sticky and so on should still work with that.. let's give that a go (if I understand what you're saying correctly).

    Can't believe such a simple thing isn't catered for in the Create NavBar functionality!

    Many thanks to yourself and to everyone that has replied.

  8. #8
    Join Date
    Apr 2012
    Location
    SW England
    Posts
    18,448

    Default Re: How do you align text in a NavBar so they align centres vertically?

    It turns out to be fascinating as to what you can and cannot do.

    @GaryP - you can always add a second line with the Text Tool directly to the "simple text", even when the NavBar is fully grouped.
    What you cannot do is add it through the Edit NavBar window, which ignores line feeds.


    @delver - you have found a weakness in Xara'a approach to text boxes, which are no use here as only "simple text" is allowed.
    I will raised this as a general text feature request. It probably will not not percolate through to NavBars through.

    I build my own NavBars from Buttons and Layers - much more control - images, different rollover effects, different styles of menus.
    I also prefer using CSS NavBars over Xara' solution as an alternative.

    Acorn
    Acorn - installed Xara software: Cloud+/Pro+ and most others back through time (to CC's Artworks). Contact for technical remediation/consultancy for your web designs.
    When we provide assistance, your responses are valuable as they benefit the community. TG Nuggets you might like. Report faults: Xara Cloud+/Pro+/Magix Legacy; Xara KB & Chat

  9. #9
    Join Date
    Aug 2000
    Location
    Placitas, New Mexico, USA
    Posts
    41,650

    Default Re: How do you align text in a NavBar so they align centres vertically?

    @GaryP - you can always add a second line with the Text Tool directly to the "simple text", even when the NavBar is fully grouped.
    What you cannot do is add it through the Edit NavBar window, which ignores line feeds.
    Smack upside the head! I thought there was a way but I totally forget editing the lines of text on the button. That said, do the edits retain the text being centered on the button. And I guess I know the answer. Just try it out.

    AND THE ANSWER IS? It works. Preview attached.
    Attached Files Attached Files
    Last edited by gwpriester; 29 October 2016 at 07:44 PM.

  10. #10
    Join Date
    Mar 2009
    Posts
    4,522

    Default Re: How do you align text in a NavBar so they align centres vertically?

    Something is wrong with the second line of the mouse-over of some of the buttons. Tried to correct it but didn't succeed and getting internal error messages.

 

 

Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •