wpf - Giving a stackPanel the same LinearGradientBrush as the toolbar has by default


Question: 

I have two ToolBars side by side (I had to do that so I could align buttons right and left) But now, I have to add some text that can be aligned right left or center between both toolbars. I added the text in a TextBlock inside a StackPanel disposed on a Grid at the second position (between the toolbars) and, of course, it created a gap between both toolbars (A stackPanel doesn't have the same style as a toolbar, of course).

I would like to replicate the toolbar LinearGradientBrush on my stackpanel so it looks the same as my toolbar does. the point is to make the thing look like ONE toolbar.

Is there a way to get the ToolBar Style or to recreate it with a LinearGradientBrush definition, and if so, how?




3 Answers: 

Here's one way you could do it. Say one of your toolbars' name is "toolBar." Bind the Background property on the StackPanel to the Background property on the ToolBar as such:

<StackPanel Background="{Binding Path=Background, ElementName=toolBar}" />

Hope that helps! :)

EDIT:

You can check out the control template for the ToolBar here.

The LinearGradientBrush used looks as such:

<LinearGradientBrush x:Key="DarkBrush" StartPoint="0,0" EndPoint="0,1">
  <GradientBrush.GradientStops>
    <GradientStopCollection>
      <GradientStop Color="#FFF" Offset="0.0"/>
      <GradientStop Color="#AAA" Offset="1.0"/>
    </GradientStopCollection>
  </GradientBrush.GradientStops>
</LinearGradientBrush>

In the event you just wanted to use this instead of binding. :)

 

The default templates and styles are available on MSDN, you could probably extract the relevant bits from there.

 

I found an issue when doing this exact same thing in an application. When running the same application on an XP machine as I did a Vista machine, I found that there was a 2 pixel difference in the height between the two toolbars.

To get around this, I ended up creating one StackPanel which housed the two tool bar objects (setting the background to be transparent).

This ensured that the look and feel was the same between the two OS's (at the time the company was running both) and will also aid you in the event that one of your toolbars grow in height without the other.

 

More Articles


android - Single Activity and Multiple Fragment with different toolbar layouts

I have an app with Single Activity multiple Fragments architecture in my app. The problem is, there is one listing fragment with normal Toolbar, from here user can click and go to Details screen. Now in Details screen, I want the Activity to become Fullscreen with CoordinatorLayout and Collapsing To

c++ - MFC: How to save the position of toolbars in the legacy MFC ver 6?

I have a striking question: How to save the position of toolbars in the legacy MFC ver 6?I can't use CWinApp::SaveBarState because not all toolbars exist at the moment this function would be called (causing it to assert). Instead, I instantiate the toolbars depending on what kind of document is load

android - Different toolbar for each fragment in navigation drawer

I have a MainActivity which has a NavigationDrawer. This NavigationDrawer is Synced with the Toolbar initially. And i want to use the Only one NavigationDrawer across the whole Application. Now the Problem is that each fragment has the different toolbar or CollapsingToolbar.I already read the same


Smooth keydown animation on Canvas in JavaScript

I'm very new to programming and I'm trying to create some code that will allow me to move a square around the Canvas by pressing arrow keys. I'm able to get the square to move, but its motion isn't very smooth. I have it moving by increments of 10 pixels at a time, so I understand why it feels kind

android - hide toolbar when collapsing collapsingtoobarlayout

What I am trying to achieve is hide the collapsingtoolbarlayout when scrolling my recyclerview and collapse the maintoolbar if scrolled further. but I can achieve only upto this http://i.imgur.com/t6wTW5H.gif.<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="htt

formatting - Excel 2007 floating format toolbar customisation

Is it possible in Excel 2007 to customise the floating format bar that is shown when you right-click on a cell? To avoid confusion, I don't mean the "Cell" commandbar menu, but the second floating toolbar with formatting buttons.e.g. is it possible to add a Styles dropdown, or have any other text al


jquery - CSS for toolbar with UI Slider centered between left and right buttons

I'm attempting to create a 100% width toolbar. This toolbar needs to have a variable number of buttons aligned to the left side, as well as a variable number of buttons aligned to the right. That's the easy part.But now I want to put a jQuery UI slider in the center that takes up the full remaining

WPF c# window navigation

i got 2 window , i want to navigate from one another but i when i debug it , it shows that nav is null , why is that so? Does it suppose to be null? because i used the same way to navigate in the past and it work and i try it now , it doesn't work. But if i put nav == null , it says nav.Navigate(n

android - Horizontal and Vertical linear layout inside a scroll view

I am trying to get a combination of Views established. They must constantly have a Button and Edittext box at the top horizontally next to each other and below that a vertical list of Textviews. The vertical list should be enclosed in a ScrollView to allow the user to scroll down through the TextVie

WPF Frame Source Refreshing the Loaded Page

I've come across a strange scenario where a frame refuses to refresh its content.I can kinda understand what's happening but the solution is not coming to me.I have a page that has a frame (Frame1) and several buttons. When I click on a button a page is loaded into the frame. This works perfectly in