0

私はWPFでこれImageを持っていました：Button

<Image HorizontalAlignment="Left" Height="31.627" VerticalAlignment="Top" Width="32" Margin="21,80.373,0,0" Source="Images\computer.png"/>
<Button FontWeight="Bold" FontSize="12" Content=swethapilli" Height="31.627" VerticalAlignment="Top" Margin="57,80.373,95.296,0"/>

これで、次のように表示されます。

ここに画像の説明を入力してください

Image今の私の要件は、またはにマウスを合わせるときButtonです。矢印の画像が下の画像のように表示されると、テキスト（swethapilli）が右に移動し、強調表示されます。

このように表示されます

このスタイルを取得する方法は、誰でも解決策を見つけるのを手伝ってください。ありがとうございました。

4

1 に答える 1

0

最も簡単な方法は、次のように、マウスが上にあるときにボタンの背景として使用できる画像を作成することだと思います。

    <Style x:Key="SwitchButtonStyle" TargetType="Button">
        <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Background">
                    <Setter.Value>
                        <ImageBrush ImageSource="yourimagepath.ending"></ImageBrush>
                    </Setter.Value>
                </Setter>
                <Setter Property="HorizontalContentAlignment" Value="Right"/>
            </Trigger>
         </Style.Triggers>
     </Style>

編集：コンテンツを配置するためのより柔軟な方法は次のとおりです。

ボタンのコンテンツとしてTextBlockを取ります。

            <Button.Content>
                <TextBlock Text="YourTextOrBinding" Style="{DynamicResource ResourceKey=TextBlockOnButtonStyle}"></TextBlock>
            </Button.Content>

TextBlockOnButtonStyle：

    <Style x:Key="TextBlockOnButtonStyle" TargetType="TextBlock">
        <Style.Triggers>
            <DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType={x:Type Button}}, Path=IsMouseOver}" Value="True">
                <Setter Property="Margin" Value="10,0,0,0"></Setter>
            </DataTrigger>
        </Style.Triggers>
    </Style>

セッター値の10は、マウスがボタンの上にある場合にテキストが右に移動するピクセル数です。

編集2：画像全体の代わりに長方形をボタンの背景として使用したい場合は、次のように行うことができます。

        <DockPanel Width="100" Height="30">
            <Rectangle Visibility="{Binding ElementName=btnMain, Path=IsMouseOver, Converter={StaticResource ResourceKey=BoolToVis}}" Width="25">
                <Rectangle.Fill>
                    <whateveryouwanttousetofilltheimage>
                </Rectangle.Fill>
            </Rectangle>
            <Button Name="btnMain" Content="YourContentOrBinding"/>
        </DockPanel>

ここでは、長方形の可視性をボタンIsMouseOver-propertyにバインドし、出力をBooleanToVisibilityConverterで変換しました。

于 2012-12-14T07:16:05.353 に答える