zoukankan      html  css  js  c++  java
  • [WPF] 默认滚动条,通过附加属性和样式实现自定义

    效果图:

    Xaml文件:

    <DockPanel Margin="10">
        <WrapPanel DockPanel.Dock="Top" Margin="10">
            <DockPanel Margin="6">
                <TextBlock VerticalAlignment="Center">滚动条样式:</TextBlock>
                <RadioButton x:Name="radio_inline" Click="OnRadioClick">Inline</RadioButton>
                <RadioButton x:Name="radio_overlay" Click="OnRadioClick" IsChecked="True" Margin="10 0 0 0">Overlay</RadioButton>
            </DockPanel>
            <DockPanel Margin="6">
                <TextBlock VerticalAlignment="Center">内容高度:</TextBlock>
                <TextBox MinWidth="60" Text="{Binding Height,ElementName=rec,UpdateSourceTrigger=PropertyChanged}" />
            </DockPanel>
            <DockPanel Margin="6">
                <TextBlock VerticalAlignment="Center">滑块窄:</TextBlock>
                <TextBox MinWidth="60" Text="{Binding Path=(pp:ScrollBarElement.ThumbWidth),ElementName=scroll}" />
            </DockPanel>
            <DockPanel Margin="6">
                <TextBlock VerticalAlignment="Center">滑块窄 :Hover:</TextBlock>
                <TextBox MinWidth="60" Text="{Binding Path=(pp:ScrollBarElement.HoverThumbWidth),ElementName=scroll}" />
            </DockPanel>
            <DockPanel Margin="6">
                <TextBlock VerticalAlignment="Center">滑块最小长度:</TextBlock>
                <TextBox MinWidth="60" Text="{Binding Path=(pp:ScrollBarElement.ThumbMinLength),ElementName=scroll}" />
            </DockPanel>
            <DockPanel Margin="6">
                <TextBlock VerticalAlignment="Center">滑块圆角:</TextBlock>
                <TextBox MinWidth="60" Text="{Binding Path=(pp:ScrollBarElement.ThumbRadius),ElementName=scroll}" />
            </DockPanel>
            <DockPanel Margin="6">
                <TextBlock VerticalAlignment="Center">滑块圆角 :Hover:</TextBlock>
                <TextBox MinWidth="60" Text="{Binding Path=(pp:ScrollBarElement.HoverThumbRadius),ElementName=scroll}" />
            </DockPanel>
        </WrapPanel>
        <ScrollViewer x:Name="scroll" Style="{StaticResource PP.Styles.ScrollViewer.Overlay}" HorizontalScrollBarVisibility="Auto" Margin="10">
            <Rectangle x:Name="rec" Width="1280" Height="720" Fill="{StaticResource drawingBrush}" />
        </ScrollViewer>
    </DockPanel>

    通过样式和修改附加属性,实现各种效果;

    新增的附加属性有:

    1、ScrollBarElement.Background,滚动条的背景色,与ScrollViewer.Background区分开;

    2、ThumbFill,拖动块填充颜色;

    3、ThumbHoverFill,鼠标悬浮时拖动块填充颜色;

    4、ThumbPressFill,鼠标按压时拖动块填充颜色;

    5、ThumbWidth,拖动块宽度(横向时指高度);

    6、HoverThumbWidth,鼠标悬浮时拖动块宽度(横向时指高度);

    7、ThumbRadius,拖动块圆角大小;

    8、HoverThumbRadius,鼠标悬浮时拖动块圆角大小;

    9、ThumbMinLength,拖动块最小高度(横向时指宽度);

    代码已上传至GitHub:https://github.com/LowPlayer/PP.Wpf

  • 相关阅读:
    postgresql导入及导出
    高效构建Web应用 教你玩转Play框架 http://www.anool.net/?p=577
    强制远程桌面
    js对日期操作 获取两个日期的相差是否在几月之内
    ACM 擅长排列的小明
    路由vue-router
    小村系列之十五:倒了(修订版)
    小村系列之十三:次贷危机
    小村系列之十:民族主义的兴衰
    小村系列之八:村长开会
  • 原文地址:https://www.cnblogs.com/pumbaa/p/14548651.html
Copyright © 2011-2022 走看看