WPF TextBlock Перекрытия Эллипс

Question

Я пытаюсь создать это в WPF (я понимаю, что я мог бы просто использовать изображение, но я пытаюсь научиться WPF):

http://www.iconarchive.com/show/ios7-icons-by-visualpharm/info-icon.html

Это то, что я до сих пор но это не производит желаемого результата, в том, что текстовое поле, кажется, полностью скрыть эллипс, тогда он должен просто иметь прозрачный фон:

<StackPanel> 
    <TextBlock HorizontalAlignment="Left" Margin="144,207,0,0" TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Top"/> 
    <Ellipse HorizontalAlignment="Left" Height="52" Margin="142,189,0,0" Stroke="Black" VerticalAlignment="Top" Width="52"/> 
</StackPanel> 

Answer 1

Вы можете поместить такие вещи, как это в ViewBox сделать масштабирование проще, что-то вроде этого. Вам нужно будет удалить панель стека, она будет складывать элементы один поверх другого, что не то, что вы здесь. В этом случае я использовал сетку.

<Viewbox Width="100" Height="100"> 
    <Grid Width="20" Height="20"> 
     <Ellipse Stroke="Black"/> 
     <TextBlock HorizontalAlignment="Center" Text="i" TextAlignment="Center" VerticalAlignment="Center"/> 
    </Grid> 
</Viewbox> 

Answer 2

Не используйте StackPanel для этого, цель ее заключается в стек вещи, не показывать их внахлест, вы используете неправильный инструмент для этого. Используйте Grid, это намного больше подходит для того, что вы пытаетесь сделать.

Чтобы иметь прозрачный фон, вы должны либо установить Background property TextBlock в Прозрачный, либо установить нулевой фон.

Background={x:Null} 

Answer 3

Таким образом, стекольная панель поместит первый элемент вверху, второй чуть ниже его, третий ниже второго и т. Д. Вы можете использовать Canvas или Grid. Подобно панели стека, они являются «элементами управления контентом» и поддерживают размещение внутри них нескольких объектов, как это было сделано с помощью панели стека.

Так действительно быстрый способ сделать то, что вы пытаетесь достичь будет:

<Grid > 
     <Ellipse HorizontalAlignment="Left" Height="52" Stroke="Black" VerticalAlignment="Top" Width="52"/> 
     <TextBlock Text="i" FontSize="52" Margin="18,-13,-6,13" /> 
</Grid> 

Answer 4

Или вы можете использовать юникод символ: ⓘ

код 0x24D8

<TextBlock Text="ⓘ" FontSize="52" />