Как нарисовать линии поверх изображения в серебряном свете?

Question

При отображении изображений в приложении Silverlight мне нужно наложить набор линий линий точно на изображение.Линия X1Y1 и X2 Y2 должна быть установлена ​​путем щелчка мышью по расположению изображения.

Изображение, нарисованное так:

и холст в одной ячейке сетки для фигур выглядит следующим образом:

    <Canvas Name="LeftLines" Grid.Row="1" Grid.Column="0">
        <Line Name="LeftTape" X1="20" X2="20" Y1="20" Y2="512" Stroke="Yellow" StrokeThickness="2" Visibility="Visible"></Line>
    </Canvas>

Я не могу понять, как визуализировать холст поверх изображения.Я пытался использовать TransformGroup tg, а затем LefttLines.SetValue (Canvas.RenderTransformProperty, tg);

Но чего-то не хватает.

Спасибо за совет или примеры.Val

Answer 1

ч.2

ага.Спасибо за дополнительную информацию.Если вы довольны тем, что изображение сохраняет равномерное соотношение сторон, вы можете поместить изображение и линии в сетке в ViewBox в ячейке сетки (холст не требуется).1007 *

Часть 1

Я не уверен, что понимаю проблему.Происхождение холста относится к той же ячейке и должно отображаться нормально.Порядок элементов в XAML важен, поскольку он определяет порядок визуализации (последний элемент в XAML обычно отображается последним).

Если вы задаете начальную и конечную координаты линии, в пикселях она должна отображаться там, где вы хотите (относительно ячейки сетки, в которой находится холст, поэтому сверху изображения в сеткеячейка).

Этот образец XAML привел к изображению под ним (с вашей линией поверх изображения):

    <Grid x:Name="LayoutRoot" Background="White">
        <Grid.RowDefinitions>
            <RowDefinition Height="*"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Image Source="images[1].jpg" Grid.Row="1"/>
        <Canvas x:Name="LeftLines" Grid.Row="1" Grid.Column="0">
            <Line x:Name="LeftTape" X1="20" X2="167" Y1="20" Y2="142" Stroke="Yellow" StrokeThickness="2" Visibility="Visible"/>
        </Canvas>
    </Grid>