Как поместить изображение “placemarkers” в полосе прокрутки в WPF?

Question

Как поместить изображение “placemarkers” в полосе прокрутки в WPF?

У меня есть длинное Средство просмотра Прокрутки, и я хочу отметить важные пятна с маленькими изображениями на полосе прокрутки. Если на изображение нажмут, то полоса прокрутки перейдет к соответствующему содержанию.

Я видел эту функциональность в нескольких приложениях, таких как Eclipse и Chrome, и задавался вопросом, как воспроизвести его с WPF.

11

wpf image scrollbar scrollviewer

задан Dave Clemmer 16 September 2011 в 23:33

1 ответ

Другие вопросы по тегам:

wpf image scrollbar scrollviewer

Похожие вопросы:

score 12 · Accepted Answer

Краткий ответ - «Изменить шаблон прокрутки».

Долгий ответ - это ... что я добавлю itemsControl в шаблоне управления прокруткой. Я бы поставил этот элементы контроля на вершине шаблона с его ishittestiable настроен на false, чтобы он не захватывал события мыши.

Тогда я бы использовал холст как элементыPaneltemplate для того, чтобы иметь возможность правильно размещать пятна. Я бы использовал DATANDINGINTING с помощью свойства элементов элементами элементами элементов Control и DataTemplate, чтобы сделать каждый элемент с изображением.

Вот образец, который я использовал смесь. Конечно, это не завершено (он не обрабатывает событие мыши, например), но я надеюсь, что это будет отправной точкой для вас.

_{(Источник: japf.fr )}

<ControlTemplate TargetType="{x:Type ScrollBar}">
    <Grid SnapsToDevicePixels="true" Background="{TemplateBinding Background}">
        <Grid.ColumnDefinitions>
            <ColumnDefinition MaxWidth="{DynamicResource {x:Static SystemParameters.HorizontalScrollBarButtonWidthKey}}"/>
            <ColumnDefinition Width="0.00001*"/>
            <ColumnDefinition MaxWidth="{DynamicResource {x:Static SystemParameters.HorizontalScrollBarButtonWidthKey}}"/>
        </Grid.ColumnDefinitions>
        <RepeatButton Style="{StaticResource ScrollBarButton}" Command="{x:Static ScrollBar.LineLeftCommand}" Microsoft_Windows_Themes:ScrollChrome.ScrollGlyph="LeftArrow"/>
        <Track x:Name="PART_Track" Grid.Column="1" d:IsHidden="True">
            <Track.Thumb>
                <Thumb Style="{StaticResource ScrollBarThumb}" Microsoft_Windows_Themes:ScrollChrome.ScrollGlyph="HorizontalGripper"/>
            </Track.Thumb>
            <Track.IncreaseRepeatButton>
                <RepeatButton Style="{StaticResource HorizontalScrollBarPageButton}" Command="{x:Static ScrollBar.PageRightCommand}"/>
            </Track.IncreaseRepeatButton>
            <Track.DecreaseRepeatButton>
                <RepeatButton Style="{StaticResource HorizontalScrollBarPageButton}" Command="{x:Static ScrollBar.PageLeftCommand}"/>
            </Track.DecreaseRepeatButton>
        </Track>
        <ItemsControl Grid.Column="1" HorizontalAlignment="Stretch">
            <sys:Double>10</sys:Double>
            <sys:Double>50</sys:Double>
            <sys:Double>100</sys:Double>
            <sys:Double>140</sys:Double>
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <Rectangle Fill="Orange" Width="3" Height="16"/>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
            <ItemsControl.ItemContainerStyle>
                <Style TargetType="ContentPresenter">
                    <Setter Property="Canvas.Left" Value="{Binding }" />
                </Style>
                                        </ItemsControl.ItemContainerStyle>
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <Canvas/>
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
        </ItemsControl>
        <RepeatButton Style="{StaticResource ScrollBarButton}" Grid.Column="2" Command="{x:Static ScrollBar.LineRightCommand}" Microsoft_Windows_Themes:ScrollChrome.ScrollGlyph="RightArrow" d:IsHidden="True"/>
    </Grid>
</ControlTemplate>