WPF：圓來訪者圖像

<Page 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    Background="Black"> 
    <!-- Rounded yellow border --> 
    <Border BorderThickness="3" BorderBrush="Yellow" CornerRadius="10" Padding="2" 
     HorizontalAlignment="Center" VerticalAlignment="Center"> 
     <Grid> 
     <!-- Rounded mask (stretches to fill Grid) --> 
     <Border Name="mask" Background="White" CornerRadius="7"/> 
     <!-- Main content container --> 
     <StackPanel> 
      <!-- Use a VisualBrush of 'mask' as the opacity mask --> 
      <StackPanel.OpacityMask> 
       <VisualBrush Visual="{Binding ElementName=mask}"/> 
      </StackPanel.OpacityMask> 
      <!-- Any content --> 
      <Image Source="http://chriscavanagh.files.wordpress.com/2006/12/chriss-blog-banner.jpg"/> 
      <Rectangle Height="50" Fill="Red"/> 
      <Rectangle Height="50" Fill="White"/> 
      <Rectangle Height="50" Fill="Blue"/> 
     </StackPanel> 
     </Grid> 
    </Border> 
</Page>

這XAML是WPF – Easy rounded corners for anything，但它不工作，形成我=（WPF：圓來訪者圖像

<Border Canvas.Left="55" 
     Canvas.Top="30" 
     Width="100" 
     Height="Auto" 
     Margin="12,12,8,0" 
     VerticalAlignment="Top" 
     BorderBrush="#FF3B5998" 
     BorderThickness=".5" 
     CornerRadius="18"> 
    <Border.Effect> 
     <DropShadowEffect BlurRadius="5" 
          Opacity=".5" 
          ShadowDepth="3" /> 
    </Border.Effect> 
    <Border Name="ReceiverColor" 
      BorderBrush="#FF96B2E4" 
      BorderThickness="6" 
      CornerRadius="15"> 
     <Border Name="Mask" 
       BorderBrush="#FF3B5998" 
       BorderThickness=".5" 
       CornerRadius="13"> 
       <StackPanel> 
        <StackPanel.OpacityMask> 
         <VisualBrush Visual="{Binding ElementName=Mask}" /> 
        </StackPanel.OpacityMask> 
        <Image Name="Receiver" /> 
       </StackPanel> 
     </Border> 
    </Border> 
</Border>

---編輯---
我做邊框尺寸，以自動並將圖像源更改爲鏈接中的圖像
當窗口加載的邊框尺寸變爲圖像尺寸但圖像未顯示時!!!

來源

2011-05-21 Ahmed Ghoneim

什麼是不工作...？ – biju 2011-05-21 12:47:00

您忘了網格使t他掩飾和圖像兄弟姐妹，並將圖像嵌入面具。你忘了設置掩碼的背景。

這工作：

<Grid> 
    <Border Canvas.Left="55" 
      Canvas.Top="30" 
      Width="100" 
      Height="Auto" 
      Margin="12,12,8,0" 
      VerticalAlignment="Top" 
      BorderBrush="#FF3B5998" 
      BorderThickness=".5" 
      CornerRadius="18"> 
     <Border.Effect> 
      <DropShadowEffect BlurRadius="5" 
           Opacity=".5" 
           ShadowDepth="3" /> 
     </Border.Effect> 
     <Border Name="ReceiverColor" 
       BorderBrush="#FF96B2E4" 
       BorderThickness="6" 
       CornerRadius="15"> 
      <Grid> 
       <Border Name="Mask" 
         Background="White" 
         BorderBrush="#FF3B5998" 
         BorderThickness=".5" 
         CornerRadius="13"> 
       </Border> 
       <StackPanel> 
        <Image Name="Receiver" 
          Source="/Images/test.jpg" /> 
        <StackPanel.OpacityMask> 
         <VisualBrush Visual="{Binding ElementName=Mask}" /> 
        </StackPanel.OpacityMask> 
       </StackPanel> 
      </Grid> 
     </Border> 
    </Border> 
</Grid>

來源

2011-05-21 18:30:10

沒有第一個代碼是從文章，但第二個代碼是從我的項目 – 2011-05-22 02:17:30

@Ahmed Adel，修復它。 – 2011-05-22 06:50:49

爲我工作，非常好。 – chengzi 2017-06-07 12:26:07

在WPF這個工作對我來說

<Ellipse Width="50" Height="50"> 
     <Ellipse.Fill> 
      <ImageBrush ImageSource="http://chriscavanagh.files.wordpress.com/2006/12/chriss-blog-banner.jpg" /> 
     </Ellipse.Fill> 
    </Ellipse>

來源

2017-04-15 09:33:36

此解決方案不能控制實際的半徑 - 並且失去對實際圖像的控制。如果你需要一個橢圓，這是一個很好的解決方案 - 但這與問題所要求的圓角不同。 – 2017-07-26 04:14:49

WPF：圓來訪者圖像

回答

相關問題