Как стиль TextBox ScrollBar с моими собственными изображениями?

Question

Мне было интересно, можно ли вставить мои собственные растровые изображения для стилуса прокрутки. Я хотел бы использовать изображение для стрелок вверх, вниз, фона и скроллера. Это то, что я должен начать с, но я просто не знаю, как получить доступ к этим указанным свойствам:

<TextBox Name="SlideNotes" Foreground="White" FontSize="20" FontWeight="Bold" Background="Transparent" BorderThickness="0" TextWrapping="Wrap" AcceptsReturn="True" ScrollViewer.VerticalScrollBarVisibility="Visible" Grid.Row="27" Grid.Column="11" Grid.ColumnSpan="46" Grid.RowSpan="5"> 
       <TextBox.Resources> 
        <Style TargetType="{x:Type ScrollBar}"> 
         <Setter Property="Background" Value="Red"/> 

        </Style> 
       </TextBox.Resources> 

Я был бы признателен за любую помощь.

Answer 1

Вы можете использовать ImageBrush, чтобы установить изображение в любое имущество, которое использует кисть (Background, Foreground, BorderBrush, Fill и т.д.).

В вашем случае, вы будете использовать его как это:

<TextBox Name="SlideNotes" Foreground="White" FontSize="20" FontWeight="Bold" Background="Transparent" BorderThickness="0" TextWrapping="Wrap" AcceptsReturn="True" ScrollViewer.VerticalScrollBarVisibility="Visible" Grid.Row="27" Grid.Column="11" Grid.ColumnSpan="46" Grid.RowSpan="5"> 
    <TextBox.Resources> 
     <Style TargetType="{x:Type ScrollBar}"> 
      <Setter Property="Background"> 
       <Setter.Value> 
        <ImageBrush ImageSource="yourimage.jpg" Stretch="Fill" /> 
       </Setter.Value> 
      </Setter> 
     </Style> 
    </TextBox.Resources> 
</TextBox> 

ImageBrush (и все другие кисти, которые наследуют от TileBrush) имеет набор свойств, которые контролируют, как показано изображение. Я использовал Stretch="Fill" в своем примере, который заставит изображение растянуться, чтобы заполнить все свободное пространство, но вы можете хотеть, чтобы он вел себя по-другому.

Например, это ...

<ImageBrush ImageSource="yourimage.jpg" Stretch="None" TileMode="FlipXY" /> 

Сделает ваш повтор изображения, с плитки в качестве альтернативы переворачивается по горизонтали и/или по вертикали.

Игрушка вокруг с Stretch и TileMode (или даже ViewPort, ViewPortUnit, Viewbox и ViewboxUnit, если вы чувствуете себя достаточно смелым), чтобы получить эффект, который вы хотите.

EDIT - Как RepeatButton, шаблон по умолчанию ScrollBar, кажется, в значительной степени игнорировать Background собственность, большую часть времени, а также другие свойства, которые вы могли бы использовать для настройки ... Это означает, что вы, вероятно, чтобы переопределить весь шаблон, чтобы настроить его по своему вкусу.

Вот один ScrollBar пример шаблона: ScrollBar Styles and Templates

И вот еще для RepeatButton: RepeatButton Styles and Templates

Answer 2

Похоже, вы после ControlTemplate. См. here за хороший учебник о том, как его создать.

Чтобы избежать стилизаций весьScrollViewer, вы можете вместо этого стиля толькоRepeatButton элемента, это будет делать вещи намного проще работать.

<Style TargetType="RepeatButton"> 
    <Setter Property="Background" Value="Red"/> 
    <Setter Property="Template"> 
     <Setter.Value> 
      ... 
     </Setter.Value> 
    </Setter> 
</Style> 

Вы, возможно, потребуется определить этот стиль в Window ресурсов, вместо TextBox ресурсов из-за объема.

См. documentation для RepeatButton стилей и шаблонов.