卡在带有文本框的按钮模板上

Question

我有一个如下所示的按钮模板，在这种情况下，当输入文本时，按钮保持相同的大小，并且可以正常工作。但是我只想要一个边框，所以当我尝试在拇指内添加那个椭圆以获得边框，并尝试在文本框中输入文本时，当文本变得比按钮大时，它突然覆盖了白色背景的按钮，我不知道为什么会这样，任何帮助将不胜感激。

        <Window.Resources>
    <Style TargetType="{x:Type Thumb}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Thumb">
                    <Ellipse Fill="{TemplateBinding Background}"/>
                </ControlTemplate> 
            </Setter.Value>
        </Setter>
    </Style>
    <Style TargetType="{x:Type Button}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                    <Grid>
                        <Thumb x:Name="outerThumbResize" Cursor="SizeNESW" Background="Red" Height="50" Width="50"/>

                        <!--<Ellipse x:Name="innerCircle" Fill="White" RenderTransformOrigin=".5,.5">
                            <Ellipse.RenderTransform>
                                <ScaleTransform ScaleX=".8" ScaleY=".8"/>
                            </Ellipse.RenderTransform>
                        </Ellipse>-->


                        <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                        <TextBox x:Name="textBox" Background="Transparent" BorderThickness="0" Visibility="Collapsed" TextAlignment="Center" PreviewKeyUp="textBox_PreviewKeyUp" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                        <Thumb x:Name="innerThumb" Background="Transparent" DragDelta="nodeThumb_DragDelta" RenderTransformOrigin=".5,.5">
                            <Thumb.RenderTransform>
                                <ScaleTransform ScaleX=".9" ScaleY=".9"/> 
                            </Thumb.RenderTransform>
                        </Thumb>

                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Window.Resources>

Answer 1

我使用模板中椭圆的笔画粗细解决了这个问题。