Странная проблема с IsMouseOver на кнопке в ListBoxItem - PullRequest
0 голосов
/ 06 января 2010

У меня есть шаблон для элемента списка. Он включает в себя кнопку изображения. Кнопка меняет изображения при наведении курсора. Проблема в том, что я добавляю странный артефакт в кнопку при наведении курсора. Это происходит ТОЛЬКО если он находится в ListBoxItem. Если я положу кнопку на основной холст, он работает нормально.

Вот изображение в нормальном состоянии:

alt text

Вот изображение в состоянии наведения: обратите внимание на 2 белые линии на верхнем и правом краях.

alt text

Что еще более странно, когда вы убираете мышь и изображение возвращается, артефакт остается:

alt text

Вот код моей кнопки. Я пытался играть с каждой кистью фона (кнопка, элемент списка и т. Д.)

    <Style x:Key="RedXButton" TargetType="{x:Type Button}">
        <Setter Property="FocusVisualStyle" Value="{StaticResource ButtonFocusVisual}"/>
        <Setter Property="Background" Value="Black"/>
        <Setter Property="BorderBrush" Value="Transparent"/>
        <Setter Property="BorderThickness" Value="0"/>
        <Setter Property="Foreground" Value="Transparent"/>
        <Setter Property="HorizontalContentAlignment" Value="Center"/>
        <Setter Property="VerticalContentAlignment" Value="Center"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Button}">
                    <Image Width="19" Height="18">
                            <Image.Style>
                                <Style TargetType="{x:Type Image}">
                                    <Setter Property="Source" Value="Views/Images/RedX.png"/>
                                        <Style.Triggers>
                                            <Trigger Property="IsMouseOver" Value="True">
                                                <Setter Property="Source" Value="Views/Images/RedXHover.png"/>
                                            </Trigger>
                                        </Style.Triggers>
                                </Style>
                            </Image.Style>
                        </Image>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsKeyboardFocused" Value="true"/>
                        <Trigger Property="ToggleButton.IsChecked" Value="true"/>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="Width" Value="19"/>
        <Setter Property="Height" Value="18"/>
        <Setter Property="OpacityMask" Value="{x:Null}"/>
    </Style>

Шаблон элемента моего списка:

<Canvas x:Name="LayoutRoot">
        <Image x:Name="image" Source="/Views/Images/FileGradient.png" Width="375" Height="43"/>
        <Button x:Name="RedX" Style="{DynamicResource RedXButton}" Command="{Binding RemoveCommand}" Canvas.Left="11" Canvas.Top="13" Width="19" Height="18" />
    </Canvas>

Ответы [ 2 ]

0 голосов
/ 05 августа 2011

Получилось несколько стилей для разных элементов, конфликтующих. Я не уверен, что было на самом деле. Я просто упростил все стили и заново создал некоторые элементы управления, и все прошло. К сожалению, я не могу добавить больше, потому что я не уверен, что в конечном итоге это исправить.

0 голосов
/ 19 января 2010

Просто подумайте - попробуйте установить для свойства SnapsToDevicePixels в шаблоне элемента списка значение "true". Также стоит установить его на стиль кнопки:

<Setter Property="SnapsToDevicePixels" Value="true"/>
...