How to stretch toolbar & menus?

7 posts, 0 answers
  1. Thierry Fierens
    Thierry Fierens avatar
    6 posts
    Member since:
    Dec 2005

    Posted 15 Mar 2009 Link to this post

    Hi,

    I was wondering if there was a way to stretch the toolbar & menu bar all the way across a page even if the toolbar/menubar is not fully filled with buttons? It may contain New, Update & Delete buttons for example but I still want the handles & background to be stretch across the entire width of my page.

    Can you help?

    Thanks.

    T.
  2. Boyan
    Admin
    Boyan avatar
    758 posts

    Posted 16 Mar 2009 Link to this post

    Hi Thierry ,

      You don't need to do anything to stretch RadToolbar or RadMenu as the default for them i s to stretch across the whole page. Just make sure that you have set HorizontalAlignment to "Stretch" or not set it at all as stretch is the default . If you set it to "Left" or "Center" the item won't stretch across the whole width of the page. Also make sure that you have not set specific Width and it is set to Auto or not set at all. Hope that helps.

    Kind regards,
    Boyan
    the Telerik team


    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  3. DevCraft banner
  4. Thierry Fierens
    Thierry Fierens avatar
    6 posts
    Member since:
    Dec 2005

    Posted 16 Mar 2009 Link to this post

    Hi Boyan,

    Thanks for the reply. Unless I missed it, it did not work for me. Below is the code I'm just playing with:

      <telerikNavigation:RadToolBarTray x:Name="mainMenuTray" Grid.Row="1">
        <telerikNavigation:RadToolBarTray.Background>
         <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
          <GradientStop Color="#FF282929" />
          <GradientStop Color="#FF55565b" Offset="1" />
         </LinearGradientBrush>
        </telerikNavigation:RadToolBarTray.Background>
        <telerikNavigation:RadToolBar x:Name="toolbarMenu" Band="0" BandIndex="0">
         <telerikNavigation:RadMenu VerticalAlignment="Top" HorizontalAlignment="Left"
          x:Name="mainMenu" ClickToOpen="True">
          <telerikNavigation:RadMenuItem x:Name="MenuFile" Header="File">
           <telerikNavigation:RadMenuItem x:Name="mnuCompanyAdd" Header="Add" Click="mnuCompanyAdd_Click">
            <telerikNavigation:RadMenuItem.Icon>
             <Image Source="/Images/CompanyAdd16.png" />
            </telerikNavigation:RadMenuItem.Icon>
           </telerikNavigation:RadMenuItem>
           <telerikNavigation:RadSeparator />
           <telerikNavigation:RadMenuItem x:Name="mnuCompanyUpdate" Header="Update" Click="mnuCompanyUpdate_Click">
            <telerikNavigation:RadMenuItem.Icon>
             <Image Source="/Images/CompanyUpdate16.png" />
            </telerikNavigation:RadMenuItem.Icon>
           </telerikNavigation:RadMenuItem>
                                <telerikNavigation:RadSeparator />
           <telerikNavigation:RadMenuItem x:Name="mnuCompanyDelete" Header="Delete" Click="mnuCompanyDelete_Click">
            <telerikNavigation:RadMenuItem.Icon>
             <Image Source="/Images/CompanyDelete16.png" />
            </telerikNavigation:RadMenuItem.Icon>
           </telerikNavigation:RadMenuItem>
                                <telerikNavigation:RadSeparator />
           <telerikNavigation:RadMenuItem x:Name="mnuCompanyClose" Header="Close" Click="mnuCompanyClose_Click">
            <telerikNavigation:RadMenuItem.Icon>
             <Image Source="/Images/Close16.png" />
            </telerikNavigation:RadMenuItem.Icon>
           </telerikNavigation:RadMenuItem>
          </telerikNavigation:RadMenuItem>
         </telerikNavigation:RadMenu>
        </telerikNavigation:RadToolBar>      
      </telerikNavigation:RadToolBarTray>
      <telerikNavigation:RadToolBarTray x:Name="mainToolbarTray" Grid.Row="2" >
        <telerikNavigation:RadToolBarTray.Background>
         <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
          <GradientStop Color="#FF282929" />
          <GradientStop Color="#FF55565b" Offset="1" />
         </LinearGradientBrush>
        </telerikNavigation:RadToolBarTray.Background>
        <telerikNavigation:RadToolBar x:Name="toolbarDocument" Band="0" BandIndex="1">
         <Button Click="btnCompanyAdd_Click" Tag="CompanyAdd" x:Name="btnCompanyAdd"
          ToolTipService.ToolTip="Create a new company">
          <StackPanel Orientation="Horizontal">
           <Image HorizontalAlignment="Center" VerticalAlignment="Center"
            Source="/Images/CompanyAdd16.png" />
            <TextBlock Text="Add" />
          </StackPanel>
         </Button>
         <Button Click="btnCompanyUpdate_Click" Tag="CompanyUpdate" x:Name="btnCompanyUpdate"
          ToolTipService.ToolTip="Update an existing company">
          <StackPanel Orientation="Horizontal">
           <Image HorizontalAlignment="Center" VerticalAlignment="Center"
            Source="/Images/CompanyUpdate16.png" />
            <TextBlock Text="Update" />
          </StackPanel>
         </Button>
         <Button Click="btnCompanyDelete_Click" Tag="CompanyDelete" x:Name="btnCompanyDelete"
          ToolTipService.ToolTip="Delete an existing company">
          <StackPanel Orientation="Horizontal">
           <Image HorizontalAlignment="Center" VerticalAlignment="Center"
            Source="/Images/CompanyDelete16.png" />
            <TextBlock Text="Delete" />
          </StackPanel>
         </Button>
        </telerikNavigation:RadToolBar>    
      </telerikNavigation:RadToolBarTray>

    I've uploaded a snapshot for your convenience - http://www.mansfieldart.com/snapprob1.jpg

    Any ideas? Have I missed what you suggested or something else?

    Thanks.

    T.

  5. Ivan
    Admin
    Ivan avatar
    519 posts

    Posted 18 Mar 2009 Link to this post

    Hi Thierry,

    Currently the tray's layout mechanism does not respect RadToolBar 's HorizontalAlignment property. This bug is scheduled to be fixed for the upcoming Service Pack. Fortunately, you can simulate the correct behavior (until the Serice Pack is released) via a toolbar inside a grid and the HorizontalAlignment property (as Boyan suggested) - attached you can find an application that demonstates this technique.

    PS: In the example you sent us you can use only one ToolBarTray - the toolbar's layout respects the Band and the BandIndex properties.

    Sincerely yours,
    Ivan
    the Telerik team


    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  6. Thierry Fierens
    Thierry Fierens avatar
    6 posts
    Member since:
    Dec 2005

    Posted 20 Mar 2009 Link to this post

    Hi Gents,

    Sorry about the delay getting back to you, I never got notified and I only went to check the forum tonight.

    Removing the telerikNavigation:RadToolBarTray and replacing it by a grid did the trick, so thanks for all your help.

    Regards,

    T.
  7. Leon
    Leon avatar
    16 posts
    Member since:
    Jun 2010

    Posted 09 Nov 2010 Link to this post

    Hey All,

    Has this issue been addressed in the current release (2010.2.0924.1030)?

    I need to leverage the RadToolBarTray as I need to create the toolbar's dynamically and they need to change/re-arrange when the size of the main window is changed.

    Thanks

    Leon
  8. Viktor Tsvetkov
    Admin
    Viktor Tsvetkov avatar
    382 posts

    Posted 12 Nov 2010 Link to this post

    Hi Leon,

    I have added this issue in our PITS under the name "ToolBar: ToolBarTray doesn't respect ToolBar's HorizontalAlignment property" and we will consider fixing it for Q3 SP1.

    Sincerely yours,
    Viktor Tsvetkov
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
Back to Top
DevCraft banner