2016-08-31 4 views
0

私はListViewのコンテンツのリストを持っており、各アイテムにはIDが含まれています。このIDは、Flyout内でクリックされた行の詳細を示すイベントに渡されます。あなたは私がFlyoutRowと呼ばれるrowを定義したメイングリッドで見ることができますどのように、この行は、起動時に表示されていないフライアウトを連続して表示しますか?

<Grid> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="*"/> 
    </Grid.ColumnDefinitions> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="Auto"/> 
     <RowDefinition Height="5" x:Name="FlyoutRow"/> 
    </Grid.RowDefinitions> 

だけときにイベントのユーザーのクリックがavaialble:今、私はこのような状況をしましたListView

問題は行の高さが5なのでFlyoutはユーザーに表示されません。Flyoutのアニメーションを維持している行を展開できますか? Autoに

<Controls:Flyout x:Name="Flyout" Header="Flyout" Grid.Row="1"> 

</Controls:Flyout> 

答えて

0

セット行の高さ:

これはFlyoutの私の実装です。次に、フライアウト高さを調整するストーリーボードを使用します。

<Window x:Class="WpfApplication1.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
     xmlns:local="clr-namespace:WpfApplication1" 
     xmlns:controls="http://metro.mahapps.com/winfx/xaml/controls" 
     mc:Ignorable="d" 
     Title="MainWindow" Height="350" Width="525"> 

    <Window.Resources> 
     <Storyboard x:Key="Maximize"> 
      <DoubleAnimation Duration="0:0:0.5" Storyboard.TargetProperty="Height" From="5" To="100" Storyboard.TargetName="FL"> 
      </DoubleAnimation> 
     </Storyboard> 

     <Storyboard x:Key="Minimize"> 
      <DoubleAnimation Duration="0:0:0.1" Storyboard.TargetProperty="Height" From="100" To="5" Storyboard.TargetName="FL"> 
      </DoubleAnimation> 
     </Storyboard> 
    </Window.Resources> 
    <Grid> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="292*"/> 
      <RowDefinition Height="Auto" x:Name="FlyoutRow"/> 
     </Grid.RowDefinitions> 
     <ListView x:Name="View"> 
      <ListView.Triggers> 
       <EventTrigger RoutedEvent="ListView.SelectionChanged"> 
        <BeginStoryboard Storyboard="{StaticResource Maximize}"/> 
       </EventTrigger> 
       <EventTrigger RoutedEvent="ListView.LostFocus"> 
        <BeginStoryboard Storyboard="{StaticResource Minimize}"/> 
       </EventTrigger> 
      </ListView.Triggers> 
      <ListBoxItem Content="First item" Tag="Some information from first item"/> 
      <ListBoxItem Content="Second item" Tag="Some information from second item"/> 
      <ListBoxItem Content="Third item" Tag="Some information from third item"/> 
      <ListBoxItem Content="Fourth item" Tag="Some information from fourth item"/> 
      <ListBoxItem Content="Fifth item" Tag="Some information from fifth item"/> 
      <ListBoxItem Content="Sixth item" Tag="Some information from sixth item"/> 
      <ListBoxItem Content="Seventh item" Tag="Some information from Seventh item"/> 
      <ListBoxItem Content="Eigth item" Tag="Some information from eith item"/> 
     </ListView> 
     <controls:Flyout Grid.Row="1" Width="517" x:Name="FL" HorizontalContentAlignment="Stretch" IsOpen="True"> 
      <TextBlock Text="{Binding ElementName=View, Path=SelectedItem.Tag}" Background="#FF74FF24"/> 
     </controls:Flyout> 
    </Grid> 
</Window> 
+0

これは、問題を解決していません、私は5pxのスペースを持っている必要があります原因私は自動車を設定した場合、」、このスペースは失われます – AgainMe

+0

5pxの高さと1つの以上の行を追加します。 –

+0

別の行を追加すると、行間にさらに多くのスペースが追加されます。 – AgainMe

関連する問題