2016-12-16 12 views
-1

どのようにしてxamlを使用して図形でテキストを切り取ることができますか?xamlで図形で切り抜かれたテキストを作成

おそらく、背景と同じ太い太さの円の枠線でテキストを重ねることはできますが、背景が単色ではない場合はどうでしょうか?ここで

は、私が何をしたいの例です:

enter image description here

答えて

0

私が選んだのアプローチはuiElement.Clipプロパティを使用しています。長方形だけでクリップすることができますので、何回かクリップする必要があります。

0度、30度、および60度回転した3つのクリッピング四角形を組み合わせ、十二指の角を隠すために薄いオーバーラップする円の境界線を使用しました。誰かがそれを必要とする場合のコードは次のとおりです。

  <Ellipse x:Name="Ellipse" Fill="#FF8813B4" Height="85" Margin="0" Width="85" StrokeThickness="0" 
       HorizontalAlignment="Center" VerticalAlignment="Center" /> 
     <Grid Width="84" Height="84" HorizontalAlignment="Center"> 
      <Grid> 
       <Grid> 
        <TextBlock x:Name="Label" Text="Tample" FontSize="70" HorizontalAlignment="Left" VerticalAlignment="Center" 
         FontFamily="Open Sans Semibold" Margin="0,2,0,0" Foreground="#7FFFFFFF" FontWeight="Bold"/> 
        <Grid.Clip> 
         <RectangleGeometry Rect="0,0,84,84"> 
          <RectangleGeometry.Transform> 
           <CompositeTransform Rotation="60" CenterX="42" CenterY="42"/> 
          </RectangleGeometry.Transform> 
         </RectangleGeometry> 
        </Grid.Clip> 
       </Grid>     
       <Grid.Clip> 
         <RectangleGeometry Rect="0,0,84,84"> 
          <RectangleGeometry.Transform> 
           <CompositeTransform Rotation="30" CenterX="42" CenterY="42"/> 
          </RectangleGeometry.Transform> 
         </RectangleGeometry> 
        </Grid.Clip> 
       </Grid> 
       <Grid.Clip> 
        <RectangleGeometry Rect="0,0,84,84"> 
         <RectangleGeometry.Transform> 
          <CompositeTransform Rotation="0" CenterX="42" CenterY="42"/> 
         </RectangleGeometry.Transform> 
        </RectangleGeometry> 
       </Grid.Clip> 
      </Grid> 
     <Ellipse Stroke="#FF8813B4" StrokeThickness="2" Width="87" Height="87" HorizontalAlignment="Center" VerticalAlignment="Center"></Ellipse> 
関連する問題