listboxitem을 선택 항목으로 확장하는 방법은 무엇입니까?

Question

나는 사용자가 특정 순서로 선택을 할 수있는 상황이있다. (처음에는 사용자가 데이터베이스를 선택하기를 원한다.

이렇게하려면 이 선택 항목을으로 확장하는 목록 상자를 만드는 작업에 대해 스스로에게 의아해했습니다. 이 확장 만들려면 는 (트릭을 할 것입니다

Visibility="{Binding Path=IsSelected 
      , RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ListBoxItem}} 
      , Converter={StaticResource VisibilityOfBool} 
      , ConverterParameter=False}" 

같은) 어려운 일이 아니다.

문제는 전환이 순간적이라는 것입니다. 사용자가 무슨 일이 있었는지 알기가 어렵습니다. 내가 뭘해야 할 것은 숨겨진 패널의 애니메이션 확장 ... 여기

가 무슨 뜻인지 설명하는 페이지입니다 :

<Page 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
     xmlns:system="clr-namespace:System;assembly=mscorlib" 
     mc:Ignorable="d" 
     d:DesignHeight="300" d:DesignWidth="300" 
    Title="SlidingExpansionOnSelected"> 
    <!--x:Class="TorsSandBox.Pages.SlidingExpansionOnSelected"--> 

    <Page.Resources> 
     <DataTemplate x:Key="daItemTemplate"> 
      <StackPanel Margin="10"> 
       <StackPanel.Triggers> 
         <EventTrigger RoutedEvent="ListBoxItem.Selected"> 
          <EventTrigger.Actions> 
           <BeginStoryboard> 
            <Storyboard> 
             <DoubleAnimation 
             Storyboard.TargetName="daTransform" 
             Storyboard.TargetProperty="ScaleY" 
             To="1.0" Duration="0:0:1"/> 
            </Storyboard> 
           </BeginStoryboard> 
          </EventTrigger.Actions> 
         </EventTrigger> 
         <EventTrigger RoutedEvent="ListBoxItem.Unselected"> 
          <EventTrigger.Actions> 
           <BeginStoryboard> 
            <Storyboard> 
             <DoubleAnimation 
             Storyboard.TargetName="daTransform" 
             Storyboard.TargetProperty="ScaleY" 
             To="0" Duration="0:0:1"/> 
            </Storyboard> 
           </BeginStoryboard> 
          </EventTrigger.Actions> 
         </EventTrigger> 
       </StackPanel.Triggers> 
       <TextBlock x:Name="Header" Text="{Binding}"/> 
       <Border x:Name="daBorder" 
        BorderThickness="3" BorderBrush="DarkOrange" CornerRadius="5" 
        HorizontalAlignment="Stretch" 
        Margin="20 10 10 10" 
        MinHeight="100" 
        > 
        <Border.LayoutTransform> 
         <ScaleTransform x:Name="daTransform" ScaleX="1" ScaleY="0"/> 
        </Border.LayoutTransform> 
        <TextBlock Text="Hide this until selected" 
         HorizontalAlignment="Center" VerticalAlignment="Center" /> 
       </Border> 
      </StackPanel> 
     </DataTemplate> 
    </Page.Resources> 

    <ListBox 
     HorizontalContentAlignment="Stretch" 
     ItemTemplate="{StaticResource daItemTemplate}" 
     > 
     <system:String>First row</system:String> 
     <system:String>Second row</system:String> 
     <system:String>Third row</system:String> 
     <system:String>Last row</system:String> 
    </ListBox> 
</Page> 

이 트리거가 작동하지 않습니다,하지만 내가 할 수 있기 때문이다 그 (것)들을 해고 하십시요 ... 누군가는 이것을 어떻게하는 것을 알 는가?

감사 토르 Thorbergsen는

Answer 1

: 시도

또 다른 대안은 속성 트리거입니다 컨테이너가 내가 아는 한 영향을받지 않는다는 것을 의미합니다.
애니메이션에서 속성 경로를 지정하는 것이 큰 고통입니다. Children 속성이 종속성 속성이 아니며 전체 구문이 약간 특이하기 때문에 StackPanel 내부의 테두리에 액세스 할 수 없습니다. 나는 ScaleTransform을 추출하고 애니메이션과 국경에서 모두를 참조하려했지만 그 어떤 이유로 작동하지 않았다

 <Style TargetType="ListBoxItem"> 
      <Style.Resources> 
       <Storyboard x:Key="OnSelected1"/> 
      </Style.Resources> 
      <Setter Property="Tag"> 
       <Setter.Value> 
        <sys:Double>0</sys:Double> 
       </Setter.Value> 
      </Setter> 
      <Setter Property="ContentTemplate"> 
       <Setter.Value> 
        <DataTemplate> 
         <StackPanel x:Name="stackPanel" Margin="10"> 
          <TextBlock x:Name="Header" Text="{Binding}"/> 
          <Border x:Name="daBorder" 
            BorderThickness="3" BorderBrush="DarkOrange" CornerRadius="5" 
            HorizontalAlignment="Stretch" 
            Margin="20 10 10 10" 
            MinHeight="100"> 
           <Border.LayoutTransform> 
            <ScaleTransform ScaleX="1" ScaleY="{Binding RelativeSource={RelativeSource AncestorType=ListBoxItem}, Path=Tag}"/> 
           </Border.LayoutTransform> 
           <TextBlock Text="Hide this until selected" HorizontalAlignment="Center" VerticalAlignment="Center" /> 
          </Border> 
         </StackPanel> 
        </DataTemplate> 
       </Setter.Value> 
      </Setter> 
      <Style.Triggers> 
       <EventTrigger RoutedEvent="ListBoxItem.Selected"> 
        <EventTrigger.Actions> 
         <BeginStoryboard> 
          <Storyboard> 
           <DoubleAnimation 
            Storyboard.TargetProperty="(ListBoxItem.Tag)" 
            Storyboard.TargetName="{x:Null}" 
            To="1.0" Duration="0:0:1"/> 
          </Storyboard> 
         </BeginStoryboard> 
         <BeginStoryboard Storyboard="{StaticResource OnSelected1}"/> 
        </EventTrigger.Actions> 
       </EventTrigger> 
       <EventTrigger RoutedEvent="ListBoxItem.Unselected"> 
        <EventTrigger.Actions> 
         <BeginStoryboard> 
          <Storyboard> 
           <DoubleAnimation 
            Storyboard.TargetProperty="(ListBoxItem.Tag)" 
            Storyboard.TargetName="{x:Null}" 
            To="0" Duration="0:0:1"/> 
          </Storyboard> 
         </BeginStoryboard> 
        </EventTrigger.Actions> 
       </EventTrigger> 
      </Style.Triggers> 
     </Style> 

:

어쨌든, 여기에 작동하는 해키 솔루션입니다.

Answer 2

당신은 "선택"과 "선택하지 않은"를 사용하여 이벤트에 ListBoxItem의 접두사를 필요가 없습니다. , 당신의 접근 방식 뭐가 잘못
애니메이션 만 VisualTree의 요소 낮은 영향을 미치는 것입니다 ...이 물건이 너무 복잡

https://web.archive.org/web/20120225232943/http://en.csharp-online.net/WPF_Styles_and_Control_Templates%E2%80%94Property_Triggers

Answer 3

편집 :

좋아, 나는 그림 밖으로했습니다. Tag (태그 대신)에 대한 첨부 된 속성을 만들었습니다.

public static class ListBoxHelper 
{ 
    public static readonly DependencyProperty ScaleYAnimationProperty = 
     DependencyProperty.RegisterAttached("ScaleYAnimation", typeof(double), typeof(ListBoxHelper), new FrameworkPropertyMetadata(0d)); 

    public static double GetScaleYAnimation(UIElement element) 
    { 
     return (double)element.GetValue(ScaleYAnimationProperty); 
    } 

    public static void SetScaleYAnimation(UIElement element, double value) 
    { 
     element.SetValue(ScaleYAnimationProperty, value); 
    } 
} 

<ListBox ItemsSource="{Binding Contacts}" HorizontalContentAlignment="Stretch"> 
     <ListBox.Resources> 
      <Style TargetType="ListBoxItem" BasedOn="{StaticResource {x:Type ListBoxItem}}"> 
       <Setter Property="controls:ListBoxHelper.ScaleYAnimation" Value="0"/> 
       <Setter Property="ContentTemplate"> 
        <Setter.Value> 
         <DataTemplate> 
          <StackPanel> 
           <Grid> 
            <Grid.ColumnDefinitions> 
             <ColumnDefinition Width="40"/> 
             <ColumnDefinition Width="*"/> 
             <ColumnDefinition Width="Auto"/> 
             <ColumnDefinition Width="100"/> 
            </Grid.ColumnDefinitions> 

            <controls:CircleContentControl Grid.Column="0" Width="40" Height="40"> 
             <Image Source="{Binding Image}"/> 
            </controls:CircleContentControl> 
            <TextBlock Text="{Binding FullName}" Grid.Column="1" Margin="10,0,5,0" VerticalAlignment="Center"/> 
            <TextBlock Text="{Binding PhoneNumber}" Grid.Column="2" VerticalAlignment="Center" FontStyle="Italic"> 
             <TextBlock.LayoutTransform> 
              <ScaleTransform ScaleX="0.7" ScaleY="0.7"/> 
             </TextBlock.LayoutTransform> 
            </TextBlock> 
            <StackPanel Orientation="Horizontal" Grid.Column="3" VerticalAlignment="Center" HorizontalAlignment="Center"> 
             <Button cal:Message.Attach="Call($dataContext)" Width="30" Height="30" Style="{StaticResource ContactDialButtonStyle}"> 
              <Rectangle Width="10" Height="10" Fill="{Binding Path=Foreground, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Button}}}"> 
               <Rectangle.OpacityMask> 
                <VisualBrush Stretch="Fill" Visual="{DynamicResource appbar_phone}" /> 
               </Rectangle.OpacityMask> 
              </Rectangle> 
             </Button> 
            </StackPanel> 
           </Grid> 
           <Border x:Name="daBorder" 
           BorderThickness="3" BorderBrush="DarkOrange" CornerRadius="5" 
           HorizontalAlignment="Stretch" 
           Margin="20 10 10 10" 
           MinHeight="100"> 
            <Border.LayoutTransform> 
             <ScaleTransform ScaleX="1" ScaleY="{Binding RelativeSource={RelativeSource AncestorType=ListBoxItem}, Path=(controls:ListBoxHelper.ScaleYAnimation)}"/> 
            </Border.LayoutTransform> 
            <TextBlock Text="Hide this until selected" HorizontalAlignment="Center" VerticalAlignment="Center" /> 
           </Border> 
          </StackPanel> 
         </DataTemplate> 
        </Setter.Value> 
       </Setter> 
       <Style.Triggers> 
        <EventTrigger RoutedEvent="ListBoxItem.Selected"> 
         <EventTrigger.Actions> 
          <BeginStoryboard> 
           <Storyboard> 
            <DoubleAnimation 
           Storyboard.TargetProperty="(controls:ListBoxHelper.ScaleYAnimation)" 
           Storyboard.TargetName="{x:Null}" 
           To="1.0" Duration="0:0:1"/> 
           </Storyboard> 
          </BeginStoryboard> 
         </EventTrigger.Actions> 
        </EventTrigger> 
        <EventTrigger RoutedEvent="ListBoxItem.Unselected"> 
         <EventTrigger.Actions> 
          <BeginStoryboard> 
           <Storyboard> 
            <DoubleAnimation 
           Storyboard.TargetProperty="(controls:ListBoxHelper.ScaleYAnimation)" 
           Storyboard.TargetName="{x:Null}" 
           To="0.0" Duration="0:0:1"/> 
           </Storyboard> 
          </BeginStoryboard> 
         </EventTrigger.Actions> 
        </EventTrigger> 
       </Style.Triggers> 
      </Style> 
     </ListBox.Resources> 
    </ListBox> 

---

나는 @의 H.B 솔루션을 사용하고 있습니다. 목록이 처음로드 될 때 작동합니다. 내가 한 ListBoxItem의 확장 경우, 다른 탭으로 전환하고 목록 상자가 탭으로 돌아가, 예외가 발생합니다 :

System.Windows.Data Error: 23 : Cannot convert '<null>' from type '<null>' to type 'System.Double' for 'en-US' culture with default conversions; consider using Converter property of Binding. NotSupportedException:'System.NotSupportedException: DoubleConverter não pode ser convertido de (nulo). 
    em System.ComponentModel.TypeConverter.GetConvertFromException(Object value) 
    em System.ComponentModel.TypeConverter.ConvertFrom(ITypeDescriptorContext context, CultureInfo culture, Object value) 
    em System.ComponentModel.BaseNumberConverter.ConvertFrom(ITypeDescriptorContext context, CultureInfo culture, Object value) 
    em MS.Internal.Data.DefaultValueConverter.ConvertHelper(Object o, Type destinationType, DependencyObject targetElement, CultureInfo culture, Boolean isForward)' 

System.Windows.Data Error: 6 : 'ObjectSourceConverter' converter failed to convert value '<null>' (type '<null>'); fallback value will be used, if available. BindingExpression:Path=Tag; DataItem='ListBoxItem' (Name=''); target element is 'ScaleTransform' (HashCode=48000142); target property is 'ScaleY' (type 'Double') NotSupportedException:'System.NotSupportedException: DoubleConverter não pode ser convertido de (nulo). 
    em MS.Internal.Data.DefaultValueConverter.ConvertHelper(Object o, Type destinationType, DependencyObject targetElement, CultureInfo culture, Boolean isForward) 
    em MS.Internal.Data.ObjectSourceConverter.Convert(Object o, Type type, Object parameter, CultureInfo culture) 
    em System.Windows.Data.BindingExpression.ConvertHelper(IValueConverter converter, Object value, Type targetType, Object parameter, CultureInfo culture)' 

사람도이 가지는?