2012-06-13 19 views
5

Chcę narysować trochę Rectangle na jednym Image.Narysuj prostokąt ponad obrazkiem

Na przykład mam następujący (biały i czarny) Profil statek, i chcę dodać kilka (żółty i czerwony) prostokątów nad tym profilu w określonych miejscach:

enter image description here

Czy to możliwe? Jak mogę to zrobić?

Odpowiedz

9

Jest bardzo możliwe, jeśli znasz x, y, szerokość i wysokość obszarów, które chcesz zaznaczyć, możesz już umieścić wszystkie elementy sterujące na płótnie.

Można ustawić właściwości na prostokątów w kodzie tyłu tak:

Rectangle rectangle = new Rectangle(); 
rectangle.SetValue(Canvas.LeftProperty, 10); 
rectangle.SetValue(Canvas.TopProperty, 10); 
rectangle.Width = 1000; 
rectangle.Height = 50; 
rectangle.Fill = new SolidColorBrush() { Color = Colors.Red, Opacity = 0.75f }; 

canvas.Children.Add(rectangle); 

i jeśli chcesz dodać je w XAML można w ten sposób.

<Canvas> 
    <Image Source="..."/> 
    <Rectangle Canvas.Left="10" Canvas.Top="10" Width="1000" Height="50"> 
     <Rectangle.Fill> 
      <SolidColorBrush Color="Red" Opacity="0.75"/> 
     </Rectangle.Fill> 
    </Rectangle>       
</Canvas> 
+1

Będzie również chcesz, aby kolor z przezroczystością. – kenny

+0

@kenny tak czy to możliwe? – Nick

+0

Zaktualizowałem odpowiedź za pomocą C# i XAML, aby prostokąt był czerwony i lekko przezroczysty. – Andy

1

Wypróbuj to również pomoże.

<Window 
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
x:Class="Multi_Textbox.Window1" 
x:Name="Window" 
Title="Window1" 
Width="640" Height="480"> 

<Grid x:Name="LayoutRoot"> 
    <Image Margin="104,50,75,99" Source="barkship.jpg"/> 
    <Rectangle Fill="#FF28B0DE" HorizontalAlignment="Left" Height="17.334" Margin="212,0,0,111.333" Stroke="Black" VerticalAlignment="Bottom" Width="99.667"/> 
    <TextBlock HorizontalAlignment="Left" Height="11" Margin="230.667,0,0,115" TextWrapping="Wrap" Text="CHANDRU" VerticalAlignment="Bottom" Width="63.333" Foreground="White"/> 
</Grid> 

To wyjście jak ten

Result

+0

Ironia jest silna w tym +1 – sam