Search code examples
c#wpf.net-3.5windows-7aero

Windows Explorer-like search box on Aero glass frame with WPF


I'm extending the Aero glass frame into the client area and want to place a search box on the extended frame, just like it Windows Explorer does:

Windows Explorer Search Box

The default WPF text box has a grey/blue border though, and not the dark, white glowing border that can be seen on the screenshot. How do I change the WPF text box to use the same style as the Windows Explorer search box?


Solution

  • This is my attempt to recreate the look of the Windows Explorer search box in WPF:

    WPF solution compared to original

    It doesn't look 100% like the original, but it's pretty close.

    Here's the code:

    <Border BorderBrush="#40FFFFFF" BorderThickness="1" CornerRadius="2">
      <Border BorderBrush="#80000000" BorderThickness="1,1,0,0" CornerRadius="2">
        <Border BorderBrush="#30000000" BorderThickness="0,0,1,1" CornerRadius="2">
          <Border BorderBrush="#F0FFFFFF" BorderThickness="1" CornerRadius="1">
            <TextBox Background="#C0FFFFFF" BorderThickness="0"></TextBox>
          </Border>
        </Border>
      </Border>
    </Border>