2011-05-06 162 views
6

我已經採取了文本框如何在文本框中滾動?

  <TextBox Height="218" HorizontalAlignment="Stretch" Margin="0,56,0,0" Name="txtBox" VerticalAlignment="Top" TextWrapping="Wrap" 
      Text="" GotFocus="txtBox_GotFocus" TextChanged="txtBox_TextChanged" IsTabStop="True" 
      IsEnabled="True" IsHitTestVisible="True" VerticalScrollBarVisibility="Auto" Background="White" FontFamily="Tahoma" />  

現在,當我在文本框中輸入大量的文字文本,然後自動滾動起來。我想顯示一個用戶可以瀏覽全文的滾動條。這個怎麼做。

+3

請只是copy'n'paste代碼而不是包括代碼的圖像。 – AnthonyWJones 2011-05-06 08:27:57

回答

2

這個問題沒有簡單的解決方案。此外,如果您允許某人輸入大量文字,則可能會添加更多線條,從而達到對UIElements施加的高度限制(2048px)。

如果您需要用戶輸入大量文本,則應考慮在WebBrowser控件中添加Input元素,並將該元素用於該字段。

4

你可以使用一個簡單的ScrollViewer,就像這樣:

<ScrollViewer Height="219" VerticalScrollBarVisibility="Auto"> 
    <TextBox VerticalAlignment="Top" TextWrapping="Wrap" Height="Auto" HorizontalAlignment="Left" Name="textBox1" Text="TextBox" Width="460"> 

    </TextBox> 
</ScrollViewer> 

那萬一文本垂直進入。你可以爲水平滾動做同樣的事情,但是這種方法不太可靠,因爲它不會自動地使用默認實現來滾動(就像我所展示的那樣)。

通常,我只是推薦覆蓋默認控件的模板。

+0

我試過,但它滾動整個文本框而不是文本。有沒有其他的方式 – rubyraj 2011-05-06 08:23:54

+0

正如我所說,你將不得不重寫默認模板,以保持容器的靜止和內容的移動。與我在這裏概述的相同的想法,只是相反。 ScrollViewer應該用於框的內容。 – 2011-05-06 17:33:48

0

您可以在創建滾動查看器的位置進行一些修復,將高度設置爲想要文本框的高度,然後在下面放置一個較大的文本框。如果你想讓你的文本框高度爲500,那麼你應該使你的滾動查看器的高度,並將文本框設置爲更大。

<ScrollViewer Height="500" VerticalScrollBarVisibility="Auto"> 
    <TextBox Height="1000" /> 
</ScrollViewer> 

這是基本的想法,但它應該能夠做你想要做的事情。請記住什麼馬特說,雖然去此有關的限制

1

兩個簡單的步驟:

  1. 創建TextBox_TextInputStart事件處理程序。
  2. 假設你的ScrollViewer被命名爲sv和文本框被命名爲txtbx,添加以下線路中的事件處理方法
this.sv.UpdateLayout(); 
this.sv.ScrollToVerticalOffset(this.txtbx.ActualHeight); 
0

的Windows Phone沒有滾動的TextBox默認,但你可以修改樣式來支持它。見this link

0

你應該文本框風格結合與此自定義風格

<Style x:Key="ScrollableTextBox" 
      TargetType="TextBox"> 
     <Setter Property="FontFamily" 
       Value="{StaticResource PhoneFontFamilyNormal}" /> 
     <Setter Property="FontSize" 
       Value="{StaticResource PhoneFontSizeMediumLarge}" /> 
     <Setter Property="Background" 
       Value="{StaticResource PhoneTextBoxBrush}" /> 
     <Setter Property="Foreground" 
       Value="{StaticResource PhoneTextBoxForegroundBrush}" /> 
     <Setter Property="BorderBrush" 
       Value="{StaticResource PhoneTextBoxBrush}" /> 
     <Setter Property="SelectionBackground" 
       Value="{StaticResource PhoneAccentBrush}" /> 
     <Setter Property="SelectionForeground" 
       Value="{StaticResource PhoneTextBoxSelectionForegroundBrush}" /> 
     <Setter Property="BorderThickness" 
       Value="{StaticResource PhoneBorderThickness}" /> 
     <Setter Property="Padding" 
       Value="2" /> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <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.TargetProperty="Background" 
                     Storyboard.TargetName="MainBorder"> 
              <DiscreteObjectKeyFrame KeyTime="0" 
                    Value="Transparent" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" 
                     Storyboard.TargetName="MainBorder"> 
              <DiscreteObjectKeyFrame KeyTime="0" 
                    Value="{StaticResource PhoneDisabledBrush}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" 
                     Storyboard.TargetName="ContentElement"> 
              <DiscreteObjectKeyFrame KeyTime="0" 
                    Value="{StaticResource PhoneDisabledBrush}" /> 
             </ObjectAnimationUsingKeyFrames> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="ReadOnly"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" 
                     Storyboard.TargetName="MainBorder"> 
              <DiscreteObjectKeyFrame KeyTime="0"> 
               <DiscreteObjectKeyFrame.Value> 
                <Visibility>Collapsed</Visibility> 
               </DiscreteObjectKeyFrame.Value> 
              </DiscreteObjectKeyFrame> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" 
                     Storyboard.TargetName="ReadonlyBorder"> 
              <DiscreteObjectKeyFrame KeyTime="0"> 
               <DiscreteObjectKeyFrame.Value> 
                <Visibility>Visible</Visibility> 
               </DiscreteObjectKeyFrame.Value> 
              </DiscreteObjectKeyFrame> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" 
                     Storyboard.TargetName="ReadonlyBorder"> 
              <DiscreteObjectKeyFrame KeyTime="0" 
                    Value="{StaticResource PhoneTextBoxBrush}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" 
                     Storyboard.TargetName="ReadonlyBorder"> 
              <DiscreteObjectKeyFrame KeyTime="0" 
                    Value="{StaticResource PhoneTextBoxBrush}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" 
                     Storyboard.TargetName="ContentElement"> 
              <DiscreteObjectKeyFrame KeyTime="0" 
                    Value="{StaticResource PhoneTextBoxReadOnlyBrush}" /> 
             </ObjectAnimationUsingKeyFrames> 
            </Storyboard> 
           </VisualState> 
          </VisualStateGroup> 
          <VisualStateGroup x:Name="FocusStates"> 
           <VisualState x:Name="Focused"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" 
                     Storyboard.TargetName="MainBorder"> 
              <DiscreteObjectKeyFrame KeyTime="0" 
                    Value="{StaticResource PhoneTextBoxEditBackgroundBrush}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" 
                     Storyboard.TargetName="MainBorder"> 
              <DiscreteObjectKeyFrame KeyTime="0" 
                    Value="{StaticResource PhoneTextBoxEditBorderBrush}" /> 
             </ObjectAnimationUsingKeyFrames> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="Unfocused" /> 
          </VisualStateGroup> 
         </VisualStateManager.VisualStateGroups> 
         <Border x:Name="MainBorder" 
           BorderBrush="{TemplateBinding BorderBrush}" 
           BorderThickness="{TemplateBinding BorderThickness}" 
           Background="{TemplateBinding Background}" 
           Margin="{StaticResource PhoneTouchTargetOverhang}" /> 
         <Border x:Name="ReadonlyBorder" 
           BorderBrush="{StaticResource PhoneDisabledBrush}" 
           BorderThickness="{TemplateBinding BorderThickness}" 
           Background="Transparent" 
           Margin="{StaticResource PhoneTouchTargetOverhang}" 
           Visibility="Collapsed" /> 
         <Border BorderBrush="Transparent" 
           BorderThickness="{TemplateBinding BorderThickness}" 
           Background="Transparent" 
           Margin="{StaticResource PhoneTouchTargetOverhang}"> 
          <ScrollViewer x:Name="ContentElement" 
              BorderThickness="0" 
              HorizontalContentAlignment="Stretch" 
              Margin="{StaticResource PhoneTextBoxInnerMargin}" 
              Padding="{TemplateBinding Padding}" 
              VerticalContentAlignment="Stretch" /> 
         </Border> 
        </Grid> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 

這裏是與文本框滾動視圖

<ScrollViewer Grid.Row="1" 
       VerticalScrollBarVisibility="Auto" 
       HorizontalScrollBarVisibility="Disabled" 
       MaxHeight="120" /> 

<TextBox Grid.Row="1" 
     AcceptsReturn="True" 
     TextWrapping="Wrap" 
     InputScope="Chat" 
     Style="{StaticResource ScrollableTextBox}" /> 

樣本項目project link