Windows Phone에서 밑줄 친 입력 텍스트 필드를 만드는 방법은 무엇입니까?

1

이 쉬운 방법이 될 수 있습니다 :

첫째, 투명 텍스트 상자 및 테두리의 설정 기본 배경.
그럼 당신이 Change focused textbox background/foreground in WP7

그리고 마지막을, 밑줄을 얻기 위해 숀 Kendrot의 답변을 사용할 수 있습니다

또는 사용자 정의 텍스트 템플릿을 투명 배경에 삽입하고 밑줄을 삽입 할 수 있습니다.

내 의견으로는, 가장 좋은 방법은 UserControl에 Label 속성이 만들어 지도록 시도하는 것입니다. 필요할 때 텍스트 상자 레이블을 동적으로 설정할 수 있습니다.

namespace Test 
{ 
    public partial class CustomTextbox : UserControl 
    { 
     public readonly DependencyProperty LabelProperty = DependencyProperty.Register("Label", typeof(string), typeof(CustomTextbox), null); 
     public readonly DependencyProperty TextProperty = DependencyProperty.Register("Text", typeof(string), typeof(CustomTextbox), null); 

     /// <summary> 
     /// Get/set label 
     /// </summary> 
     public string Label 
     { 
      get 
      { 
       return (string)GetValue(LabelProperty); 
      } 
      set 
      { 
       SetValue(LabelProperty, value); 
      } 
     } 

     /// <summary> 
     /// Get/set text property 
     /// </summary> 
     public string Text 
     { 
      get 
      { 
       return (string)GetValue(TextProperty); 
      } 
      set 
      { 
       SetValue(TextProperty, value); 
      } 
     } 

     public CustomTextbox() 
     { 
      InitializeComponent(); 

      DataContext = this; 
     } 
    } 
}

XAML :

<Border BorderBrush="White" BorderThickness="0,0,0,1"> 
     <Grid> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="auto" /> 
       <ColumnDefinition Width="*" /> 
      </Grid.ColumnDefinitions> 
      <TextBlock Text="{Binding Path=Label}" VerticalAlignment="Bottom" Margin="0,0,0,2" /> 
      <TextBox Text="{Binding Path=Text}" FontSize="22" Grid.Column="1" Background="Transparent" BorderThickness="1" Foreground="White" Margin="0" Padding="10,0" VerticalAlignment="Bottom"> 
       <TextBox.Template> 
        <ControlTemplate TargetType="TextBox"> 
         <Grid Background="Transparent"> 
          <VisualStateManager.VisualStateGroups> 
           <VisualStateGroup x:Name="CommonStates"> 
            <VisualState x:Name="Normal" /> 
            <VisualState x:Name="MouseOver" /> 
            <VisualState x:Name="Disabled"> 
             <Storyboard> 
              <ObjectAnimationUsingKeyFrames Storyboard.TargetName="EnabledBorder" Storyboard.TargetProperty="Visibility"> 
               <DiscreteObjectKeyFrame KeyTime="0"> 
                <DiscreteObjectKeyFrame.Value> 
                 <Visibility>Collapsed</Visibility> 
                </DiscreteObjectKeyFrame.Value> 
               </DiscreteObjectKeyFrame> 
              </ObjectAnimationUsingKeyFrames> 
              <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DisabledOrReadonlyBorder" Storyboard.TargetProperty="Visibility"> 
               <DiscreteObjectKeyFrame KeyTime="0"> 
                <DiscreteObjectKeyFrame.Value> 
                 <Visibility>Visible</Visibility> 
                </DiscreteObjectKeyFrame.Value> 
               </DiscreteObjectKeyFrame> 
              </ObjectAnimationUsingKeyFrames> 
             </Storyboard> 
            </VisualState> 
            <VisualState x:Name="ReadOnly"> 
             <Storyboard> 
              <ObjectAnimationUsingKeyFrames Storyboard.TargetName="EnabledBorder" Storyboard.TargetProperty="Visibility"> 
               <DiscreteObjectKeyFrame KeyTime="0"> 
                <DiscreteObjectKeyFrame.Value> 
                 <Visibility>Collapsed</Visibility> 
                </DiscreteObjectKeyFrame.Value> 
               </DiscreteObjectKeyFrame> 
              </ObjectAnimationUsingKeyFrames> 
              <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DisabledOrReadonlyBorder" Storyboard.TargetProperty="Visibility"> 
               <DiscreteObjectKeyFrame KeyTime="0"> 
                <DiscreteObjectKeyFrame.Value> 
                 <Visibility>Visible</Visibility> 
                </DiscreteObjectKeyFrame.Value> 
               </DiscreteObjectKeyFrame> 
              </ObjectAnimationUsingKeyFrames> 
              <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DisabledOrReadonlyBorder" Storyboard.TargetProperty="Background"> 
               <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneTextBoxBrush}" /> 
              </ObjectAnimationUsingKeyFrames> 
              <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DisabledOrReadonlyBorder" Storyboard.TargetProperty="BorderBrush"> 
               <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneTextBoxBrush}" /> 
              </ObjectAnimationUsingKeyFrames> 
              <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DisabledOrReadonlyContent" Storyboard.TargetProperty="Foreground"> 
               <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneTextBoxReadOnlyBrush}" /> 
              </ObjectAnimationUsingKeyFrames> 
             </Storyboard> 
            </VisualState> 
           </VisualStateGroup> 
           <VisualStateGroup x:Name="FocusStates"> 
            <VisualState x:Name="Focused"> 
             <Storyboard> 
             </Storyboard> 
            </VisualState> 
            <VisualState x:Name="Unfocused" /> 
           </VisualStateGroup> 
          </VisualStateManager.VisualStateGroups> 

          <ContentControl x:Name="ContentElement" 
               Margin="{StaticResource PhoneTextBoxInnerMargin}" 
               HorizontalContentAlignment="Stretch" 
               VerticalContentAlignment="Stretch" 
               BorderThickness="0" 
               Padding="{TemplateBinding Padding}" /> 

          <Border x:Name="DisabledOrReadonlyBorder" 
            Margin="{StaticResource PhoneTouchTargetOverhang}" 
            Background="Transparent" 
            BorderBrush="{StaticResource PhoneDisabledBrush}" 
            BorderThickness="{TemplateBinding BorderThickness}" 
            Visibility="Collapsed"> 
           <TextBox x:Name="DisabledOrReadonlyContent" 
             Background="Transparent" 
             FontFamily="{TemplateBinding FontFamily}" 
             FontSize="{TemplateBinding FontSize}" 
             FontStyle="{TemplateBinding FontStyle}" 
             FontWeight="{TemplateBinding FontWeight}" 
             Foreground="{StaticResource PhoneDisabledBrush}" 
             IsReadOnly="True" 
             SelectionBackground="{TemplateBinding SelectionBackground}" 
             SelectionForeground="{TemplateBinding SelectionForeground}" 
             Text="{TemplateBinding Text}" 
             TextAlignment="{TemplateBinding TextAlignment}" 
             TextWrapping="{TemplateBinding TextWrapping}" 
           BorderThickness="0"/> 
          </Border> 
         </Grid> 
        </ControlTemplate> 
       </TextBox.Template> 
      </TextBox> 
     </Grid> 
    </Border> 
</UserControl>

사용 :

<local:CustomTextbox Label="label:" Text="text"></local:CustomTextbox>

난 그냥이 하나 생성

출처

2012-07-21 08:32:37

2

무시 텍스트 상자의 Template 배경 또는 테두리가되지 않음으로는, 다음 해당 페이지를 모방하기 위해 라벨 주위에 테두리와 BorderThickness="0 0 0 1"

출처

2012-07-20 21:48:47 McAden

1

와 텍스트 상자를 넣어, 당신은 포장 할 수 있습니다 텍스트 블록 및 텍스트 상자 테두리. 이렇게하면 시작할 수 있습니다.

<Border BorderBrush="White" BorderThickness="0,0,0,2"> 
     <Grid> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="Auto"/> 
       <ColumnDefinition Width="*"/> 
      </Grid.ColumnDefinitions> 
      <TextBlock Text="To:" Style="{StaticResource PhoneTextTitle2Style}" Margin="12,5" VerticalAlignment="Bottom"/> 
      <TextBox Grid.Column="1" Background="Transparent" BorderThickness="0" Foreground="{StaticResource PhoneSubtleBrush}" Text="This is a test" 
        VerticalAlignment="Bottom" /> 
     </Grid> 
    </Border>

출처

2012-07-20 23:03:13

Windows Phone에서 밑줄 친 입력 텍스트 필드를 만드는 방법은 무엇입니까?

답변

관련 문제