5

因此,我将扩展器的方向更改为垂直对齐而不是水平对齐,但在关闭状态下,扩展器标题文本水平对齐。请告诉我有一种方法可以轻松解决此问题而无需表情混合等。

<Expander Header="My Header"> 

我希望像AlignHeaderText垂直这样的东西,但我看不到它的选择?有没有人有不同的方式可以“展示”我?

因此,如果我想出了这个,请从指导 HB 那里获取:

    <StackPanel Orientation="Horizontal" Margin="0,0,342,0" Width="318">
            <StackPanel.Triggers>
                <EventTrigger RoutedEvent="Expander.Expanded" SourceName="expander1">
                    <EventTrigger.Actions>
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation From="0" To="1.2" Duration="0:0:0.45" Storyboard.TargetName="content" Storyboard.TargetProperty="(FrameworkElement.LayoutTransform).(ScaleTransform.ScaleX)"/>
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger.Actions>
                </EventTrigger>
            </StackPanel.Triggers>
            <Expander ExpandDirection="Right" Name="expander1" OpacityMask="#6C806969" Background="#FF807171">
                <Expander.LayoutTransform>
                    <RotateTransform Angle="90"></RotateTransform>
                </Expander.LayoutTransform>
                <Expander.Header>
                    <TextBlock
                   Text="HEADER"
                   Width="{Binding
                    RelativeSource={RelativeSource
                      Mode=FindAncestor,
                      AncestorType={x:Type Expander}},
                    Path=ActualWidth}"
                  />
                </Expander.Header>
                <Grid x:Name="content" Background="#FF807171" Width="178">
                    <Grid.LayoutTransform>
                        <ScaleTransform ScaleX="0" ScaleY="1"/>
                    </Grid.LayoutTransform>
                </Grid>

            </Expander>

不幸的是,它对扩展器这样做:

在此处输入图像描述

它将文本放在顶部,按钮放在中间,我希望按钮放在顶部,按钮后面的文本?

如果我更改Path=ActualWidthHeight按钮向上移动但标题文本仍然在按钮的左侧而不是在它的下方?

4

4 回答 4

7

我的解决方案(没有其他属性) - 基于HBSheikh Neyamat 的答案:

<Expander ExpandDirection="Right">
  <Expander.Header>
    <TextBlock Text="Header">
      <TextBlock.LayoutTransform>
        <RotateTransform Angle="90"/>
      </TextBlock.LayoutTransform>
    </TextBlock>
  </Expander.Header>
  // Content - listbox in my case
</Expander>
于 2016-03-23T09:49:13.470 回答
3

通过元素语法分配 a TextBlockas并将 a作为's应用以获取旋转。如果您想要可以以不同方式完成的垂直文本。HeaderRotateTransformTextBlockLayoutTransform

于 2012-04-15T17:10:48.607 回答
1

这里有一个支持上述建议的例子。

于 2014-12-02T13:07:40.577 回答
0

您还需要设置 ExpandDirection 属性并在标题模板中设置旋转。

在折叠时翻转方向的样式下方

<StackPanel Orientation="Horizontal">
    <StackPanel.Resources>
        <Style TargetType="Expander">
            <Style.Triggers>
                <Trigger Property="IsExpanded" Value="False">
                    <Setter Property="HeaderTemplate">
                        <Setter.Value>
                            <DataTemplate>
                                <TextBlock Text="{Binding}">
                                    <TextBlock.LayoutTransform>
                                        <RotateTransform Angle="90"/>
                                    </TextBlock.LayoutTransform>
                                </TextBlock>
                            </DataTemplate>
                        </Setter.Value>
                    </Setter>
                    <Setter Property="ExpandDirection" Value="Right"/>
                </Trigger>
            </Style.Triggers>
            <Setter Property="BorderBrush" Value="DarkGray"/>
            <Setter Property="Margin" Value="1,0,1,1"/>
            <Setter Property="Padding" Value="2"/>
            <Setter Property="VerticalContentAlignment" Value="Top"/>
        </Style>
    </StackPanel.Resources>
    <Expander Header="Command Data">
        <!-- some content -->
    </Expander>
    <Expander Header="Line Status">
        <!-- some content -->
    </Expander>
</StackPanel>
于 2021-09-13T10:42:51.457 回答