views:

34

answers:

1

I am trying to overlay text content on top of a region described by a Path. The Path is in a Viewbox wrapped Canvas so that it can scale to any size. The TextBlock is in a Canvas wrapped Grid that is trying to use the Path dimensions to determine the placement of the text block.

<?xml version="1.0" encoding="UTF-8"?>
<Canvas
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d" Width="1299" Height="413">
    <ContentControl Width="300" Height="Auto">
        <Grid>
            <Viewbox Stretch="Uniform" x:Name="MyViewBox">
                <Canvas Width="121.664" Height="79.158" x:Name="MyCanvas">
                    <Canvas.LayoutTransform>
                        <TransformGroup>
                            <ScaleTransform ScaleX="1" ScaleY="1"/>
                        </TransformGroup>
                    </Canvas.LayoutTransform>
                    <Path x:Name="MyPath" Width="115.666" Height="54.334" Canvas.Left="2.998" Canvas.Top="3.086" Data="M 115.666015,46.333496 C 115.666015,50.733887 112.066406,54.333985 107.666015,54.333985 L 7.99999999999994,54.333985 C 3.59960900000004,54.333985 0,50.733887 0,46.333496 L 0,8 C 0,3.60058600000002 3.59960900000004,0 7.99999999999994,0 L 107.666015,0 C 112.066406,0 115.666015,3.60058600000002 115.666015,8 L 115.666015,46.333496 Z">
                        <Path.Fill>
                            <SolidColorBrush Color="Red"/>
                        </Path.Fill>
                    </Path>
                </Canvas>
            </Viewbox>
            <Canvas>
                <Grid Width="115.666" Height="54.334" Canvas.Left="2.998" Canvas.Top="3.086" Margin="10,10">
                    <Thumb/>
                    <TextBlock TextWrapping="Wrap">
                    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
                    </TextBlock>
                </Grid>
            </Canvas>
        </Grid>
    </ContentControl>
</Canvas>

Two problems arise. First, the Grid is using the declared dimensions of the Path, not the final rendered dimensions. Also, if I set the ScaleTransform.ScaleY to "-1" on my Path Canvas (to mirror the path vertically), the TextBlock does not relocate to the new positions of my Path.

Is it possible to do this in XAML, or will I have to use code-behind to read the location at runtime?

EDIT: The example Grid is not actually referencing the Path properties, as I was unable to figure out the right properties to reference.

A: 

You can bind to the Path's ActualWidth and ActualHeight like below

"{Binding ElementName=MyPath, Path=ActualHeight}"

HTH

Avatar
This doesn't actually work. The ActualHeight property of the Path seems to be the pre-scaled height, before the Viewbox expands it.
Christopher Currie