How can I correctly show text in TextBox using templating in WP7 Silverlight?

I want the corners of my TextBox to have CornerRadius=12. I use the ControlTemplate, everything is fine, but the text in the textbox when I write something shows spaces or dots.

Here is the code:

       <TextBox x:Name="UsernameTextBox" Text="{Binding Username, Mode=TwoWay}" Background="White" BorderBrush="#FF9ED3C1"  >
                <!--<TextBox.Text>
                    <Binding ElementName="username" ></Binding>
                </TextBox.Text>-->
                <TextBox.Template>
                    <ControlTemplate TargetType="TextBox">
                        <Border BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}" CornerRadius="12" Margi开发者_StackOverflow社区n="12"  >
                            <TextBox Text="{TemplateBinding Text}" Height="48" Background="{TemplateBinding Background}"  Foreground="{TemplateBinding Foreground}" />  
                        </Border>
                    </ControlTemplate>                       
                </TextBox.Template> 
            </TextBox> 

What should I change or which other way could I do the same?

The problem is that the TextBox in your ControlTemplate simply isn't high enough to display the text correctly. What you are seeing are no dots or spaces, but the upper parts of the letters, which are displayed further down where they are not visible anymore. To render the text correctly you have to increase the height of the TextBox or decrease the size of the font.

The following template shows some possible modifications (to your inner TextBox):

<TextBox Text="{TemplateBinding Text}" Height="71" FontSize="{TemplateBinding FontSize}" Background="{TemplateBinding Background}"  Foreground="{TemplateBinding Foreground}" Margin="-7,-8" BorderThickness="1" />

• Height="71" - this simply makes the TextBox high enough to render the text correctly.

• FontSize="{TemplateBinding FontSize}" - also bind to the FontSize, so you can make your text smaller in the object properties in Visual Studio (set it for example to FontSize="{StaticResource PhoneFontSizeSmall}"; this way you could reduce the TextBox height by some pixels)

• Margin="-7,-8" - reduce the distance between TextBox and Border to make the control more compact.