為 UserControl 的不同實例傳遞變量

Question

我可以創建一個 UserControl，其中包含不同的元素，例如“Rectangle”和“TextBlock”，然后在“MainWindow.xaml”中調用該 UserControl 的實例，並將變量/值設置為 TextBlock 的“Text”元素，和矩形的“填充”？

因此，我可以在 MainWindow 中調用 UserControl 的一個實例，設置每個元素的值，以避免自己復制 UserControl XAML。

假設我有一個 MainWindow，它是許多網格的網格（比如 3 x 3），所有網格都具有相同的結構。 而不是創建這個 9 次：

  <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="2*"/>
            <RowDefinition Height="1*"/>
            <RowDefinition Height="1*"/>
        </Grid.RowDefinitions>
        <Rectangle Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2" Fill="{StaticResource colour1}"  RadiusX="20" RadiusY="20" Margin="5"/>
        <TextBlock Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2" Text="TITLE" HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="{StaticResource textColour1}" FontSize="16" FontWeight="Medium"/>
        <Rectangle Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="1" Grid.RowSpan="2" Fill="{StaticResource colour1}" RadiusX="25" RadiusY="25" Margin="5,0, 5, 0"/>
        <TextBlock Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="1" Text="TARGET" HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="{StaticResource textColour1}" />
        <Rectangle Grid.Row="1" Grid.Column="1" Grid.ColumnSpan="1" Grid.RowSpan="2" Fill="{StaticResource colour1}" RadiusX="25" RadiusY="25" Margin="5,0, 5, 0"/>
        <TextBlock Grid.Row="1" Grid.Column="1" Grid.ColumnSpan="1" Text="ACTUAL" HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="{StaticResource textColour1}" />
        <TextBlock Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="1" Text="0" HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="{StaticResource textColour1}" />
        <TextBlock Grid.Row="2" Grid.Column="1" Grid.ColumnSpan="1" Text="0" HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="{StaticResource textColour1}" />

    </Grid>

有沒有一種方法可以創建一個名為“AreaTile”的用戶控件，並綁定回 MainWindow XAML，然后在 MainWindow 中調用這些元素，例如：

        <Grid Grid.Row="0" Grid.Column="0">
            <local:AreaTile Title="FirstTitle" Colour="{StaticResource textColour1}"/>
        </Grid>

        <Grid Grid.Row="0" Grid.Column="1">
            <local:AreaTile Title="SecondTitle" Colour="{StaticResource textColour2}"/>
        </Grid>

        <Grid Grid.Row="0" Grid.Column="2">
            <local:AreaTile Title="ThirdTitle" Colour="{StaticResource textColour3}"/>
        </Grid>

我嘗試創建一個 TextBlock 樣式並在帶有“{Binding Path=Tag}”的“Text”上使用“Setter”，但這沒有用。

我也嘗試過使用 C#：

    public static readonly DependencyProperty myAreaNameProperty =
    DependencyProperty.Register("myAreaName", typeof(string), typeof(UserControl), new FrameworkPropertyMetadata(null));

但這似乎令人費解，而且我認為必須有一種方法可以完全使用 XAML 來做到這一點。

任何幫助將不勝感激。

Answer 1

最初，按照這個例子： WPF：將變量從父 xaml 傳遞到 usercontrol在我看來，MainWindow.xaml.cs（代碼隱藏）還需要聲明我想傳遞給 UserControl 實例的變量，它是不正確的。

在 MainWindow.xaml 中，我們可以使用<local:AreaTile../>創建實例，其中 local 是 UserControl 所在的命名空間。 如果它與解決方案資源管理器中的“MainWindow.xaml”不在同一文件夾中，您可以在標題中創建一個 xmlns 引用，例如：

<Window x:Class="MasterOverview.Views.MainViewWindow"
        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:MasterOverview.Views"
        xmlns:vms="clr-namespace:MasterOverview.ViewModels"
        mc:Ignorable="d"
        Title="MainWindow" Height="1000" Width="1800">

在 MainWindow.xaml 中，我們可以引用實例，如下所示。 “myAreaTile”是一個“自定義依賴屬性”，它是我們傳遞給 UserControl 實例的變量。 有用的鏈接： https ://www.tutorialspoint.com/wpf/wpf_dependency_properties.htm

    <Grid Grid.Row="0" Grid.Column="0">
        <local:AreaTile myAreaTitle="FirstTitle"/>
    </Grid>

    <Grid Grid.Row="0" Grid.Column="1">
        <local:AreaTile myAreaTitle="SecondTitle"/>
    </Grid>

    <Grid Grid.Row="0" Grid.Column="2">
        <local:AreaTile myAreaTitle="ThirdTitle"/>
    </Grid>

然后在 AreaTile.xaml.cs 中我們可以編寫 C#：

public partial class AreaTile : UserControl
{
    public static readonly DependencyProperty myAreaNameProperty =
    DependencyProperty.Register("myAreaName", typeof(string), typeof(UserControl), new FrameworkPropertyMetadata(null));

    public string myAreaName
    {
        get { return (string)GetValue(myAreaNameProperty); }
        set { SetValue(myAreaNameProperty, value); }
    }

    public AreaTile()
    {
        InitializeComponent();

        Loaded += AreaTileC_Loaded;
    }

    
    private void AreaTileC_Loaded(object sender, RoutedEventArgs e)
    {
        AreaTileC.Text = myAreaName;
    }
}

這是創建 DependancyProperty，對 XAML 命名為“myAreaTile”，對 AreaTile.xaml.cs（代碼隱藏）命名為“myAreaNameProperty”。 然后，我們創建一個名為“myAreaTile”的字符串，並使其等於 DependancyProperty，這是我們從 MainWindow.xaml 為每個 UserControl 實例獲取的值。 然后我們將 AreaTileC.Text 設置為等於本地字符串“myAreaTile”。

現在終於在 AreaTile.xaml 中，我們可以在 TextBlock 上使用 x:Name 屬性，例如：

    <TextBlock x:Name="AreaTileC"/>

希望這對某人有所幫助，如果我上面所說的任何內容不正確，請隨時發表評論。