1

leftmousebuttondown のアニメーションで四角形を塗りつぶしたいと考えています (これは後でロード時に実行するように変更されます)。

私の四角形は、渡されたデータに基づいてコードビハインドでキャンバスに描画されます（データの行ごとに1つの四角形）

現時点では静止画像で塗りつぶされていますが、この塗りつぶしをアニメーション、できればスピナーにしたいです。

私は Silverlight に非常に慣れていないため、これを達成する方法がわかりません。誰かが私を正しい方向に向けることができますか?

これまでの私のコード（一部）。

XAML:

<Canvas x:Name="Grid" Background="LightGray"></Canvas>

CS:

public partial class ProductView : UserControl
{
    Processing processingDialog = new Processing();

    private int colsRequired = 0;
    private int rowsRequired = 0;

    private const int minSize = 5;

    private int cellSize = 1;

    public ProductView()
    {
        InitializeComponent();
    }

    public void UpdateGrid(ObservableCollection<Product> productList)
    {
        calculateRowsCols(productList);
        drawGrid(productList);
    }

    public void calculateRowsCols(ObservableCollection<Product> productList)
    {
        int tileCount = productList.Count();
        double tileHeight = Grid.ActualHeight;
        double tileWidth = Grid.ActualWidth;

        if (tileCount == 0)
            return;

        double maxSize = Math.Sqrt((tileHeight * tileWidth) / tileCount);

        double noOfTilesHeight = Math.Floor(tileHeight / maxSize);

        double noOfTilesWidth = Math.Floor(tileWidth / maxSize);

        double total = noOfTilesHeight * noOfTilesWidth;
        cellSize = (maxSize < minSize) ? minSize : Convert.ToInt32(maxSize);

        while ((cellSize >= minSize) && (total < tileCount))
        {
            cellSize--;
            noOfTilesHeight = Math.Floor(tileHeight / cellSize);
            noOfTilesWidth = Math.Floor(tileWidth / cellSize);
            total = noOfTilesHeight * noOfTilesWidth;
        }

        rowsRequired = Convert.ToInt32(Math.Floor(tileHeight / cellSize));
        colsRequired = Convert.ToInt32(Math.Floor(tileWidth / cellSize));
    }

    private void drawCell(int row, int col, string label, Color fill)
    {
        Rectangle innertec = new Rectangle();
        innertec.Height = cellSize * 0.7;
        innertec.Width = cellSize * 0.9;
        innertec.StrokeThickness = 1;
        innertec.Stroke = new SolidColorBrush(Colors.Black);

        ImageBrush imageBrush = new ImageBrush();
        imageBrush.ImageSource = new BitmapImage(new Uri("Assets/loading.png", UriKind.Relative));
        innertec.Fill = imageBrush;

        Grid.Children.Add(innertec);
        Canvas.SetLeft(innertec, (col * cellSize) + ((cellSize - innertec.Width) / 2));
        Canvas.SetTop(innertec, row * cellSize + 4);

        Border productLabelBorder = new Border();
        Grid.Children.Add(productLabelBorder);
        Canvas.SetLeft(productLabelBorder, col * cellSize);
        Canvas.SetTop(productLabelBorder, row * cellSize);

        TextBlock productLabel = new TextBlock();
        productLabel.Margin = new Thickness(0, innertec.Height + 5, 0, 5);
        productLabel.TextAlignment = TextAlignment.Center;
        productLabel.TextWrapping = TextWrapping.NoWrap;
        productLabel.TextTrimming = TextTrimming.WordEllipsis;
        productLabel.MaxWidth = cellSize;
        productLabel.Height = cellSize * 0.3;
        productLabel.Width = cellSize;
        productLabel.Text = label;
        productLabel.HorizontalAlignment = HorizontalAlignment.Center;
        productLabel.VerticalAlignment = VerticalAlignment.Center;
        productLabel.FontSize = cellSize * 0.13;

        ToolTipService.SetToolTip(productLabel, label);
        productLabelBorder.Child = productLabel;

    }

    public void drawGrid(ObservableCollection<Product> data)
    {
        int dataIndex = 0;
        Grid.Children.Clear();

        for (int i = 0; i < rowsRequired; i++)
        {
            for (int j = 0; j < colsRequired; j++)
            {

                Product product = (dataIndex < data.Count) ? data.ElementAt(dataIndex) : null;

                if (product != null)
                {
                    drawCell(i, j, product.productName, Colors.White);
                }
                dataIndex++;
            }
        }
    }
}

正しい方向へのポインタでさえ、誰でも与えることができるどんな助けも素晴らしいでしょう.

前もって感謝します

4

1 に答える 1

1

四角形からやりたいことすべてをカプセル化するカスタム コントロールを作成してみてください。新しい VisualState "MouseDownState" を追加し、xaml で必要なアニメーションを実行できます。実装に関する詳細が必要な場合はお知らせください。遅れて、長方形の代わりに新しいコントロールを追加するだけです。

于 2011-03-30T10:21:01.893 に答える