3

そのため、組み合わせようとしている 2 つのトグル ボタンがあります。したがって、最初のボタンは、IsChecked が true か false かに基づいて画像を切り替えますが、このボタンの周りには境界線があり、それを取り除くことはできません。

2 番目のトグル ボタンには境界線がなく、クリックしても点滅しませんが、その状態に基づいて画像が変更されることもありません。

私が望むのは、両方の長所です。画像を変更し、境界線を取り除きます。私はちょうど23のことを試しましたが、どれもうまくいきません。

私が使用しているコードは次のとおりです。

<ToggleButton x:Name="changeButBorderedBlinky" Margin="0,12,194,0" Width="82" Height="82" Background="Transparent" Padding="-1"  Focusable="false" VerticalAlignment="Top" HorizontalAlignment="Right">

        <ToggleButton.Style>
            <Style TargetType="{x:Type ToggleButton}">
                <Setter Property="Content">
                    <Setter.Value>
                        <Border BorderThickness="0"  >
                            <Image Source="images/buttonimages/back2.png" Stretch="Fill"  />
                        </Border>
                    </Setter.Value>
                </Setter>
                <Style.Triggers>
                    <Trigger Property="IsChecked" Value="True">
                        <Setter Property="Content">
                            <Setter.Value>
                                <Border  BorderThickness="0" >
                                    <Image Source="images/buttonimages/back.png" Stretch="fill" />
                                </Border>
                            </Setter.Value>
                        </Setter>
                    </Trigger>
                </Style.Triggers>
            </Style>
        </ToggleButton.Style>

    </ToggleButton>
    <ToggleButton x:Name="noChangeNoBorder"  Margin="0,12,104,0" VerticalAlignment="Top" HorizontalAlignment="Right" Height="80" Width="80" >
        <ToggleButton.Template>
            <ControlTemplate TargetType="{x:Type ToggleButton}">
                <Border x:Name="border"  >
                    <Image x:Name="img" Source="images/buttonimages/back2.png"  />
                </Border>
            </ControlTemplate>
        </ToggleButton.Template>

    </ToggleButton>

これについて助けてくれてありがとう。それは私を狂気に駆り立てています。

4

2 に答える 2

7

いずれの場合も、カスタマイズ オプションは無限大です。Expression Blend を試したことがありますか? これにはVisual Studio 2013 Community (無料で使用できます) が付属しており、どちらのコントロールも自由にカスタマイズできます。

ここでは、Expression Blend を使用して、まばたきなし、境界線なし、画像の入れ替えを行っています。

        <ToggleButton x:Name="changeButBorderedBlinky" Margin="0,12,194,0" Width="82" Height="82" Background="Transparent" Padding="-1"  Focusable="false" VerticalAlignment="Top" HorizontalAlignment="Right">
        <ToggleButton.Template>
            <ControlTemplate TargetType="{x:Type ButtonBase}">
                <ContentPresenter x:Name="contentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                <ControlTemplate.Triggers>
                    <Trigger Property="Button.IsDefaulted" Value="True"/>
                    <Trigger Property="IsMouseOver" Value="True"/>
                    <Trigger Property="IsPressed" Value="True"/>
                    <Trigger Property="ToggleButton.IsChecked" Value="True"/>
                    <Trigger Property="IsEnabled" Value="False">
                        <Setter Property="TextElement.Foreground" TargetName="contentPresenter" Value="#FF838383"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </ToggleButton.Template>
        <ToggleButton.Style>
            <Style TargetType="{x:Type ToggleButton}">
                <Setter Property="Content">
                    <Setter.Value>
                        <Border BorderThickness="0"  >
                            <Image Source="images/buttonimages/back2.png" Stretch="Fill"  />
                        </Border>
                    </Setter.Value>
                </Setter>
                <Style.Triggers>
                    <Trigger Property="IsChecked" Value="True">
                        <Setter Property="Content">
                            <Setter.Value>
                                <Border  BorderThickness="0" >
                                    <Image Source="images/buttonimages/back.png" Stretch="fill" />
                                </Border>
                            </Setter.Value>
                        </Setter>
                    </Trigger>
                </Style.Triggers>
            </Style>
        </ToggleButton.Style>

    </ToggleButton>
于 2014-12-07T02:18:41.577 に答える
1

最初の ToggleButton に関連するわずかに変更された XAML を使用してみてください。

<ToggleButton x:Name="changeButBorderedBlinky" 
              Margin="0,12,194,0"
              Width="82" Height="82" 
              Background="Transparent" 
              Padding="-1"  
              Focusable="false" 
              VerticalAlignment="Top" HorizontalAlignment="Right">

        <ToggleButton.Style>
            <Style TargetType="{x:Type ToggleButton}">
                <Setter Property="BorderThickness" Value="0"/>
                <Setter Property="Content">
                    <Setter.Value>

                        <Image Source="images/buttonimages/back2.png" Stretch="Fill"  />

                    </Setter.Value>
                </Setter>
                <Style.Triggers>
                    <Trigger Property="IsChecked" Value="True">
                        <Setter Property="Content">
                            <Setter.Value>

                                <Image Source="images/buttonimages/back.png" Stretch="fill" />

                            </Setter.Value>
                        </Setter>
                    </Trigger>
                </Style.Triggers>
            </Style>
        </ToggleButton.Style>
    </ToggleButton>

次のように、他のプロパティをカスタマイズすることもできます。

  <Setter Property="Background" Value="#FF1F3B53"/>
  <Setter Property="Foreground" Value="#FF000000"/>
  <Setter Property="BorderBrush" Value="Transparent">

その他のスタイリング オプションについては、http: //msdn.microsoft.com/en-us/library/cc296245%28v=vs.95%29.aspxを参照してください。

これが役立つことを願っています。よろしく、

于 2014-12-07T00:06:44.920 に答える