ラベルの右側に Expander ボタンを配置したいと考えています。これを行う方法?
4 に答える
FlowDirection
を に設定することもできますがRightToLeft
、別の問題が発生する可能性があります。たとえば、エキスパンダーのコンテンツのフロー方向も変更されるため、元に戻す必要がある場合があります。
<Expander FlowDirection="RightToLeft">
<StackPanel FlowDirection="LeftToRight">
</StackPanel>
</Expander>
コントロールのテンプレートのスタイルを変更する必要があります。次に例を示します:http://patconroy.wordpress.com/2008/12/18/restyling-the-wpf-expander-control/
これにアプローチするもう 1 つの方法は、エキスパンダー自体にヘッダーやコンテンツを配置せずに、エキスパンダーを好きな場所に配置することです。次に、 BooleanToVisibilityConverterを使用して、コンテンツ コントロールの可視性を expandersIsExpanded
プロパティにバインドします。
<StackPanel>
<StackPanel.Resources>
<BooleanToVisibilityConverter x:Key="boolToVisibility" />
</StackPanel.Resources>
<DockPanel>
<Expander DockPanel.Dock="Right" x:Name="rightAlignedExpander" />
<TextBlock Text="Expanders header" VerticalAlignment="Center" />
</DockPanel>
<Grid Visibility="{Binding IsExpanded, ElementName=rightAlignedExpander, Converter={StaticResource boolToVisibility}}">
<TextBlock Text="Expanders content"/>
</Grid>
</StackPanel>
欠点は、ヘッダーがクリックされたときに展開されないことですが、必要に応じて簡単に実装できます。
個人的には、コントロールのテンプレートを完全にスタイル変更するよりも、この方が単純で簡単だと思います。また、DevExpress や Telerik などのサードパーティのテーマを使用する場合など、エキスパンダーに既に適用されているスタイルを保持するという追加の利点もあります。
変換コマンドを使用してコントロールを反転できます
<Expander RenderTransformOrigin="0.5,0.5">
<Expander.RenderTransform>
<TransformGroup>
<ScaleTransform ScaleY="1" ScaleX="-1" />
<SkewTransform AngleY="0" AngleX="0" />
<RotateTransform Angle="0" />
<TranslateTransform />
</TransformGroup>
</Expander.RenderTransform>
<Expander.Header>
<Grid RenderTransformOrigin="0.5,0.5">
<Grid.RenderTransform>
<TransformGroup>
<ScaleTransform ScaleY="1" ScaleX="-1" />
<SkewTransform AngleY="0" AngleX="0" />
<RotateTransform Angle="0" />
<TranslateTransform />
</TransformGroup>
</Grid.RenderTransform>
<TextBlock>Text</TextBlock>
</Grid>
</Expander.Header>
<Grid Height="100" RenderTransformOrigin="0.5,0.5">
<Grid.RenderTransform>
<TransformGroup>
<ScaleTransform ScaleY="1" ScaleX="-1" />
<SkewTransform AngleY="0" AngleX="0" />
<RotateTransform Angle="0" />
<TranslateTransform />
</TransformGroup>
</Grid.RenderTransform>
<TextBlock>Text</TextBlock>
</Grid>
</Expander>