Search code examples
windows-phone-7expression-blend

How to add Text To Shapes in Blend Expressions 4?


I am looking at the shapes available in Blend Expression 4 for my WP7 app I am making. I am a bit confused though how to add text to a shape.

How do I add text to a shape?


Solution

  • Shapes in Blend for WP7 are simply ... Shapes.

    All Expression Shapes inherits from Path, that inherit from System.Windows.Shapes.Shape. Shape is a base class for creating graphics. It supports only very basics properties such as fill, stroke, transform, ... you can not add text inside a shape because it's a pure-graphical object.

    Hopefully for you, because they derive from UIElement, shape objects can be used inside panels and most WP controls. The Canvas panel is a particularly good choice for creating complex drawings because it supports absolute positioning of its child objects.

    So, two examples can be

        <Grid>
            <es:RegularPolygon Fill="#FFF4F4F5" Height="100" InnerRadius="1" PointCount="6" Stretch="Fill" Stroke="Black" Width="100" />
            <TextBlock VerticalAlignment="Center" HorizontalAlignment="Center" Text="Hello" Foreground="black"/>
        </Grid>
    

    or

        <Canvas Height="200" Width="200">
            <es:RegularPolygon Canvas.Left="50" Canvas.Top="50" Fill="#FFF4F4F5" Height="100" InnerRadius="1" PointCount="6" Stretch="Fill" Stroke="Black" Width="100" />
            <TextBlock Canvas.Left="75" Canvas.Top="85" VerticalAlignment="Center" HorizontalAlignment="Center" Text="Hello" Foreground="black"/>   
        </Canvas>