17

ScrollViewer を備えたアプリがあります。2 つのスクロールバーが交差する場所は、煩わしい小さな四角形 (下の画像を参照) を取り除こうとしています。アプリを「スヌープ」すると、「Rectangle」として見つけることができますが、ScrollViewer の一部だと思いますか?

これに関する情報を検索して検索しましたが、見つけることができるのは、その上に何かを配置して非表示にする提案だけです:s

これをソートするために誰かが私を正しい方向に向けることができますか?

迷惑な小さな広場

<ControlTemplate x:Key="HorizontalScrollBar" 
        TargetType="{x:Type ScrollBar}">
        <Grid >
            <Grid.ColumnDefinitions>
                <ColumnDefinition MaxWidth="18"/>
                <ColumnDefinition Width="0.00001*"/>
                <ColumnDefinition MaxWidth="18"/>
            </Grid.ColumnDefinitions>
            <Border
                Grid.ColumnSpan="3"
                CornerRadius="2" 
                Background="Transparent"   />
            <RepeatButton 
                Grid.Column="0"                           
                Style="{StaticResource ScrollBarLineButton}"
                Width="18"
                Command="ScrollBar.LineLeftCommand"
                Content="M 4 0 L 4 8 L 0 4 Z" />
            <Track 
                Name="PART_Track"
                Grid.Column="1"
                IsDirectionReversed="False">
                <Track.DecreaseRepeatButton>
                    <RepeatButton 
                        Style="{StaticResource ScrollBarPageButton}"
                        Command="ScrollBar.PageLeftCommand" />
                </Track.DecreaseRepeatButton>
                <Track.Thumb>
                    <Thumb 
                        Style="{StaticResource ScrollBarThumb}" 
                        Margin="0,1,0,1"  
                        Background="{DynamicResource NormalBrush}"
                        BorderBrush="{DynamicResource NormalBorderBrush}" />
                </Track.Thumb>
                <Track.IncreaseRepeatButton>
                    <RepeatButton 
                        Style="{StaticResource ScrollBarPageButton}"
                        Command="ScrollBar.PageRightCommand" />
                </Track.IncreaseRepeatButton>
            </Track>
            <RepeatButton 
                Grid.Column="3" 
                Style="{StaticResource ScrollBarLineButton}"
                Width="18"
                Command="ScrollBar.LineRightCommand"
                Content="M 0 0 L 4 4 L 0 8 Z"/>
        </Grid>
    </ControlTemplate>
4

4 に答える 4

18

私はまったく同じ問題を抱えていましたが、スタックでこの回答を見つけて解決しました：

WPF で ListBox/Scrollviewer を完全にスタイル設定できません

その解決策は正方形の代わりに何かを配置しますが、 ScrollViewer コントロールの上に何かを配置するバブルガムパッチアプローチではなく、( ScrollBar ではなく ScrollViewer の) ControlTemplateで行われます。

ただし、そのテンプレートから Rectangle 定義を完全に省略するだけで、迷惑な角の四角形がなくなることがわかりました。つまり、その領域は ScrollViewer の背景色が何であれ (この例では透明です)、 ScrollViewer の背景色を設定する場合は、Grid の Background プロパティを設定するだけです)。

したがって、これをリソースに追加してみてください：

<Style TargetType="{x:Type ScrollViewer}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ScrollViewer}">
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition/>
                        <ColumnDefinition Width="Auto"/>
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition/>
                        <RowDefinition Height="Auto"/>
                    </Grid.RowDefinitions>
                    <ScrollContentPresenter Grid.Column="0" />
                    <ScrollBar x:Name="PART_VerticalScrollBar" Grid.Row="0" Grid.Column="1" Value="{TemplateBinding VerticalOffset}" Maximum="{TemplateBinding ScrollableHeight}" ViewportSize="{TemplateBinding ViewportHeight}" Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}"/>
                    <ScrollBar x:Name="PART_HorizontalScrollBar" Orientation="Horizontal" Grid.Row="1" Grid.Column="0" Value="{TemplateBinding HorizontalOffset}" Maximum="{TemplateBinding ScrollableWidth}" ViewportSize="{TemplateBinding ViewportWidth}" Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}"/>
                    <!--<Rectangle Grid.Row="1" Grid.Column="1" Fill="Red"/>-->
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>
于 2012-09-26T00:08:56.143 に答える
-1

マークされた答えは、私にとっては正しくありませんでした。これはしました。

<Style TargetType="{x:Type ScrollViewer}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type ScrollViewer}">
                <Grid Background="{TemplateBinding Panel.Background}">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="Auto" />
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*" />
                        <RowDefinition Height="Auto" />
                    </Grid.RowDefinitions>
                    <!--<Rectangle Grid.Column="1" Grid.Row="1" Fill="{DynamicResource {x:Static SystemColors.ControlBrushKey}}" />-->
                    <ScrollContentPresenter Grid.Column="0" Grid.Row="0" Margin="{TemplateBinding Control.Padding}" Content="{TemplateBinding ContentControl.Content}" ContentTemplate="{TemplateBinding ContentControl.ContentTemplate}" CanContentScroll="{TemplateBinding ScrollViewer.CanContentScroll}" />
                    <ScrollBar Grid.Column="1" Grid.Row="0" Minimum="0" Maximum="{TemplateBinding ScrollViewer.ScrollableHeight}" ViewportSize="{TemplateBinding ScrollViewer.ViewportHeight}" Value="{Binding Path=VerticalOffset, Mode=OneWay, RelativeSource={RelativeSource Mode=TemplatedParent}}" Visibility="{TemplateBinding ScrollViewer.ComputedVerticalScrollBarVisibility}" Cursor="Arrow" AutomationProperties.AutomationId="VerticalScrollBar" />
                    <ScrollBar Orientation="Horizontal" Grid.Column="0" Grid.Row="1" Minimum="0" Maximum="{TemplateBinding ScrollViewer.ScrollableWidth}" ViewportSize="{TemplateBinding ScrollViewer.ViewportWidth}" Value="{Binding Path=HorizontalOffset, Mode=OneWay, RelativeSource={RelativeSource Mode=TemplatedParent}}" Visibility="{TemplateBinding ScrollViewer.ComputedHorizontalScrollBarVisibility}" Cursor="Arrow" AutomationProperties.AutomationId="HorizontalScrollBar" />
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>
于 2016-06-13T10:26:47.367 に答える