Как я могу получить стрелку, направленную на мою границу?

Ive попробовал миллион вещей и им почти там ...Как я могу получить стрелку, направленную на мою границу?

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

<Grid> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="Auto" /> 
     <RowDefinition /> 
    </Grid.RowDefinitions> 
    <Polygon Points="5,0 10,10, 0,10" Stroke="Black" Fill="White" Grid.Row="0" HorizontalAlignment="Center" Margin="0,0,0,-2" Panel.ZIndex="10" StrokeThickness="2" StrokeDashArray="1 0" /> 
    <Border Background="#00000000" BorderBrush="Black" BorderThickness="2" CornerRadius="10" Grid.Row="1">

многоугольник создает идеальную стрелку, но нижняя граница треугольника является черным, и я хочу белый. Не уверен, как заставить его выглядеть белым, чтобы белый BG попал в стрелу. Вот как это выглядит так далеко:

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

источник

2015-07-30 pingu2k4

вы хотите, белый только под стрелкой, я meanwhere прямоугольник и стрелка соответствует –

Да - я хочу, чтобы это выглядело, как будто граница 1 линия, которая указывает вверх, как стрела. – pingu2k4

Новый способ для вас: Microsoft expression blend. Вы можете попробовать объекты Path – Ugur

Это немного сложно. Оберните свой треугольник внутри Grid с помощью ClipToBounds, установленного на true. Затем добавьте еще одну отрицательную нижнюю Margin от -2 до этого Grid:

<Grid> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="Auto" /> 
     <RowDefinition /> 
    </Grid.RowDefinitions> 
    <Grid Grid.Row="0" Height="10" ClipToBounds="True" Margin="0,0,0,-2"> 
     <Polygon Points="5,0 10,10, 0,10" Stroke="Black" Fill="White" HorizontalAlignment="Center" 
       Margin="0,0,0,-2" Panel.ZIndex="10" StrokeThickness="2" StrokeDashArray="1 0" /> 
    </Grid> 
    <Border Background="#00000000" BorderBrush="Black" BorderThickness="2" CornerRadius="10" Grid.Row="1"> 
</Grid>

Вы можете сделать свой треугольник больше, так как кусочек этого будет скрыт за пределами Grid.

источник

2015-07-30 11:33:33 almulo

Теперь, когда я думаю об этом, может быть, 'Grid' будет расти, а не скрывать треугольник вообще ... – almulo

Отредактировано несколько разным подходом – almulo

Новый подход работал отлично, спасибо :) Я применил то же самое ко всем другим краям, используя rendertransform, чтобы повернуть их и модифицировать поля и т. д. :) – pingu2k4

Будет ли это делать?

<Grid> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="Auto" /> 
     <RowDefinition /> 
    </Grid.RowDefinitions> 
    <Border Background="#00000000" BorderBrush="Black" BorderThickness="2" CornerRadius="10" Grid.Row="1" Margin="0,-2,0,0"/> 
    <Grid HorizontalAlignment="Center"> 
     <Polygon Points="5,0 10,10, 0,10" Stroke="Black" Fill="White" Grid.Row="0" Margin="0,0,0,0" Panel.ZIndex="10" StrokeThickness="2" StrokeDashArray="1 0" /> 
     <Polygon Points="1,10, 9,10" Stroke="White" Grid.Row="0" Margin="0,0,0,0" Panel.ZIndex="10" StrokeThickness="2" StrokeDashArray="1 0"/> 
    </Grid> 
</Grid>

источник

2015-07-30 11:28:37

Сидит слишком высоко, его нужно сбить с помощью margin -2 on ( – pingu2k4

Вы хотите что-то вроде этого:

<Grid> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="110*" /> 
      <RowDefinition Height="201*" /> 
     </Grid.RowDefinitions> 


     <Grid> 

      <Grid> 
       <Grid.RowDefinitions> 
        <RowDefinition Height="Auto" /> 
        <RowDefinition /> 
       </Grid.RowDefinitions> 
       <Border Background="#00000000" BorderBrush="Black" BorderThickness="2" CornerRadius="10" Grid.Row="1" Margin="0,-2,0,0"/> 
       <Grid HorizontalAlignment="Center"> 
        <Grid.ColumnDefinitions> 
         <ColumnDefinition Width="1.75" /> 
         <ColumnDefinition Width="*" /> 
         <ColumnDefinition Width="3.25" /> 
        </Grid.ColumnDefinitions> 
        <Grid.RowDefinitions> 
         <RowDefinition Height="9" /> 
         <RowDefinition Height="2" /> 
        </Grid.RowDefinitions> 
        <Polygon Points="5,0 10,10, 0,10" Stroke="Black" Fill="White" StrokeThickness="2" StrokeDashArray="1 0" Grid.RowSpan="2" Grid.ColumnSpan="3" /> 

        <Grid Grid.Row="1" Grid.Column="1"> 
         <Rectangle Fill="White" Stroke="White" ></Rectangle> 
        </Grid> 
       </Grid> 
      </Grid> 
     </Grid> 

    </Grid>

источник

2015-07-30 12:58:51 Ugur

Я думаю, что вы пытаетесь сделать что-то вроде Выноска, так и другой вариант заключается в использовании Adorner для элемента внутри границы. Adorner позволяет рисовать графику, связанную с этим элементом. В этом случае может быть треугольник. Оформить заказ adorners overview on MSDN.

Нижеследующий код предназначен для Adorner, который может быть применен к панели, и выдает выноску.

protected override void OnRender(DrawingContext drawingContext) 
    { 
     Rect adornedElementRect = new Rect(this.AdornedElement.DesiredSize); 

     SolidColorBrush renderBrush = new SolidColorBrush(Colors.White); 

     Pen renderPen = new Pen(new SolidColorBrush(Colors.Black), 1); 

     var stringBuilder = new StringBuilder(); 

     var end = adornedElementRect.TopRight; 

     stringBuilder.Append("M0,0"); 
     stringBuilder.Append(" L40,0 "); 
     stringBuilder.Append(" 50,-10 "); 
     stringBuilder.Append(" 60,0 "); 
     stringBuilder.Append(end.X); 
     stringBuilder.Append(","); 
     stringBuilder.Append(end.Y); 

     var stream = stringBuilder.ToString(); 

     drawingContext.DrawGeometry(renderBrush,renderPen, Geometry.Parse(stream)); 

    }

источник

2015-08-10 21:19:24 Mauricio

Как я могу получить стрелку, направленную на мою границу?

ответ

Смежные вопросы