4

誰かが私に、画像のサムネイルを表示するコントロールをSilverlightに実装して、カーソルを合わせると大きなサイズに拡大する方法についてアドバイスをいただけますか？

4

3 に答える 3

2

ボタンについても同様のことをしました。そのためのコードは次のとおりです。代わりに画像を操作するように簡単に適応できると確信しています。このコードを実際にリリースしたことはないことに注意してください。これは、Silverlight を学んでいたときの単なる実験でした。ベストプラクティスの例として取り上げないでください。

XAML:

<UserControl x:Class="GrowingButton.Page"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    Width="400" Height="300">
    <Grid x:Name="LayoutRoot" Background="White">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>

        <Grid.Resources>
            <Storyboard x:Name="growStoryboard">
                <DoubleAnimation
                    Storyboard.TargetProperty="Width"
                    Storyboard.TargetName="testButton"
                    Duration="0:0:0.1"
                    By="20">
                </DoubleAnimation>
                <DoubleAnimation
                    Storyboard.TargetProperty="Height"
                    Storyboard.TargetName="testButton"
                    Duration="0:0:1"
                    By="-20">
                </DoubleAnimation>
            </Storyboard>
            <Storyboard x:Name="shrinkStoryboard">
                <DoubleAnimation
                    Storyboard.TargetProperty="Width"
                    Storyboard.TargetName="testButton"
                    Duration="0:0:1"
                    By="-20">
                </DoubleAnimation>
                <DoubleAnimation
                    Storyboard.TargetProperty="Height"
                    Storyboard.TargetName="testButton"
                    Duration="0:0:0.1"
                    By="20">
                </DoubleAnimation>
            </Storyboard>
        </Grid.Resources>
        <Button x:Name="testButton" Content="Test" Grid.Column="1" MouseEnter="Button_MouseEnter" MouseLeave="Button_MouseLeave" VerticalAlignment="Center" HorizontalAlignment="Center" Width="50" Height="50">
        </Button>
    </Grid>
</UserControl>

コード：

public partial class Page : UserControl
{
    public Page()
    {
        InitializeComponent();
    }

    private void Button_MouseEnter(object sender, MouseEventArgs e)
    {
        this.shrinkStoryboard.SkipToFill();
        this.growStoryboard.Begin();
    }

    private void Button_MouseLeave(object sender, MouseEventArgs e)
    {
        this.growStoryboard.SkipToFill();
        this.shrinkStoryboard.Begin();
    }
}
于 2009-09-10T14:05:46.783 に答える
1

コントロールに MouseOver 状態の VisualState がある限り、DoubleAnimation(またはDoubleAnimationUsingKeyframes) を使用してコントロールでScaleTransformを実行できます。

サムネイル/画像コントロールのさまざまな VisualStates (VisualStateGroup 内) を作成すると、コード ビハインドでイベントを配線する手間が省けます。Blend でさまざまなスケーリングを視覚的に定義することもできます。これは便利な機能です。

于 2009-09-10T14:05:22.347 に答える
0

このページ - Fish Eye Menuには、あなたが望むものと同様のことを行う例があります。Silverlight がインストールされているにもかかわらず、何らかの理由で Silverlight のバージョンが表示されません。Silverlight 2 に含まれていることと関係があるかもしれません。

于 2009-09-11T09:43:42.203 に答える