2010-12-23 5 views
6

これは私が欲しいものです:スクロール膨張機のコンテンツをストレッチは

1.)私はパンダ]ボタンをクリックすると、それはそれは、グリッド

の最後まで伸ばす必要があるサンプル画像を見る拡大します=>alt text

2.)書き込むときにはExpander内のRichTextBoxで使用できるテキストが表示されていなければなりません。下にスクロールする必要があります。

エクスパンダーのコンテンツの周りにスクロールビューアーを置くことは難しくありませんが、「自動」で設定しても表示されません。スクロールビューアを「Visible」に設定するExpanderの内容が無限にダウンするため、スクロールできません。私のサンプルコードザッツ

は:

<Grid Margin="30,0,0,0"> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="30" /> 
      <RowDefinition Height="*" /> 
      <RowDefinition Height="30" /> 
     </Grid.RowDefinitions> 
     <StackPanel Background="LightCoral" Orientation="Horizontal"> 

      <TextBlock Grid.Column="0" Text="Incident type:" VerticalAlignment="Center" /> 
      <ComboBox Grid.Column="1" IsEditable="True" Margin="0,7" Text="{Binding SelectedIncidentReport.IncidentType,Mode=TwoWay}" /> 

      <TextBlock Grid.Column="0" Grid.Row="1" Text="Teachers name:" VerticalAlignment="Center" /> 
      <TextBox Grid.Column="1" Grid.Row="1" Height="25" Text="{Binding SelectedIncidentReport.TeacherName,Mode=TwoWay}" /> 

      <TextBlock Grid.Column="0" Grid.Row="2" Text="Tutor group:" VerticalAlignment="Center" /> 
      <TextBox Grid.Column="1" Grid.Row="2" Margin="0,7" Text="{Binding SelectedIncidentReport.TutorGroup,Mode=TwoWay}" /> 
     </StackPanel> 

     <Grid Background="LightBlue" Grid.Row="1" > 
      <Grid.RowDefinitions> 
       <RowDefinition Height="Auto" /> 
       <RowDefinition Height="Auto" /> 
       <RowDefinition Height="Auto" /> 
       <RowDefinition Height="Auto" /> 
      </Grid.RowDefinitions>    
       <Expander Background="Purple" Grid.Row="0" Height="Auto" Header="Report details" IsExpanded="{Binding SelectedExpander, Mode=TwoWay, Converter={StaticResource ExpanderToBooleanConverter}, ConverterParameter=1}"> 
        <Controls:RichTextBox      
          VerticalScrollBarVisibility="Auto"           
          Text="{Binding SelectedIncidentReport.ReportDetails,UpdateSourceTrigger=LostFocus,IsAsync=True}" 
          AcceptsReturn="True" 
          AutoWordSelection="True" 
          AllowDrop="False" 
          SelectionBrush="#FFAC5BCB" 
          HorizontalScrollBarVisibility="Auto" />    
      </Expander> 

     <Expander Background="Red" Grid.Row="1" Header="Action taken" IsExpanded="{Binding SelectedExpander, Mode=TwoWay, Converter={StaticResource ExpanderToBooleanConverter}, ConverterParameter=2}"> 
       <Controls:RichTextBox         
          VerticalScrollBarVisibility="Auto"           
          Text="{Binding SelectedIncidentReport.ActionTaken,UpdateSourceTrigger=LostFocus,IsAsync=True}" 
          AcceptsReturn="True" 
          AutoWordSelection="True" 
          AllowDrop="False" 
          SelectionBrush="#FFAC5BCB" 
          HorizontalScrollBarVisibility="Auto" /> 
      </Expander> 
      <Expander Background="Lavender" Grid.Row="2" Header="Further action" IsExpanded="{Binding SelectedExpander, Mode=TwoWay, Converter={StaticResource ExpanderToBooleanConverter}, ConverterParameter=3}" > 
       <Controls:RichTextBox   
          VerticalScrollBarVisibility="Auto"               
          Text="{Binding SelectedIncidentReport.FurtherAction,UpdateSourceTrigger=LostFocus,IsAsync=True}" 
          AcceptsReturn="True" 
          AutoWordSelection="True" 
          AllowDrop="False" 
          SelectionBrush="#FFAC5BCB" 
          HorizontalScrollBarVisibility="Auto" /> 
      </Expander> 
      <Expander Background="YellowGreen" Grid.Row="3" Header="Home contact" IsExpanded="{Binding SelectedExpander, Mode=TwoWay, Converter={StaticResource ExpanderToBooleanConverter}, ConverterParameter=4}" > 

       <Controls:RichTextBox       
          VerticalScrollBarVisibility="Auto"               
          Text="{Binding SelectedIncidentReport.HomeContact,UpdateSourceTrigger=LostFocus,IsAsync=True}" 
          AcceptsReturn="True" 
          AutoWordSelection="True" 
          AllowDrop="False" 
          SelectionBrush="#FFAC5BCB" 
          HorizontalScrollBarVisibility="Auto" /> 

      </Expander> 
     </Grid> 
     <Grid Background="LawnGreen" Grid.Row="2" > 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="100" /> 
       <ColumnDefinition Width="*" /> 
      </Grid.ColumnDefinitions> 
      <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" Text="Documents:" Grid.Column="0" /> 
      <View:DocumentComboView DataContext="{Binding Path=SelectedIncidentReport.Documents}" Grid.Column="1" HorizontalAlignment="Stretch" /> 
     </Grid> 

    </Grid> 

答えて

8

あなたが探しているものは、自動と*サイズの行が混在していると思います。この切り替えを実現する方法はたくさんあります。単純な方法は、列の高さをコンバータを介してエクスパンダにバインドすることです。

<Grid Background="LightBlue" Grid.Row="1" > 
    <Grid.RowDefinitions> 
     <RowDefinition Height="{Binding ElementName=Ex1, Path=IsExpanded, Converter={StaticResource ExpandedToGridLengthConverter}}" /> 
     <RowDefinition Height="{Binding ElementName=Ex2, Path=IsExpanded, Converter={StaticResource ExpandedToGridLengthConverter}}" /> 
     <RowDefinition Height="{Binding ElementName=Ex3, Path=IsExpanded, Converter={StaticResource ExpandedToGridLengthConverter}}" /> 
     <RowDefinition Height="{Binding ElementName=Ex4, Path=IsExpanded, Converter={StaticResource ExpandedToGridLengthConverter}}" /> 
    </Grid.RowDefinitions> 
    <Expander Grid.Row="0" x:Name="Ex1" ...> 
     <RichTextBox ... /> 
    </Expander> 

    <Expander Grid.Row="1" x:Name="Ex2" ...> 
     ... 
    </Expander> 
    ... 
</Grid> 

そして、ここでは、コンバータの簡易版です:

public class ExpandedToGridLengthConverter : IValueConverter 
{ 
    public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) 
    { 
     if (!(value is bool)) 
      return GridLength.Auto; 

     if ((bool)value) 
      return new GridLength(1, GridUnitType.Star); 

     return GridLength.Auto; 
    } 

    public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) 
    { 
     throw new NotImplementedException(); 
    } 
} 

今すぐ利用可能なスペースが開いているパンダの間で分割され、折りたたまれたものとしてのみ取り上げるXAMLは次のようになります。彼らのヘッダーが必要とするほどです。拡張されたテキストのテキストが長すぎる場合、ScrollViewerは引き継いでその領域内のテキストのスクロールを開始します。

+0

部分的に動作します。 2つの欠点があります:4つのexpander => System.Windows.Dataエラー:4の場合、このエラーが発生します:4:参照 'ElementName = Ex1'のバインディングのソースが見つかりません。 BindingExpression:Path = IsExpanded; DataItem = null;ターゲット要素は 'RowDefinition'(HashCode = 61280566)です。私はRichTextBoxのExpander.Content =>高さまたはMinHeight = "{バインディングElementName = Ex1、パス=高さ}"を試みたが、RichTextBoxの '' Height 'は' Height '(タイプ' GridLength ')です。ストレッチダウン? RTB内に多くのテキストを書き込むと、テキストがrichTextBoxから書き出されます。 – Elisabeth

+0

エクスパンダーの内部:これを差し引くExpander.Headerのスペース(高さ)もコンバーター内で起こるはずです。これで、コンバータ内に2つの値が必要になりました:ExpanderのActualHeight。HeaderとExpander.Contentを減算してRichTextBoxの新しい高さとして返します。しかし、コンバータに2つの値を渡すにはどうしたらいいですか? – Elisabeth

+0

OK IMultiValueConverterが目標だと思われます。 – Elisabeth

2

私は最近、このような何かをしなければなりませんでした。私は非常に似たようなコードを使っていましたが、ページの背後にあるコードを使って目的の結果を得ることができました。私はC#の使用の後ろの窓コードで

WPF

<Grid Grid.Row="1" 
     Name="pageGrid" Margin="0,10,0,0"> 
     <Grid.RowDefinitions> 
      <RowDefinition 
       MinHeight="25" 
       Height="*" /> 
      <RowDefinition 
       MinHeight="25" 
       Height="*" /> 
      <RowDefinition 
       MinHeight="25" 
       Height="*" /> 
      <RowDefinition 
       MinHeight="25" 
       Height="*" /> 
      <RowDefinition 
       MinHeight="25" 
       Height="*" /> 
      <RowDefinition 
       MinHeight="25" 
       Height="*" /> 
      <RowDefinition 
       MinHeight="25" 
       Height="*" /> 
     </Grid.RowDefinitions> 
     <Expander 
      Grid.Row="0" 
      Header="header1" 
      Name="expander1" 
      Margin="0,0,0,0" 
      VerticalAlignment="Top" 
      FontSize="18" 
      IsExpanded="True"> 
      <Grid> 
       <TextBlock 
        Background="#336699FF" 
        Padding="5" 
        TextWrapping="Wrap" 
        Margin="30,5,10,5">      
       test 
       </TextBlock> 
      </Grid> 
     </Expander> 
     <Expander 
      Grid.Row="1" 
      Header="header2" 
      Margin="0,0,0,0" 
      Name="expander2" 
      VerticalAlignment="Top" 
      FontSize="18"> 
      <Grid> 
       <TextBlock 
        Background="#336699FF" 
        Padding="5" 
        TextWrapping="Wrap" 
        Margin="30,5,10,5"> 
         test 
       </TextBlock> 
      </Grid> 
     </Expander> 
     <Expander 
      Grid.Row="2" 
      Header="header3" 
      Margin="0,0,0,0" 
      Name="expander3" 
      VerticalAlignment="Top" 
      FontSize="18"> 
      <Grid> 
       <TextBlock 
        Background="#336699FF" 
        Padding="5" 
        TextWrapping="Wrap" 
        Margin="30,5,10,5"> 
         test 
       </TextBlock> 
      </Grid> 
     </Expander> 
     <Expander 
      Grid.Row="3" 
      Header="header4" 
      Margin="0,0,0,0" 
      Name="expander4" 
      VerticalAlignment="Top" 
      FontSize="18"> 
      <Grid> 
       <TextBlock 
        Background="#336699FF" 
        Padding="5" 
        TextWrapping="Wrap" 
        Margin="30,5,10,5"> 
        test 
       </TextBlock> 
      </Grid> 
     </Expander> 
     <Expander 
      Grid.Row="4" 
      Header="header5" 
      Margin="0,0,0,0" 
      Name="expander5" 
      VerticalAlignment="Top" 
      FontSize="18"> 
      <Grid> 
       <TextBlock 
        Background="#336699FF" 
        Padding="5" 
        TextWrapping="Wrap" 
        Margin="30,5,10,5"> 
        test 
       </TextBlock> 
      </Grid> 
     </Expander> 
     <Expander 
      Grid.Row="5" 
      Header="header6" 
      Margin="0,0,0,0" 
      Name="expander6" 
      VerticalAlignment="Top" 
      FontSize="18"> 
      <Grid> 
       <TextBlock 
        Background="#336699FF" 
        Padding="5" 
        TextWrapping="Wrap" 
        Margin="30,5,10,5"> 
        test 
       </TextBlock> 
      </Grid> 
     </Expander> 
     <Expander 
      Grid.Row="6" 
      Header="header7" 
      Margin="0,0,0,0" 
      Name="expander7" 
      VerticalAlignment="Top" 
      FontSize="18"> 
      <Grid> 
       <TextBlock Background="#336699FF" Padding="5" 
        TextWrapping="Wrap" 
        Margin="30,5,10,5"> 
        text 
       </TextBlock> 
      </Grid> 
     </Expander> 
    </Grid> 

と、このコードがあります:このような何かを試してみてください

C#

/// <summary> 
/// Interaction logic for _07Slide.xaml 
/// </summary> 
public partial class _07Slide : Page 
{ 
    GridLength[] starHeight; 

    public _07Slide() 
    { 
     InitializeComponent(); 

     starHeight = new GridLength[pageGrid.RowDefinitions.Count]; 
     starHeight[0] = pageGrid.RowDefinitions[0].Height; 
     starHeight[1] = pageGrid.RowDefinitions[2].Height; 
     starHeight[2] = pageGrid.RowDefinitions[2].Height; 
     starHeight[3] = pageGrid.RowDefinitions[2].Height; 
     starHeight[4] = pageGrid.RowDefinitions[2].Height; 
     starHeight[5] = pageGrid.RowDefinitions[2].Height; 
     starHeight[6] = pageGrid.RowDefinitions[2].Height; 
     ExpandedOrCollapsed(expander1); 
     ExpandedOrCollapsed(expander2); 
     ExpandedOrCollapsed(expander3); 
     ExpandedOrCollapsed(expander4); 
     ExpandedOrCollapsed(expander5); 
     ExpandedOrCollapsed(expander6); 
     ExpandedOrCollapsed(expander7); 


     expander1.Expanded += ExpandedOrCollapsed; 
     expander1.Collapsed += ExpandedOrCollapsed; 
     expander2.Expanded += ExpandedOrCollapsed; 
     expander2.Collapsed += ExpandedOrCollapsed; 
     expander3.Expanded += ExpandedOrCollapsed; 
     expander3.Collapsed += ExpandedOrCollapsed; 
     expander4.Expanded += ExpandedOrCollapsed; 
     expander4.Collapsed += ExpandedOrCollapsed; 
     expander5.Expanded += ExpandedOrCollapsed; 
     expander5.Collapsed += ExpandedOrCollapsed; 
     expander6.Expanded += ExpandedOrCollapsed; 
     expander6.Collapsed += ExpandedOrCollapsed; 
     expander7.Expanded += ExpandedOrCollapsed; 
     expander7.Collapsed += ExpandedOrCollapsed; 

    } 

    void ExpandedOrCollapsed(object sender, RoutedEventArgs e) 
    { 
     ExpandedOrCollapsed(sender as Expander); 
    } 

    void ExpandedOrCollapsed(Expander expander) 
    { 
     var rowIndex = Grid.GetRow(expander); 
     var row = pageGrid.RowDefinitions[rowIndex]; 
     if (expander.IsExpanded) 
     { 
      row.Height = starHeight[rowIndex]; 
      row.MinHeight = 25;     
     } 
     else 
     { 
      starHeight[rowIndex] = row.Height; 
      row.Height = GridLength.Auto; 
      row.MinHeight = 0; 
     } 
    } 
} 

をインこの例では、エクスパンダはすべてグリッドを完全に埋めるようになります。必要に応じて、これを変更して、他のエキスパンダーが選択されたときにそれを折りたたむことができます。

関連する問題