xaml reference子要素を含む要素

Question

同じ境界線とその子要素を含む複数のページがあります。 各ページは

<Border Grid.Column="1" Style="{StaticResource InstructionBox}" x:name="staticBorder"> 
    <Grid> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="5*"/> 
      <ColumnDefinition Width="5*"/> 
     </Grid.ColumnDefinitions> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="100"/> 
      <RowDefinition Height="20"/> 
      <RowDefinition Height="*"/> 
     </Grid.RowDefinitions> 

     <Button Style="{StaticResource OnlyContentStyle}" Grid.Row="0" Grid.Column="0" 
       Click="Instruction_Click"> 
      <Border > 
       <TextBlock Style="{StaticResource InstructionStyle}"> 
       </TextBlock> 
      </Border> 
     </Button> 

     <Button Style="{StaticResource OnlyContentStyle}" Grid.Row="0" Grid.Column="1" 
       Click="Logs_Click"> 
      <Border > 
       <TextBlock Style="{StaticResource LogStyle}"> 
       </TextBlock> 
      </Border> 
     </Button> 
     <Border Grid.Row="2" Grid.ColumnSpan="2" x:Name="InstructionBorder"> 
      <StackPanel x:Name="PanelInstructions" Style="{StaticResource InstructionTextStyle}"> 
      </StackPanel> 
     </Border> 
    </Grid> 
</Border> 

すべてを通して、このボーダー私のページの参照を作成する方法はあり

を持っていますか？

ありがとうございました

Answer 1

いいえ、直接的な方法はありません。 XAMLでは、要素がVisual Treeの単一の場所にのみ存在することができます。これを行うには、ボーダーをユーザーコントロールに変換する必要があります。これを行うにはいくつかの方法があります。以下の例では、依存関係プロパティを使用して、ユーザーコントロールのコードの最初のボタンの可変コンテンツを提供しました。 clickイベントの場合は、ICommand実装にbuttonsコマンドをバインドすることをお勧めしますが、MVVMを実行する必要があります。このサンプルは代わりにRoutedEventHandlerを追加します。

public static readonly DependencyProperty InstructionButtonContentProperty = DependencyProperty.Register(
    "InstructionButtonContent", typeof(FrameworkElement), typeof(InstructionBoxControl), new PropertyMetadata(default(FrameworkElement))); 

public FrameworkElement InstructionButtonContent 
{ 
    get { return (FrameworkElement) GetValue(InstructionButtonContentProperty); } 
    set { SetValue(InstructionButtonContentProperty, value); } 
} 

public event RoutedEventHandler InstructionButtonClicked; 

public InstructionBoxControl() 
{ 
    InitializeComponent(); 
} 

private void InstructionButtonClick(object sender, RoutedEventArgs e) 
{ 
    InstructionButtonClicked?.Invoke(sender, e); 
} 

ほとんどの場合、境界線をユーザーコントロールのXAMLに貼り付けることができます。次に、動的パーツをユーザーコントロールのDependencyPropertiesにバインドする必要があります。また、ボタンのクリックイベントコールを上のコードのRoutedEventHandlerに接続します。

<Border > 
    <Grid> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="5*" /> 
      <ColumnDefinition Width="5*" /> 
     </Grid.ColumnDefinitions> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="100" /> 
      <RowDefinition Height="20" /> 
      <RowDefinition Height="*" /> 
     </Grid.RowDefinitions> 

     <Button Grid.Row="0" 
       Grid.Column="0" 
       Click="InstructionButtonClick"> 
      <Border> 
       <ContentPresenter Content="{Binding Path=InstructionButtonContent, RelativeSource={RelativeSource AncestorType={x:Type local:InstructionBoxControl}}}"/> 
      </Border> 
     </Button> 

あなたはそのように好きなページにボーダーの新しいユーザーコントロールのインプレースを使用することができます。

<local:InstructionBoxControl InstructionButtonClicked="InstructionBoxControl_OnInstructionButtonClicked"> 
    <local:InstructionBoxControl.InstructionButtonContent> 
     <TextBlock>Instructions</TextBlock> 
    </local:InstructionBoxControl.InstructionButtonContent> 
</local:InstructionBoxControl> 

他のボタンとsatckpanelも同様に動作するはずです。