Scrollbar nerviges Rechteck rechts unten

  • WPF

Es gibt 3 Antworten in diesem Thema. Der letzte Beitrag () ist von newcat.

    Scrollbar nerviges Rechteck rechts unten

    Hallo,

    ich habe es endlich geschafft meine Scrollbars zu stylen, allerdings habe ich jetzt immer, sobald beide Scrollbars angezeigt werden, folgendes Problem:

    Es entsteht ein nerviges Rechteck in der rechten unteren Ecke, das ich nicht wegbekomme. Wenn ich das Internet bisher richtig verstanden habe, ist das auch nicht direkt zu den Scrollbars zugehörig, sondern zum übergeordneten Container.
    Bei mir ist das eine ListView, ich habe zu dieser aber leider nichts gefunden, dass beschreibt, wie ich dieses Rechteck wegbekomme.

    Vielen Dank schonmal!
    Twitch Viewer Display Chat-, Zuschauer- und Statistiktool für Streamer

    Mit welchen Properties hast Du denn die

    newcat schrieb:

    Scrollbars
    so sichtbar gemacht?
    Falls Du diesen Code kopierst, achte auf die C&P-Bremse.
    Jede einzelne Zeile Deines Programms, die Du nicht explizit getestet hast, ist falsch :!:
    Ein guter .NET-Snippetkonverter (der ist verfügbar).
    Programmierfragen über PN / Konversation werden ignoriert!

    Das macht die ListView automatisch, je nachdem ob es vom Inhalt her nötig ist oder nicht. Ich poste hier mal den Code für die ScrollBars, ich habe das einfach mit einem Style für {x:Type ScrollBar} in den Window.Resources gemacht:
    Spoiler anzeigen

    VB.NET-Quellcode

    1. <Style x:Key="{x:Type ScrollBar}" TargetType="{x:Type ScrollBar}">
    2. <Setter Property="OverridesDefaultStyle" Value="True" />
    3. <Style.Triggers>
    4. <Trigger Property="Orientation" Value="Vertical">
    5. <Setter Property="Width" Value="18" />
    6. <Setter Property="Height" Value="Auto" />
    7. <Setter Property="Template" Value="{DynamicResource sbVert}" />
    8. </Trigger>
    9. <Trigger Property="Orientation" Value="Horizontal">
    10. <Setter Property="Width" Value="Auto" />
    11. <Setter Property="Height" Value="18" />
    12. <Setter Property="Template" Value="{DynamicResource sbHori}" />
    13. </Trigger>
    14. </Style.Triggers>
    15. </Style>
    17. <ControlTemplate x:Key="sbVert" TargetType="{x:Type ScrollBar}">
    18. <Grid>
    19. <Grid.RowDefinitions>
    20. <RowDefinition MaxHeight="18" />
    21. <RowDefinition Height="0.00001*" />
    22. <RowDefinition MaxHeight="18" />
    23. </Grid.RowDefinitions>
    25. <Border Grid.RowSpan="3" CornerRadius="4" BorderBrush="White" BorderThickness="0" />
    27. <RepeatButton Grid.Row="0"
    28. Style="{DynamicResource ScrollBarLineButton}"
    29. Height="18"
    30. Command="ScrollBar.LineUpCommand"
    31. Content="M 0 4 L 8 4 L 4 0 Z" />
    33. <RepeatButton Grid.Row="3"
    34. Style="{DynamicResource ScrollBarLineButton}"
    35. Height="18"
    36. Command="ScrollBar.LineDownCommand"
    37. Content="M 0 0 L 4 4 L 8 0 Z" />
    39. <Track x:Name="PART_Track" Grid.Row="1" IsDirectionReversed="True">
    40. <Track.Thumb>
    41. <Thumb Margin="1,0,1,0">
    42. <Thumb.Style>
    43. <Style TargetType="{x:Type Thumb}">
    44. <Setter Property="Focusable" Value="False" />
    45. <Setter Property="Template" Value="{DynamicResource scrollBarThumb}" />
    46. </Style>
    47. </Thumb.Style>
    48. </Thumb>
    49. </Track.Thumb>
    50. </Track>
    52. </Grid>
    53. </ControlTemplate>
    55. <ControlTemplate x:Key="sbHori" TargetType="{x:Type ScrollBar}">
    56. <Grid>
    57. <Grid.ColumnDefinitions>
    58. <ColumnDefinition MaxWidth="18" />
    59. <ColumnDefinition Width="0.00001*" />
    60. <ColumnDefinition MaxWidth="18" />
    61. </Grid.ColumnDefinitions>
    63. <Border Grid.ColumnSpan="4" Background="Transparent" BorderThickness="0" />
    65. <RepeatButton Grid.Column="0"
    66. Style="{DynamicResource ScrollBarLineButton}"
    67. Width="18"
    68. Command="ScrollBar.LineLeftCommand"
    69. Content="M 4 0 L 4 8 L 0 4 Z" />
    71. <RepeatButton Grid.Column="3"
    72. Style="{DynamicResource ScrollBarLineButton}"
    73. Width="18"
    74. Command="ScrollBar.LineRightCommand"
    75. Content="M 0 0 L 4 4 L 0 8 Z" />
    77. <Track x:Name="PART_Track" Grid.Column="1" IsDirectionReversed="False">
    78. <Track.Thumb>
    79. <Thumb Margin="0,1,0,1">
    80. <Thumb.Style>
    81. <Style TargetType="{x:Type Thumb}">
    82. <Setter Property="Focusable" Value="False" />
    83. <Setter Property="Template" Value="{DynamicResource scrollBarThumb}" />
    84. </Style>
    85. </Thumb.Style>
    86. </Thumb>
    87. </Track.Thumb>
    88. </Track>
    90. </Grid>
    91. </ControlTemplate>
    93. <Style x:Key="ScrollBarLineButton" TargetType="{x:Type RepeatButton}">
    94. <Setter Property="Focusable" Value="False" />
    95. <Setter Property="Template">
    96. <Setter.Value>
    97. <ControlTemplate TargetType="{x:Type RepeatButton}">
    98. <Border x:Name="repbtnBorder" Margin="1" CornerRadius="2" BorderThickness="1" BorderBrush="White">
    99. <Border.Background>
    100. <SolidColorBrush Color="Transparent" />
    101. </Border.Background>
    102. <Path x:Name="repbtnPath" HorizontalAlignment="Center" VerticalAlignment="Center" Fill="White"
    103. Data="{Binding Content, RelativeSource={RelativeSource TemplatedParent}}" />
    104. <VisualStateManager.VisualStateGroups>
    105. <VisualStateGroup x:Name="CommonStates">
    106. <VisualState x:Name="Normal">
    107. <Storyboard>
    108. <ColorAnimation To="Transparent" Duration="00:00:00.1"
    109. Storyboard.TargetName="repbtnBorder" Storyboard.TargetProperty="Background.(SolidColorBrush.Color)" />
    110. </Storyboard>
    111. </VisualState>
    112. <VisualState x:Name="MouseOver">
    113. <Storyboard>
    114. <ColorAnimation To="#40FFFFFF" Duration="00:00:00.1"
    115. Storyboard.TargetName="repbtnBorder" Storyboard.TargetProperty="Background.(SolidColorBrush.Color)" />
    116. </Storyboard>
    117. </VisualState>
    118. <VisualState x:Name="Pressed">
    119. <Storyboard>
    120. <ColorAnimation To="#40000000" Duration="00:00:00.0"
    121. Storyboard.TargetName="repbtnBorder" Storyboard.TargetProperty="Background.(SolidColorBrush.Color)" />
    122. </Storyboard>
    123. </VisualState>
    124. </VisualStateGroup>
    125. </VisualStateManager.VisualStateGroups>
    126. </Border>
    127. </ControlTemplate>
    128. </Setter.Value>
    129. </Setter>
    130. </Style>
    132. <ControlTemplate x:Key="scrollBarThumb" TargetType="{x:Type Thumb}">
    133. <Border BorderBrush="White" BorderThickness="1" CornerRadius="2" x:Name="thumbBorder">
    134. <Border.Background>
    135. <SolidColorBrush />
    136. </Border.Background>
    137. <VisualStateManager.VisualStateGroups>
    138. <VisualStateGroup x:Name="CommonStates">
    139. <VisualState x:Name="Normal">
    140. <Storyboard>
    141. <ColorAnimation To="Transparent" Duration="00:00:00.1"
    142. Storyboard.TargetName="thumbBorder" Storyboard.TargetProperty="Background.(SolidColorBrush.Color)" />
    143. </Storyboard>
    144. </VisualState>
    145. <VisualState x:Name="MouseOver">
    146. <Storyboard>
    147. <ColorAnimation To="#40FFFFFF" Duration="00:00:00.1"
    148. Storyboard.TargetName="thumbBorder" Storyboard.TargetProperty="Background.(SolidColorBrush.Color)" />
    149. </Storyboard>
    150. </VisualState>
    151. <VisualState x:Name="Pressed">
    152. <Storyboard>
    153. <ColorAnimation To="#40000000" Duration="00:00:00.0"
    154. Storyboard.TargetName="thumbBorder" Storyboard.TargetProperty="Background.(SolidColorBrush.Color)" />
    155. </Storyboard>
    156. </VisualState>
    157. </VisualStateGroup>
    158. </VisualStateManager.VisualStateGroups>
    159. </Border>
    160. </ControlTemplate>

    Twitch Viewer Display Chat-, Zuschauer- und Statistiktool für Streamer

    Ich habe jetzt wohl die Lösung gefunden: Interessanterweise musste ich den Style von dieser Vorlage msdn.microsoft.com/en-us/library/ms788747(v=vs.110).aspx noch einmal extra reinkopieren damit das Rechteck verschwindet... verändert habe ich nichts (außer den ganzen unnötigen Müll entfernt)?!, aber Hauptsache es funktioniert 8-)
    Twitch Viewer Display Chat-, Zuschauer- und Statistiktool für Streamer

Facebook
Telefonspende