locked
DropShadow Effect in a metro app RRS feed

  • Question

  • Hello everybody,

    I am not able to find the Effect Property on any of the Metro Controls.

    Can someone tell me how to achive the DropShadow effect for a metro app as it was in Silverlight or Windows WPF application:

    <TextBox ...>
      <TextBox.Effect>
          <DropShadow />
      </TextBox.Effect>
    </TextBox>

    Regards,

    Steve

    Monday, March 26, 2012 10:07 PM

All replies

  • No effects in Metro XAML. You could use interop with DirectWrite/Direct2D to create text and apply d2d effect to it and then show result in your XAML app as image. That is not likely to be easy or useful in case of text input, since you have TextBox in your code sample. You could try to layer multiple TextBoxes bound to the same text to create fake shadow effect. 
    Tuesday, March 27, 2012 12:47 AM
  • so there is no way to set a DropShadow except the interop way?
    In the code above I did not necessarily mean TextBoxes.

    There are already apps in the Windows Store that use Images / Tiles with shadows.
    Tuesday, March 27, 2012 11:35 AM
  • You can make drop shadows for rectangles using png images with alpha. 
    Wednesday, March 28, 2012 8:01 AM

  • There are already apps in the Windows Store that use Images / Tiles with shadows.

    Those apps are most likely written in HTML / CSS & JS, meaning they can use CSS drop shadows to get the effect.

    For XAML apps, there's no quick, easy way to do it. For text, you could try rendering the same text underneath your text element in a different colour, offset pixel or two right & down to simulate a basic shadow, but it's not going to look great.

    Wednesday, March 28, 2012 12:29 PM
  • To create drop shadow for text I simply had more text blocks slightly below and to right of main text with color black

    and alpha, and then with scaling adjust the shadow text blocks proportianlly to current width/height to right and below of textblock normal text blocks

    Friday, October 5, 2012 3:01 PM