Question

我是Windows app developpemnt的新手：

我有一个场景，我需要在下方显示按钮矩阵，我能够做到这一点，但这里的问题是矩阵可以是任何东西2x2,2x3,2x4或2x6。

但按钮应该是方形而不是矩形，如果我向其添加图像，则图像看起来很拉伸。

这是我的代码：

public partial class MainPage : PhoneApplicationPage
    {

        int numberOfColumns = 2;
        int numberOfRows = 3;
        public double cellWidth;
        public double cellHeight;

        // Constructor
        public MainPage()
        {
            InitializeComponent();

            this.Loaded += new RoutedEventHandler(SetGridCellWidthAndHeight);

        }

       void SetGridCellWidthAndHeight(object sender, RoutedEventArgs e)
        {
            cellWidth = GridWindows.ActualHeight / numberOfColumns;
            cellHeight = GridWindows.ActualHeight / numberOfRows;
            this.GridWindows.Children.Add(SetUpGridLayout());
        }

        private Grid SetUpGridLayout()
        {
            Grid grid = new Grid();
            grid.Background = new SolidColorBrush(Colors.White);

            // Create column and row definitions.
            ColumnDefinition[] columnDefinition = new ColumnDefinition[numberOfColumns];
            RowDefinition[]  rowDefinition = new RowDefinition [numberOfRows];

            for (int i = 0; i < columnDefinition.Count(); i++)
            {
                columnDefinition[i] = new ColumnDefinition();
                grid.ColumnDefinitions.Add(columnDefinition[i]);
            }

            for (int i = 0; i < rowDefinition.Count(); i++)
            {
                rowDefinition[i] = new RowDefinition();
                grid.RowDefinitions.Add(rowDefinition[i]);
            }

            int count = 1;

                for (int row = 0; row < numberOfRows; row++)
                {
                    for (int column = 0; column < numberOfColumns; column++)
                    {
                        StackPanel gridViewStackPlanel = new StackPanel();
                        gridViewStackPlanel.Background = new SolidColorBrush(Colors.White);

                        Button button = new Button();
                        button.Width = cellWidth*0.8;
                        button.Height = cellHeight *0.8;
                        //topicButton.Background = new SolidColorBrush(Colors.Red);
                        button.VerticalAlignment = VerticalAlignment.Center;
                        button.HorizontalAlignment = HorizontalAlignment.Center;
                         button.Background = new SolidColorBrush(Colors.Red);

                        //To display the Topic name
                        TextBlock name= new TextBlock();
                        name.Text = " Value" + count;
                        name.Foreground = new SolidColorBrush(Colors.Black);
                        name.HorizontalAlignment = HorizontalAlignment.Center;

                        gridViewStackPlanel.Children.Add(button);
                        gridViewStackPlanel.Children.Add(name);

                        count++;

                        grid.Children.Add(gridViewStackPlanel);
                        Grid.SetColumn(gridViewStackPlanel, column);
                        Grid.SetRow(gridViewStackPlanel, row);
                    }
                }
          return grid;

        }

Answer 1

当您编写如下代码时：

button.Width = cellWidth * 0.8;
button.Height = cellHeight * 0.8;

只有在cellWidth == cellHeight时才会得到一个正方形。这很可能不是真的。所以你的宽度和高度是不同的。考虑用以下内容替换上面的内容：

cellWidth = Math.Min(GridWindows.ActualHeight / numberOfColumns, GridWindows.ActualHeight / numberOfRows);

button.Width = cellWidth * 0.8;
button.Height = cellWidth * 0.8;

现在它将成为正方形。

动态设置按钮宽度和高度

1 个答案: