title: Define the style for PhoneTextBox in windows phone
body: <p>I'm rewriting the style for the PhoneTextBox, changing the default background to "transpanrent", the foreground to "White" and the BorderBrush to "White", because I want to design a Dark-Theme.</p>
  
  <p>But a problem came up that the text-input-indicator disappeared. I thank the reason is that the foreground of the text-input-indicator is black, so the user can't see it. But I can not find a way to define the foreground of the text-input-indicator. Any tips will be appricated.</p>
  
  <p>PS. I don't konw how to decribe the indicator, so I make up the word "text-input-indicator", which is shown below:</p>
  
  <p>Nomal situation,the black Vertical line shows up.</p>
  
  <p><img src="https://i.stack.imgur.com/8Mxo0.png" alt="enter image description here"></p>
  
  <p>After rewriting the style, the user can't see the black vertical line:</p>
  
  <p><img src="https://i.stack.imgur.com/Bbv5n.png" alt="enter image description here"></p>
  
  <p>and the xaml code:</p>
  
  <pre><code> &lt;Style x:Key="PhoneTextBoxStyle" TargetType="toolkit:PhoneTextBox"&gt;
          &lt;Setter Property="FontFamily" Value="{StaticResource PhoneFontFamilyNormal}"/&gt;
          &lt;Setter Property="FontSize" Value="{StaticResource PhoneFontSizeMediumLarge}"/&gt;
          &lt;Setter Property="Background" Value="Transparent"/&gt;
          &lt;Setter Property="Foreground" Value="White"/&gt;
          &lt;Setter Property="BorderBrush" Value="White"/&gt;
          &lt;Setter Property="SelectionBackground" Value="{StaticResource PhoneAccentBrush}"/&gt;
          &lt;Setter Property="SelectionForeground" Value="White"/&gt;
          &lt;Setter Property="BorderThickness" Value="2"/&gt;
          &lt;Setter Property="Padding" Value="{StaticResource PhoneBorderThickness}"/&gt;
          &lt;Setter Property="Template"&gt;
              &lt;Setter.Value&gt;
                  &lt;ControlTemplate TargetType="toolkit:PhoneTextBox"&gt;
                      &lt;Grid x:Name="RootGrid" Background="Transparent"&gt;
                          &lt;VisualStateManager.VisualStateGroups&gt;
                              &lt;VisualStateGroup x:Name="CommonStates"&gt;
                                  &lt;VisualState x:Name="Disabled"&gt;
                                  &lt;/VisualState&gt;
                                  &lt;VisualState x:Name="Enabled"&gt;
                                  &lt;/VisualState&gt;
                              &lt;/VisualStateGroup&gt;
                              &lt;VisualStateGroup x:Name="FocusStates"&gt;
                                  &lt;VisualState x:Name="Focused"&gt;
                                  &lt;/VisualState&gt;
                                  &lt;VisualState x:Name="Unfocused"/&gt;
                              &lt;/VisualStateGroup&gt;
                              &lt;VisualStateGroup x:Name="LengthIndicatorStates"&gt;
                                  &lt;VisualState x:Name="LengthIndicatorVisible"&gt;
                                      &lt;Storyboard&gt;
                                          &lt;ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="LengthIndicator"&gt;
                                              &lt;DiscreteObjectKeyFrame KeyTime="0:0:0"&gt;
                                                  &lt;DiscreteObjectKeyFrame.Value&gt;
                                                      &lt;Visibility&gt;Visible&lt;/Visibility&gt;
                                                  &lt;/DiscreteObjectKeyFrame.Value&gt;
                                              &lt;/DiscreteObjectKeyFrame&gt;
                                          &lt;/ObjectAnimationUsingKeyFrames&gt;
                                          &lt;ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" Storyboard.TargetName="RootGrid"&gt;
                                              &lt;DiscreteObjectKeyFrame KeyTime="0:0:0" Value="0, 0, 0, 27"/&gt;
                                          &lt;/ObjectAnimationUsingKeyFrames&gt;
                                          &lt;ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Opacity" Storyboard.TargetName="LengthIndicator"&gt;
                                              &lt;DiscreteObjectKeyFrame KeyTime="0:0:0" Value="0.6"/&gt;
                                          &lt;/ObjectAnimationUsingKeyFrames&gt;
                                          &lt;DoubleAnimation Duration="0:0:0.350" To="32" Storyboard.TargetProperty="(UIElement.RenderTransform).(TranslateTransform.Y)" Storyboard.TargetName="LengthIndicator"&gt;
                                              &lt;DoubleAnimation.EasingFunction&gt;
                                                  &lt;ExponentialEase Exponent="6"/&gt;
                                              &lt;/DoubleAnimation.EasingFunction&gt;
                                          &lt;/DoubleAnimation&gt;
                                      &lt;/Storyboard&gt;
                                  &lt;/VisualState&gt;
                                  &lt;VisualState x:Name="LengthIndicatorHidden"&gt;
                                      &lt;Storyboard&gt;
                                          &lt;DoubleAnimation Duration="0:0:0.350" To="0" Storyboard.TargetProperty="(UIElement.RenderTransform).(TranslateTransform.Y)" Storyboard.TargetName="LengthIndicator"&gt;
                                              &lt;DoubleAnimation.EasingFunction&gt;
                                                  &lt;ExponentialEase Exponent="6"/&gt;
                                              &lt;/DoubleAnimation.EasingFunction&gt;
                                          &lt;/DoubleAnimation&gt;
                                          &lt;ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" Storyboard.TargetName="RootGrid"&gt;
                                              &lt;DiscreteObjectKeyFrame KeyTime="0:0:0" Value="0, 0, 0, 0"/&gt;
                                          &lt;/ObjectAnimationUsingKeyFrames&gt;
                                          &lt;ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Opacity" Storyboard.TargetName="LengthIndicator"&gt;
                                              &lt;DiscreteObjectKeyFrame KeyTime="0:0:0.350" Value="0"/&gt;
                                          &lt;/ObjectAnimationUsingKeyFrames&gt;
                                          &lt;ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="LengthIndicator"&gt;
                                              &lt;DiscreteObjectKeyFrame KeyTime="0:0:0.350"&gt;
                                                  &lt;DiscreteObjectKeyFrame.Value&gt;
                                                      &lt;Visibility&gt;Collapsed&lt;/Visibility&gt;
                                                  &lt;/DiscreteObjectKeyFrame.Value&gt;
                                              &lt;/DiscreteObjectKeyFrame&gt;
                                          &lt;/ObjectAnimationUsingKeyFrames&gt;
                                      &lt;/Storyboard&gt;
                                  &lt;/VisualState&gt;
                              &lt;/VisualStateGroup&gt;
                          &lt;/VisualStateManager.VisualStateGroups&gt;
                          &lt;Border x:Name="LengthIndicatorBorder"&gt;
                              &lt;TextBlock x:Name="LengthIndicator" Foreground="{StaticResource PhoneContrastBackgroundBrush}" FontSize="{StaticResource PhoneFontSizeNormal}" HorizontalAlignment="Right" Margin="0" Opacity="0" TextAlignment="Right" VerticalAlignment="Bottom"&gt;
                                      &lt;TextBlock.RenderTransform&gt;
                                          &lt;TranslateTransform/&gt;
                                      &lt;/TextBlock.RenderTransform&gt;
                              &lt;/TextBlock&gt;
                          &lt;/Border&gt;
                          &lt;Border x:Name="HintBorder" BorderBrush="{TemplateBinding BorderBrush}" 
                                  BorderThickness="{TemplateBinding BorderThickness}" 
                                  Background="{TemplateBinding Background}" Margin="0"&gt;
                              &lt;Grid&gt;
                                  &lt;ContentControl x:Name="HintContent" Background="Transparent" Content="{TemplateBinding Hint}"
                                                  HorizontalAlignment="Left" Margin="3,5,3,0" Style="{TemplateBinding HintStyle}" 
                                                  Foreground="Gray"
                                                  Visibility="{TemplateBinding ActualHintVisibility}" VerticalAlignment="Top"/&gt;
                                  &lt;ContentControl x:Name="ContentElement" BorderThickness="0" HorizontalContentAlignment="Stretch" 
                                                  Margin="{StaticResource PhoneTextBoxInnerMargin}" 
                                                  Padding="{TemplateBinding Padding}"
                                                  VerticalContentAlignment="Stretch"/&gt;
                              &lt;/Grid&gt;
                          &lt;/Border&gt;
                          &lt;Border x:Name="TextBorder" BorderBrush="White" 
                                  BorderThickness="{TemplateBinding BorderThickness}" 
                                  Background="Transparent" Margin="0" Visibility="Collapsed"&gt;
                              &lt;TextBox x:Name="Text" Foreground="White" 
                                       FontWeight="{TemplateBinding FontWeight}" FontStyle="{TemplateBinding FontStyle}" 
                                       FontSize="{TemplateBinding FontSize}" FontFamily="{TemplateBinding FontFamily}"
                                       HorizontalAlignment="Left" SelectionForeground="{TemplateBinding SelectionForeground}" 
                                       SelectionBackground="{TemplateBinding SelectionBackground}" 
                                       TextAlignment="{TemplateBinding TextAlignment}" TextWrapping="{TemplateBinding TextWrapping}" 
                                       Text="{TemplateBinding Text}"/&gt;
                          &lt;/Border&gt;
                          &lt;Border x:Name="ActionIconBorder" Background="Transparent" HorizontalAlignment="Right" Height="54" VerticalAlignment="Bottom" Width="54"&gt;
                              &lt;Image x:Name="ActionIcon" Height="54" Source="{TemplateBinding ActionIcon}" Width="54"/&gt;
                          &lt;/Border&gt;
                          &lt;TextBlock x:Name="MeasurementTextBlock" FontWeight="{TemplateBinding FontWeight}" FontStyle="{TemplateBinding FontStyle}" FontStretch="{TemplateBinding FontStretch}" FontSize="{TemplateBinding FontSize}" FontFamily="{TemplateBinding FontFamily}" IsHitTestVisible="False" Margin="8" Opacity="0" TextAlignment="{TemplateBinding TextAlignment}" TextWrapping="{TemplateBinding TextWrapping}" Text="{TemplateBinding Text}"/&gt;
                      &lt;/Grid&gt;
                  &lt;/ControlTemplate&gt;
              &lt;/Setter.Value&gt;
          &lt;/Setter&gt;
      &lt;/Style&gt;
  </code></pre>