Cómo colocar un control de usuario XAML en una cuadrícula

Question

Tengo los siguientes main.xaml y usercontrol.

Necesito colocar varias veces el control del usuario en la 2da fila, 2da columna de la grilla, Al usar Visual Studio no permitiré arrastrar y soltar el control del usuario, entonces supongo que tengo que hacerlo por código, Acabo de no saber cómo

MainPage.xaml

<Grid HorizontalAlignment="Left" Height="768" VerticalAlignment="Top" Width="1366" x:Name="grid" Background="Black"> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="150"/> 
      <RowDefinition/> 
     </Grid.RowDefinitions> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition/> 
      <ColumnDefinition Width="250"/> 
     </Grid.ColumnDefinitions> 
     <Border BorderBrush="White" BorderThickness="3" Grid.Column="1" Background="Red" CornerRadius="30"/> 
     <TextBlock x:Name="txtCountry" Grid.Column="1" TextWrapping="Wrap" FontSize="36" HorizontalAlignment="Center" VerticalAlignment="Center"/> 
     <TextBlock x:Name="txtTime" Grid.Row="1" TextWrapping="Wrap" FontSize="180" HorizontalAlignment="Center" VerticalAlignment="Center"/> 
    </Grid> 

Usercontrol

<UserControl 
    x:Class="AlarmPro.TimeOnCity" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:local="using:AlarmPro" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    mc:Ignorable="d" 
    d:DesignHeight="150" 
    d:DesignWidth="250"> 

    <Grid Background="Black"> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="30"/> 
      <RowDefinition/> 
     </Grid.RowDefinitions> 
     <Border BorderBrush="#FFDE6A6A" BorderThickness="1" Grid.Row="0" Grid.Column="0" Background="#FFDC4646"> 
      <TextBlock TextWrapping="Wrap" Text="TextBlock" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="16"/> 
     </Border> 
     <Border BorderBrush="Black" BorderThickness="1" Grid.Row="1" Background="#FFAE4F00"> 
      <TextBlock TextWrapping="Wrap" Text="TextBlock" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="36"/> 
     </Border> 

    </Grid> 
</UserControl> 

Answer 1

¿Te refieres a esto?

<my:UserControlName Grid.Column="2" Grid.Row="2" ... /> 

<my: en este caso es el alias para el espacio de nombres CLR reside en la UserControl. Se define en la parte superior de su XAML, dentro de la etiqueta o <Window><UserControl> dependiendo del contexto.

Por ejemplo,

<Window ... 
    xmlns:my="clr-namespace:AssemblyName" 
    ... 
/> 

Answer 2

MainPage.xaml

<Page 
    x:Class="UserControlExample.MainPage" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:local="using:UserControlExample" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    mc:Ignorable="d"> 

    <Grid x:Name="MainContent" Background="Azure" > 
     <Grid.RowDefinitions> 
      <RowDefinition Height="Auto"/> 
      <RowDefinition Height="*"/> 
     </Grid.RowDefinitions> 
     <ScrollViewer Grid.Row="1" HorizontalScrollBarVisibility="Hidden" 
       VerticalScrollBarVisibility="Hidden">       
      <local:UserControl1 x:Name="MyHelloWorldUserControl" Grid.Row="1" /> 
     </ScrollViewer> 
    </Grid>   
</Page> 

UserControl1.xaml

<UserControl 
    x:Class="UserControlExample.UserControl1" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:local="using:UserControlExample" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    mc:Ignorable="d" 
    d:DesignHeight="300" 
    d:DesignWidth="400"> 

    <Grid Background="Bisque"> 
     <StackPanel> 
      <StackPanel Orientation="Horizontal" Height="81"> 
       <TextBlock Text="Your Name is" Foreground="Blue" FontSize="30" Margin="0,0,0,10"/> 
       <TextBox x:Name="Input" Background="White" Width="225" /> 
      </StackPanel> 
      <Button Content="Click Me" Foreground="Brown" FontSize="30" Click="Button_Click"/> 
      <TextBlock x:Name="Output" FontSize="100"/> 
     </StackPanel> 
    </Grid> 
</UserControl> 

Answer 3

MainPage.xaml, estoy obligatorio un control de usuario de inicio de sesión mediante el uso de la nombres ritmo: xmlns: UC = "clr-namespace: Test.Views", ya que tengo mi usercontrol en la carpeta llamada "Views".

<ScrollViewer> 
<UC:Login BtnLoginClick="Login_BtnLoginClick"/> 
</ScrollViewer> 

Login.cs

public partial class Login : UserControl { 

    public event EventHandler BtnLoginClick; 

    public Login() 
    { 
     InitializeComponent(); 
    } 

    private void btnLogin_Click(object sender, RoutedEventArgs e) 
    { 
     string userName = txtUserName.Text; 
     string userPassword = txtUserPassword.Password.Trim(); 
     if (userName != null && userName != string.Empty && userPassword != null &&  userPassword != string.Empty) 
     { 
      if (this.BtnLoginClick != null) 
      { 
       this.BtnLoginClick(this, e); 
      } 
     } 
     else 
     { 
      MessageBox.Show("Invalid username or password"); 
     } 
    } 

}

Finalmente, No se olvidó de utilizar el controlador de eventos en MainPage.xaml para capturar el evento clic en el botón de Inicio de sesión Usercontrol para hacer otras acciones .

MainPage.xaml

<UC:Login BtnLoginClick="Login_BtnLoginClick"/> 

aquí "BtnLoginClick" su un controlador de eventos definido en el Login.xaml [Control de usuario].

Crear evento nuevo para este evento "BtnLoginClick" cuando creé "Login_BtnLoginClick".

MainPage.cs

private void Login_BtnLoginClick(object sender, EventArgs e) 
{ 
Messagebox.Show("Event captured successfully"); 
////Here you can add your stuffs...  
}