0

私はRadioButton、ユーザーが選択しRadioButtonた .

ただし、私のアプリケーションでは、5 つRadioButtonsが無効になってから再び有効になる場合があります。これが発生するVisualStateと、Checked RadioButtonがアクティブになりません。代わりに、5 つすべてが通常の状態RadioButtonsとして表示されます。

なぜこうなった?どうすればこれを解決できますか?

RadioButtonsこれが私が使用しているの例です。

ラジオボタンのビジュアルステート

5 の最初のグループを選択することから始めて、選択RadioButtonsを行うと、上の画像のようにすべてが表示される場合があります。

しかし、5 の 2 番目のグループを選択するRadioButtonsと、最初のグループが無効になるようにコントロールが設計されています。これは正常に機能し、2 番目のグループが適切に有効になります。その後、最初のグループを再度選択すると、すべてRadiobuttonNormal VisualStateで表示されます。私のプログラムは#1がまだCheckedであることを舞台裏で知っているので、これは問題です。Checked VisualStateはトリガーされないため、次のようになります。

RadioButton VisualStates (エラー)

ここでの目標は、最初の画像に表示されているようにChecked VisualStateが再開されることです。

に対応する XAML コードは次のVisualStatesとおりです。

<VisualStateManager.VisualStateGroups>
    <VisualStateGroup x:Name="CommonStates">
        <VisualState Name="Normal"/>
        <VisualState Name="Disabled">
            <Storyboard>
                <ColorAnimation Storyboard.TargetName="FillBrush" Storyboard.TargetProperty="Color" To="#FFEEEEEE" Duration="0"/>
                <ColorAnimation Storyboard.TargetName="StrokeBrush" Storyboard.TargetProperty="Color" To="#FF777777" Duration="0"/>
                <DoubleAnimation Storyboard.TargetName="MoodEllipse" Storyboard.TargetProperty="StrokeThickness" To="1" Duration="0"/>
                <ColorAnimation Storyboard.TargetName="Presenter" Storyboard.TargetProperty="(TextBlock.Foreground).Color" To="#FF777777" Duration="0"/>
            </Storyboard>
        </VisualState>
    </VisualStateGroup>
    <VisualStateGroup x:Name="CheckStates">
        <VisualState Name="Checked">
            <Storyboard>
                <ParallelTimeline>
                    <ColorAnimation Storyboard.TargetName="FillBrush" Storyboard.TargetProperty="Color" To="#FFC5F5FF" Duration="0:0:0.05"/>
                    <ColorAnimation Storyboard.TargetName="StrokeBrush" Storyboard.TargetProperty="Color" To="#FF12394F" Duration="0:0:0.05"/>
                    <DoubleAnimation Storyboard.TargetName="MoodEllipse" Storyboard.TargetProperty="StrokeThickness" To="2" Duration="0:0:0.05"/>
                </ParallelTimeline>
            </Storyboard>
        </VisualState>
        <VisualState Name="Unchecked"/>
        <VisualState Name="Indeterminate"/>
    </VisualStateGroup>
</VisualStateManager.VisualStateGroups>

この XAML コードは の使い方に従っているようですVisualStatesが、何か問題があるのではないでしょうか。

これらのページを参照しました:

追加のメモとして、 Uncheckedのいずれかをクリックすると、 Checked がトリガーされる可能性があることに気付きました。この時点で、グループが無効化されて再度有効化されるまで、すべてが正常に動作します。VisualState RadioButtonsRadioButtons

また、上記の XAML コードに空のUncheckedを含めなかった場合、 Checked のさらに奇妙な動作を経験しました。VisualState VisualState

が奇妙な動作をしている理由についての洞察をVisualStatesいただければ幸いです。どうもありがとう!

編集:

それが問題かどうかはわかりませんが、のグループRadioButtonsは無効になっています。これは、StackPanelsそのプロパティが outsideのプロパティIsEnabledにバインドされているためです。RadioButtonIsChecked

<StackPanel IsEnabled="{Binding RelativeSource={RelativeSource AncestorType={x:Type RadioButton}}, Path=IsChecked}">
4

1 に答える 1

1

VisualStateGroupsどうやら問題は、2 つの異なる内で同じターゲット プロパティを使用していることですが、なぜこれが問題を引き起こすのかわかりません

再度有効にした後にチェック済みの動作を表示するという目的の効果を得るために、Ellipse元の動作をオーバーレイする別の動作を作成しましたEllipse

オリジナルEllipseは完全に不透明で、そのFill/StrokeプロパティはCheckStatesグループによってのみ変更されます。

新規Ellipseは最初は完全に透明 ( Opacity="0") ですが、無効状態により不透明度が完全に不透明に変わります。

この新しいビューがフェード インし、チェック済み/チェックなしの状態の外観を示してEllipseいる元の を覆い隠します。これにより、 の全体的な結果がDisabledと表示されます。EllipseRadioButton

これにより、OP で説明されている問題が修正されましたが、新しい問題が発生しました。無効状態からチェック済み状態への移行は即時です。これはVisualTransitionCommonStatesグループにこれを含めることで解決できます。

<VisualTransition From="Disabled" To="Checked" GeneratedDuration="0:0:0.25"/>

問題を解決するために使用される最終的な XAML は次のとおりです。

<VisualStateManager.VisualStateGroups>
    <VisualStateGroup x:Name="CommonStates">
        <VisualStateGroup.Transitions>
            <VisualTransition From="Disabled" To="Checked" GeneratedDuration="0:0:0.25"/>
        </VisualStateGroup.Transitions>
        <VisualState Name="Normal"/>
        <VisualState Name="Disabled">
            <Storyboard>
                <DoubleAnimation Storyboard.TargetName="EllipseOverlay" Storyboard.TargetProperty="Opacity" To="1" Duration="0:0:0.15"/>
            </Storyboard>
        </VisualState>
    </VisualStateGroup>
    <VisualStateGroup x:Name="CheckStates">
        <VisualState Name="Checked">
            <Storyboard>
                <ParallelTimeline>
                    <ColorAnimation Storyboard.TargetName="FillBrush" Storyboard.TargetProperty="Color" To="#FFC5F5FF" Duration="0:0:0.05"/>
                    <ColorAnimation Storyboard.TargetName="StrokeBrush" Storyboard.TargetProperty="Color" To="#FF12394F" Duration="0:0:0.05"/>
                    <DoubleAnimation Storyboard.TargetName="MoodEllipse" Storyboard.TargetProperty="StrokeThickness" To="2" Duration="0:0:0.05"/>
                </ParallelTimeline>
            </Storyboard>
        </VisualState>
        <VisualState Name="Unchecked"/>
        <VisualState Name="Indeterminate"/>
    </VisualStateGroup>
</VisualStateManager.VisualStateGroups>

私のコントロールでは、これをEllipse元の の後Ellipseに表示し、不透明度が上がると新しいものが一番上に表示されるようにします。以下は新しいEllipseです:

<Ellipse x:Name="EllipseOverlay" StrokeThickness="1" Opacity="0" Fill="#FFEEEEEE" Stroke="#FF777777"/>

これには、OP のDisabledを使用していたFill/StrokeEllipseプロパティが含まれていることに注意してください。 VisualState

于 2014-09-12T15:53:49.110 に答える