如何在wpf中绘制扩展器（滑块）

Question

我有一个要求，我需要一个按钮，让用户点击并向下/向上滑动，以便在按钮上方展开/折叠控件。如下图所示：

我如何在xaml中实现它？

Answer 1

您可以为Header创建模板，并将问题中的图片放入HeaderTemplate。让我举个例子：

<Grid>
    <Grid.Resources>

        <Style TargetType="Border" x:Key="FooBorderStyle" >
            <Style.Resources>
                <LinearGradientBrush x:Key="ABackBrush" StartPoint="0.5,0" EndPoint="0.5,1">
                    <GradientStop Color="#EF3132" Offset="0.1" />
                    <GradientStop Color="#D62B2B" Offset="0.9" />
                </LinearGradientBrush>
            </Style.Resources>
            <Setter Property="Background" Value="{StaticResource ABackBrush}"/>
        </Style>

        <DataTemplate x:Key="titleTemplate">
            <Border Style="{StaticResource FooBorderStyle}" Height="24">
                <Image Source="../Images/yourImage.png" 
                    Margin="4 0"
                    VerticalAlignment="Center"/>
            </Border>
        </DataTemplate>

        <Style TargetType="{x:Type Expander}">
            <Setter Property="HeaderTemplate" Value="{StaticResource titleTemplate}"/>
        </Style>

    </Grid.Resources>

    <Expander Name="hcontCtrl" Header="This is the header.">
        <StackPanel>
            <TextBox>This is a textbox</TextBox>
            <Button>A button</Button>
        </StackPanel>
    </Expander>

</Grid>