Анимация и прозрачность ListBoxItem - PullRequest
2 голосов
/ 12 января 2011

У меня есть Listbox со стилями, включая Listboxitem со стилями.Я пытаюсь создать анимацию с непрозрачностью от 0 до 1, чтобы элементы отображались в списке.Мне удалось сделать это с помощью следующего кода:

<Style x:Key="ListBoxStyle1" TargetType="ListBox">
            <Setter Property="Foreground" Value="#FF393C3F" />
            <Setter Property="OverridesDefaultStyle" Value="true"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ListBox">
                        <Border Name="Border" Background="{x:Null}" BorderBrush="Black" BorderThickness="0" Padding="0">
                            <ItemsPresenter />
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <Style x:Key="ListBoxItemStyle1" TargetType="ListBoxItem">
            <Setter Property="Opacity" Value="0" />
            <Setter Property="Height" Value="16" />
            <Setter Property="VerticalContentAlignment" Value="Bottom" />
            <Setter Property="VerticalAlignment" Value="Bottom" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ListBoxItem">
                        <Border Name="Border" Padding="10,1,0,0" Background="{x:Null}">
                            <ContentPresenter VerticalAlignment="Center" SnapsToDevicePixels="True" />
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsSelected" Value="true">
                                <Setter TargetName="Border" Property="Background" Value="{StaticResource arrow}" />
                            </Trigger>
                            <Trigger Property="IsMouseOver" Value="true">
                                <Setter Property="Foreground" Value="#FF828689" />
                            </Trigger>
                            <Trigger Property="IsVisible" Value="true">
                                <Trigger.EnterActions>
                                    <BeginStoryboard>
                                        <Storyboard>
                                            <DoubleAnimation Storyboard.TargetProperty="Opacity" From="0.0" To="1.0" Duration="0:0:0.4" />
                                        </Storyboard>
                                    </BeginStoryboard>
                                </Trigger.EnterActions>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

Эта вещь работает как надо (кроме этого я хочу, чтобы больше времени проходило между началом анимации текущего и следующего элемента. Но у него есть проблемас непрозрачностью. Все возможное установлено на прозрачный, фоны и все. И я использую прозрачную кисть .png для выбранного элемента.

Проблема заключается в анимации непрозрачности, которую лучше всего увидеть на нижнем рисунке:

Screenshot

Это скриншот в середине анимации (в то время как непрозрачность элементов списка составляет 0,8), и вы можете четко видеть белый фон вокруг всего текста.первый выбранный элемент, потому что он использует прозрачный .png. Этот фон волшебным образом исчезает, когда анимация завершена, и непрозрачность равна 1,0.

Как решить эту проблему? Я забыл установить какой-либо фон, возможно?

Спасибо за вашу помощь!

Редактировать:

Я добавляю свое объявление списка:

<ListBox Height="239" HorizontalAlignment="Left" Margin="0,0,0,0" Name="listBox1" VerticalAlignment="Top" Width="145" Background="{x:Null}"  FontWeight="Black" FontSize="8" BorderBrush="{x:Null}" SnapsToDevicePixels="True" BorderThickness="0" ItemContainerStyle="{StaticResource ListBoxItemStyle1}" Style="{StaticResource ListBoxStyle1}">
    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <VirtualizingStackPanel VerticalAlignment="Top" Background="{x:Null}" />
        </ItemsPanelTemplate>
    </ListBox.ItemsPanel>
</ListBox>

Also Другой вопрос: как отложить анимацию, при которой каждый элемент списка будет отображаться с задержкой в ​​несколько миллисекунд до следующего?

Спасибо за вашу помощь.

Ответы [ 2 ]

0 голосов
/ 20 января 2011

Я исправил проблему. Проблема заключалась в том, что в коде я переопределял флаг AllowTransparency окна. Теперь все работает как надо. Если кто-нибудь столкнется с подобной проблемой.

0 голосов
/ 12 января 2011

Это может быть системно-зависимая аномалия рендеринга, я попробовал этот стиль (мне нужно было использовать только мое выбранное изображение элемента, а также прозрачный PNG), и он работал довольно хорошо.
В одном из моих приложений изображения со значением Fill, равным Rectangle s, странным образом растягивались на одном из моих компьютеров (на котором даже была установлена ​​та же операционная система, Win7 Professional), чтобы не было ничего неслыханного ...

...