0

どのような戦略を取るべきか迷っています。次のことを行う必要があります。

基本クラスとしてトグルボタンがあります。このボタンには、通常のボタンとしてのすべてのプロパティに加えて、ボタンがトグルされているかどうかを示す IsChecked があります。

ToggleButton のスタイル (またはテンプレート) を作成したいと考えています。基本的に、ToggleButton から元のスタイルを継承し、これを追加する必要があります。

IsChecked=True: ToolTip を「Collapse」に設定し、このコンテンツを表示します (マイナス記号)

<Path Margin="2" Stroke="ForeGround property on control" Data="M0,5 H10" StrokeThickness="3" />

IsChecked=False、ToolTip tp "Expand" を設定し、このコンテンツを表示 (プラス記号)

<Path Margin="2" Stroke="ForeGround property on control" Data="M0,5 H10 M5,0 V10" StrokeThickness="3" />

私はいくつかのアプローチを試みましたが、解決できない例外が常に発生しました。

もう 1 つの方法は、コンテンツを 1 つだけ (プラス記号) にして、2 行に分割することです。

<Grid>
    <Path Margin="2" Stroke="ForeGround property on control" Data="M0,5 H10" StrokeThickness="3" />
    <Path x:Name="verticalLine" Margin="2" Stroke="ForeGround property on control" Data="M5,0 V10" StrokeThickness="3" />
</Grid>

また、展開/折りたたみ状態に基づいて、verticalLine の可視性を変更します。

私はいくつかの進歩を遂げました：

<Style x:Key="myToggleButtonStyle" TargetType="ToggleButton" BasedOn="{StaticResource ToggleButtonStyle}">
    <Setter Property="ContentTemplate">
        <Setter.Value>
            <Grid>
                <Path Margin="2" Stroke="Black" Data="M0,5 H10" StrokeThickness="3" />
                <Path x:Name="verticalLine" Margin="2" Stroke="Black" Data="M5,0 V10"  StrokeThickness="3" />
            </Grid>
        </Setter.Value>
    </Setter>

    <Style.Triggers>
        <Trigger Property="IsChecked" Value="True">
            <Trigger.EnterActions>
                <BeginStoryboard>
                    <Storyboard>
                        <ObjectAnimationUsingKeyFrames Storyboard.Target="verticalLine" Storyboard.TargetProperty="Visibility">
                            <DiscreteObjectKeyFrame KeyTime="0">
                                <DiscreteObjectKeyFrame.Value>
                                    <Visibility>Collapsed</Visibility>
                                </DiscreteObjectKeyFrame.Value>
                            </DiscreteObjectKeyFrame>
                        </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                </BeginStoryboard>
            </Trigger.EnterActions>
            <Trigger.ExitActions>
                <BeginStoryboard>
                    <Storyboard>
                        <ObjectAnimationUsingKeyFrames Storyboard.Target="verticalLine" Storyboard.TargetProperty="Visibility">
                            <DiscreteObjectKeyFrame KeyTime="0">
                                <DiscreteObjectKeyFrame.Value>
                                    <Visibility>Visible</Visibility>
                                </DiscreteObjectKeyFrame.Value>
                            </DiscreteObjectKeyFrame>
                        </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                </BeginStoryboard>
            </Trigger.ExitActions>
        </Trigger>
    </Style.Triggers>
</Style>

私が今できない唯一のことは、ストロークをトグルボタンの前景色に設定することです。TemplatedParent から AncestorType まで、覚えていることをすべて試しましたが、成功しませんでした。

4

2 に答える 2

0

わかりました、これが最終的な解決策です：

<Style x:Key="MyToggleButtonStyle" TargetType="ToggleButton" BasedOn="{StaticResource ToggleButtonStyle}}">
    <Setter Property="ContentTemplate">
        <Setter.Value>
            <DataTemplate>
                <Grid>
                    <Path Margin="4" Data="M0,5 H10" Stretch="UniformToFill" Stroke="{TemplateBinding Control.Foreground}" StrokeThickness="3" />
                    <Path x:Name="verticalLine" Margin="4" Data="M5,0 V10" Stretch="UniformToFill" Stroke="{TemplateBinding Control.Foreground}" StrokeThickness="3" />
                </Grid>
                <DataTemplate.Triggers>
                    <DataTrigger Binding="{Binding IsChecked, RelativeSource={RelativeSource TemplatedParent}}" Value="True">
                        <DataTrigger.EnterActions>
                            <BeginStoryboard>
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="verticalLine" Storyboard.TargetProperty="Visibility">
                                        <DiscreteObjectKeyFrame KeyTime="0">
                                            <DiscreteObjectKeyFrame.Value>
                                                <Visibility>Collapsed</Visibility>
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </BeginStoryboard>
                        </DataTrigger.EnterActions>
                        <DataTrigger.ExitActions>
                            <BeginStoryboard>
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="verticalLine" Storyboard.TargetProperty="Visibility">
                                        <DiscreteObjectKeyFrame KeyTime="0">
                                            <DiscreteObjectKeyFrame.Value>
                                                <Visibility>Visible</Visibility>
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </BeginStoryboard>
                        </DataTrigger.ExitActions>
                    </DataTrigger>
                </DataTemplate.Triggers>
            </DataTemplate>
        </Setter.Value>
    </Setter>
</Style>
于 2012-09-13T20:31:44.863 に答える
0

プロパティ Path.Dataに従ってを変更してみてください。ToggleButtons IsChecked

                  <ToggleButton.Style>
                        <Style TargetType="ToggleButton">
                            <Setter Property="ToolTip" Value="Collapsed"/>
                            <Setter Property="Content">
                                <Setter.Value>
                                    <Path Margin="2" Stroke="{Binding Foreground, RelativeSource={RelativeSource AncestorType=ToggleButton}}" StrokeThickness="3">
                                        <Path.Style>
                                            <Style TargetType="Path">
                                                <Setter Property="Data" Value="M0,5 H10 M5,0 V10 "/>
                                                <Style.Triggers>
                                                    <DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType=ToggleButton}, Path=IsChecked}" Value="True">
                                                        <Setter Property="Data" Value="M0,5 H10"/>
                                                    </DataTrigger>
                                                </Style.Triggers>
                                            </Style>
                                        </Path.Style>
                                    </Path>
                                </Setter.Value>
                            </Setter>
                            <Style.Triggers>
                                <Trigger Property="IsChecked" Value="True">
                                    <Setter Property="ToolTip" Value="Expanded"/>
                                </Trigger>
                            </Style.Triggers>
                        </Style>
                    </ToggleButton.Style>
于 2012-09-13T20:05:48.913 に答える