在后面的代码中创建一个具有动态大小的 WPF 对象

Question

我想在 wpf 中使用网格绘制条形图。 由于设计问题，我创建了一个包含 6 行预定义行的网格，但如有必要可以添加更多行。

作为酒吧，我也想使用网格（矩形也可能是可能的，但我想稍后在其中写入文本，到目前为止使用网格更容易）

彼此相邻的所有条形将是主网格大小的 100%，而每个条形本身只是它们组合值的断裂（以 % 为单位）。 每个条形都在自己的行中，中间有一个小间隙。

我很难找到一种方法来将条形的大小设置为主网格大小的百分比。

到目前为止，我的代码如下所示：

XAML：

<Window x:Class="BarChart.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:BarChart"
    mc:Ignorable="d"
    Title="MainWindow" Height="350" Width="525">

<Grid Height="Auto" Width="Auto">
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <Grid Name="MainGrid">
        <Grid.RowDefinitions>
            <RowDefinition Height="4"/>
            <RowDefinition/>
            <RowDefinition Height="4"/>
            <RowDefinition/>
            <RowDefinition Height="4"/>
        </Grid.RowDefinitions>
    </Grid>
</Grid>

C＃：

    namespace BarChart
{
    /// <summary>
    /// tbd
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            int counter = 1;
            int counter_c = 0;
            double[] values = { 656, 333, 812 };
            SolidColorBrush[] colors = { new SolidColorBrush(Colors.Red), new SolidColorBrush(Colors.Green), new SolidColorBrush(Colors.Blue) };
            double maxValue = 0;
            foreach (double d in values)
            {
                maxValue = maxValue + d;
            }


        InitializeComponent();

        foreach (double d in values)
        {
            if(MainGrid.RowDefinitions.Count > counter)
            {
                RowDefinition row = new RowDefinition();
                MainGrid.RowDefinitions.Add(row);
                RowDefinition gap = new RowDefinition();
                gap.Height = new GridLength(4);
                MainGrid.RowDefinitions.Add(gap);

            }
            Grid gd = new Grid();
            gd.Width = d / maxValue * MainGrid.ActualWidth;
            gd.Background = colors[counter_c];
            Grid.SetRow(gd, counter);
            counter += 2;
            counter_c++;
            MainGrid.Children.Add(gd);
        }

    }
}

目前，高度和宽度（MainGrid.ActualWidth 当前为 0）似乎都没有设置为任何可用的值。 我希望我的条形图随每个窗口大小动态缩放（Ofc 我稍后也需要一个调整大小事件。但首先我需要能够绘制一次）。

Answer 1

看起来您正试图在构造函数中找到MainGrid.ActualWidth ，这将是在可视化创建控件之前。 为了解决这个问题，连接一个ContentRendered事件并将逻辑放在那里。

public MainWindow()
    {
        this.ContentRendered += MainWindow_ContentRendered;
        InitializeComponent();
    }

    private void MainWindow_ContentRendered(object sender, EventArgs e)
    {
        // Your Logic here...
    }

UserControls没有此事件，但您可以改用Loaded事件。

public YourUserControl()
    {
        this.Loaded += YourUserControl_Loaded;
        InitializeComponent();
    }

    private void YourUserControl_Loaded(object sender, RoutedEventArgs e)
    {
        // Your Logic here...
    }

这些事件将在控件创建后触发，您将能够看到具有适当值的ActualWidth属性。