2012-03-17 65 views
0

我修改我的XAML代碼按鈕的視覺外觀上採用了六邊形。現在,我想2行添加到六邊形的像下面的圖像的兩個外邊緣:添加線的形狀在XAML

https://skydrive.live.com/redir.aspx?cid=204df65b0e6e1655&resid=204DF65B0E6E1655!117&parid=204DF65B0E6E1655!107&authkey=!AEzKZRmwMNhBWxM

誰能告訴如何以及在哪裏增加嗎?我的代碼是這樣

<Page.Resources> 
    <Style TargetType="Button"> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="Button"> 
        <Canvas> 
         <Polygon Canvas.Top="30" Points= 
        "430,0 
        400,32 
        -30,32 
        -60,0 
        -30,-32 
        400,-32" 
      Stroke="Brown" StrokeThickness="10"/> 
         <ContentPresenter Canvas.Left="80" Foreground="White" FontSize="40"></ContentPresenter> 
        </Canvas> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</Page.Resources> 

<Grid Background="Black"> 
    <Grid.RowDefinitions> 
     <RowDefinition /> 
     <RowDefinition /> 
     <RowDefinition /> 
    </Grid.RowDefinitions> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition /> 
    </Grid.ColumnDefinitions> 

    <Button Grid.Row="1" Margin="40,-100 0,-50" HorizontalAlignment="Center">Hello World</Button>  

</Grid> 

我不能得到的線連接到這些邊緣一路蔓延到頁面結束。 有什麼想法?

回答

1

你想這是你的按鈕樣式之內?我能夠通過下面的XAML按鈕控件模板代碼來實現這一點。

我把分隔在網格中,然後放到了首位他們行程添加到圖像的矩形。
我還添加2的上緣到多邊形以與矩形對齊。

<ControlTemplate TargetType="Button"> 
        <Grid> 
         <Grid.ColumnDefinitions> 
          <ColumnDefinition/> 
          <ColumnDefinition Width="500"/> 
          <ColumnDefinition /> 
         </Grid.ColumnDefinitions> 
         <Rectangle Fill="White" Grid.Column="0"/> 
         <Rectangle Fill="White" Grid.Column="2"/> 
         <Separator Background="White" Grid.Column="0"/> 
         <Separator Background="White" Grid.Column="2"/> 
         <Canvas Grid.Column="1" Margin="64,2,0,0"> 
          <Polygon Points= 
       "430,0 
       400,32 
       -30,32 
       -60,0 
       -30,-32 
       400,-32" 
     Stroke="Brown" StrokeThickness="10"/> 
          <ContentPresenter Canvas.Left="80" Foreground="White" FontSize="40"/> 

         </Canvas> 
        </Grid> 
       </ControlTemplate>