如何與圖像重疊邊框並在邊框上添加陰影效果？

Question

我試圖重疊與圖像內的邊界，但我發現它無法申請，而我看到一些應用程序能夠這樣做。任何想法？

<Border BorderBrush="White" BorderThickness="1" Margin="20,20" Height="120" Width="410" > 
            <StackPanel Orientation="Horizontal"> 
             <Canvas> 
              <Image Margin="-30,0,0,45" VerticalAlignment="Top" Source="{Binding Path=ListboxImage}" Width="100" Height="150" /> 
             </Canvas> 
             <StackPanel> 
              <TextBlock Margin="135,8" Width="300" TextWrapping="Wrap" VerticalAlignment="Top" HorizontalAlignment="Left" Text="{Binding Path=ListboxName}" FontSize="{StaticResource PhoneFontSizeExtraLarge}"/> 
              <TextBlock Margin="150,0,0,8" Width="300" VerticalAlignment="Top" HorizontalAlignment="Left" Text="{Binding Path=ListboxDescription}" /> 
             </StackPanel> 
            </StackPanel> 
           </Border> 

雖然我嘗試了一些陰影效果添加到邊境。

<Border> 
    <Border.Effect> 
    ....... 
    </Border.Effect> 

</Border> 

但它似乎不支持該效果。 +我發現有些論壇說他們因性能起飛效果〜 有什麼想法該怎麼做？

Answer 1

嘗試有一個矩形和圖像的堆內部

  <StackPanel Orientation="Horizontal"> 
      <border> 
       <rectangle height="50"> 
       <textblock text={}> 
       </rectangle> 
       </border> 
        <Image Margin="-30,0,0,45" height = "75"/> 
      </Stackpanel> 

嘗試以對準圖像的邊緣是在StackPanel中的左側和矩形高度應小於圖像height.Try減少矩形的拐角半徑這也有幫助。

Answer 2

您好我發現它對於你的男人......試試這個，你可以在mainpage.cs邊境

 <ListBox ItemsSource="{Binding alldata}" Height="500" HorizontalAlignment="Left" Margin="12,160,0,0" Name="listBox3" VerticalAlignment="Top" Width="438" Background="Black"> 
     <ListBox.ItemTemplate> 
      <DataTemplate> 

       <Border BorderThickness="1" BorderBrush="White"> 
       <StackPanel Height="250" Orientation="Vertical" Name="stackPanel1" Width="400" > 


        <Border Margin="30,40,0,120" BorderThickness="1" BorderBrush="White"> 
          <Canvas Height="100"> 
           <TextBlock Text="Catalogue" Margin="160,50"> </TextBlock> 
          </Canvas> 
         </Border> 

         <Image Height="150" Width="160" Margin="-400,-400,-200,0" Source="{Binding image}"> 

         </Image> 


        </StackPanel> 
       </Border> 
      </DataTemplate> 
     </ListBox.ItemTemplate> 
    </ListBox> 

得到重疊圖像的代碼添加

 Uri uri = new  Uri("http://d1mu9ule1cy7bp.cloudfront.net/2012/media/catalogues/47/pages/p_"+ i +"/thump.jpg", UriKind.Absolute); 
      ImageSource imgSource = new BitmapImage(uri); 
      Image image = new Image(); 

alldata data = new alldata(){image = img.source, text = "catalogue"}; 


    public class alldata 
{ 
    public imagesource image 
    public string text 
}