如何添加箭頭到電網

Question

左邊我如何添加一個箭頭像下面的圖片：

如果我不能將其添加到Grid，是否可以將其添加到第一個StackPanel？

<Grid> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="1.5*" MinWidth="200" MaxWidth="300"/> 
     <ColumnDefinition Width="3*" MinWidth="400"/> 
     <ColumnDefinition Width="2*" MinWidth="300"/> 
    </Grid.ColumnDefinitions> 
    <StackPanel Grid.Column="0"/> 
    <StackPanel Grid.Column="1"/> 
    <StackPanel Grid.Column="2"/> 
</Grid> 

這是無箭一個圖：

Answer 1

我建議使用設計Path：

<Grid> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="1.5*" MinWidth="200" MaxWidth="300"/> 
      <ColumnDefinition Width="3*" MinWidth="400"/> 
      <ColumnDefinition Width="2*" MinWidth="300"/> 
     </Grid.ColumnDefinitions> 
     <StackPanel Grid.Column="0"/> 
     <StackPanel Grid.Column="1"/> 
     <StackPanel Grid.Column="2"/> 
     <Path Data="M 0 0 L 0 10 L 5 5" Margin="0,0,-93,0" 
        StrokeThickness="0" 
        Stroke="Orange" 
        Fill="Orange" /> 
    </Grid> 

Answer 2

下面是示例代碼示出了箭頭（三角形）作爲裝飾器。您也可以使用圖片而不是繪圖。搜索谷歌的「Adorner教程WPF」。

MainWindow.xaml

<Grid ... > 
    ... 
    <StackPanel Orientation="Vertical" Background="#FFEEE528"> 
    <TextBlock x:Name="tb" HorizontalAlignment="Stretch" TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Top"/> 
    </StackPanel> 
</Grid> 

ArrowAdorner.cs

public class ArrowAdorner : Adorner 
    { 
     private FrameworkElement _adornedElement; 
     public ArrowAdorner(FrameworkElement adornedElement) 
      : base(adornedElement) 
     { 
      _adornedElement = adornedElement; 
     } 

     protected override void OnRender(DrawingContext drawingContext) 
     { 
      var height = _adornedElement.ActualHeight; 
      var width = _adornedElement.ActualWidth;  


      drawingContext.DrawLine(new Pen(Brushes.Red, 3), new Point(width, 0), new Point(width, height)); 
      drawingContext.DrawLine(new Pen(Brushes.Red, 3), new Point(width,0), new Point(width/2, height/2)); 
      drawingContext.DrawLine(new Pen(Brushes.Red, 3), new Point(width, height), new Point(width/2, height/2)); 
     } 
    } 

MainWindow.cs

void MainWindow_Loaded(object sender, RoutedEventArgs e) 
     { 
      //attach adorner 
      var adornedTextBlock = tb; 
      var adornerLayer = AdornerLayer.GetAdornerLayer(adornedTextBlock); 
      adornerLayer.Add(new ArrowAdorner(adornedTextBlock)); 
     } 

如果你想添加的裝飾器一個Image控件，請嘗試以下鏈接： Any control in adorner。