Xaml, 스택 패널에 이미지 위에 버튼 추가 프로그래밍 방식으로

Question

내 windows8App에서는 재생 버튼이있는 이미지가 있어야합니다. 그리드를 만들었습니다. 그리드에는 스택 플랭크가 있습니다. 그리고 이미지와 버튼을 이미지 위에 프로그램 적으로 배치하려고합니다. 하지만 앱을 실행하면 버튼이 이미지 뒤를 돌아가는 것을 볼 수 있습니다. 내 질문에 첫 번째 질문은 이미지 위에 버튼을 두는 좋은 방법일까요? 그렇다면 내 코드에 어떤 문제가 있습니까?

 var proVideoImg = new Image(); 
     proVideoImg.Source = new BitmapImage(new Uri("ms-appx:///Assets/image.png", UriKind.Absolute)); 
     proVideoImg.Stretch = Stretch.UniformToFill; 
     videoPlayerSP.Children.Add(proVideoImg); 

     var playBtn = new Button(); 
     playBtn.Margin = new Thickness(136, 121, 0, 133); 
     ImageBrush brush1 = new ImageBrush(); 
     brush1.ImageSource = new BitmapImage(new Uri("ms-appx:///Assets/playbutton.png")); 
     playBtn.Background = brush1;   
     playBtn.Click += new RoutedEventHandler(PlayVideo_Button_Click); 
     videoPlayerSP.Children.Add(playBtn); 

감사 :

<Border x:Name="videoPlayerBr" BorderBrush="#FFDED5D5" HorizontalAlignment="Center" Width="400" Height="300" VerticalAlignment="Top" Grid.Row="0"> 
<StackPanel Name="videoPlayerSP"> 
</StackPanel> 
</Border> 

이 뒤에 코드입니다.

Answer 1

이미지 및 단추 컨트롤을 Canvas 또는 중첩 된 Grid에 배치하십시오.

Answer 2

방금 ​​솔루션을 출시했습니다. 여기 있습니다. C#으로 쉽게 변환 할 수 있기를 바랍니다.

 <Button Height="29" Width="82" Click="Button_Click"> 
     <Button.Content> 
      <Grid> 
       <Image Source="Icons/add_action.png" Stretch="Fill" Opacity=".2"/> 
        <Path Data="M13,9.8933333 L13,21.561587 23.2164,16.328076 z" Fill="#FFBED460" HorizontalAlignment="Center" Stretch="Fill" Width="11.212" RenderTransformOrigin="0.357,0.5" VerticalAlignment="Center" Height="15"> 
         <Path.Stroke> 
          <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> 
           <GradientStop Color="Black" Offset="0"/> 
           <GradientStop Color="#FF9B6262" Offset="1"/> 
          </LinearGradientBrush> 
         </Path.Stroke> 
        </Path> 
       </Grid>    
      </Button.Content>     
     </Button>