WPF中如何正确实现Slider控件的整体缩放

解决方法 #

问题原因

你遇到的刻度缩小问题是因为Slider内部的TickBar（刻度条）自带自适应布局逻辑，单独给Slider套ViewBox时，ViewBox的缩放逻辑会和Slider自身的布局计算冲突，导致刻度被压缩到不可见，同时焦点框的尺寸计算也会出错。

最优方案：全局统一缩放（推荐）

不要给每个控件单独套ViewBox，直接在最外层布局外包裹一个ViewBox，所有内部元素会按照同一比例同步缩放，不会出现单个控件的兼容问题：

<Grid>
    <Viewbox Stretch="Uniform">
        <!-- 给内部容器设置固定的基准尺寸，作为缩放的参考 -->
        <DockPanel Width="400" Height="40">
            <Button DockPanel.Dock="Left" Padding="0">-</Button>
            <Button DockPanel.Dock="Right" Padding="0">+</Button>
            <Slider 
                DockPanel.Dock="Left" 
                VerticalAlignment="Center"
                TickPlacement="BottomRight"
                Ticks="0,10,20,30,40,50"
                Maximum="50"
            />
        </DockPanel>
    </Viewbox>
</Grid>

这个方案无需修改任何控件模板，按钮文本、滑块、刻度、焦点框都会跟随窗口大小同步缩放，完全符合你的需求。

备选方案：单个Slider单独缩放

如果业务要求必须给每个控件单独套ViewBox，只需要给Slider显式指定固定宽高，给ViewBox提供明确的缩放基准即可：

<Viewbox DockPanel.Dock="Left">
    <Slider 
        VerticalAlignment="Center"
        Width="300" 
        Height="30"
        TickPlacement="BottomRight"
        Ticks="0,10,20,30,40,50"
        Maximum="50"
    />
</Viewbox>

指定固定尺寸后，Slider的所有元素都会正常缩放，不会出现刻度缩小的问题。

内容的提问来源于stack exchange，提问作者greenoldman