1

我希望能够在 leftmousebuttondown 上用动画填充一个矩形（稍后将更改为在加载时运行）。

根据传递的数据（每行数据一个矩形），我的矩形被绘制到代码后面的画布上

目前它们充满了静态图像，但我希望这个 Fill 是一个动画，如果可以的话，一个微调器。

我对 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 回答