Как повторно использовать комбинацию элементов пользовательского интерфейса?

Question

В моем файле UWP xaml мне нужно повторно использовать StackPanel, как показано ниже в коде ScrollViewer ниже, как это сделать?

               <StackPanel Orientation="Vertical">
                    <Button Content="button1" Style="{StaticResource buttonStyle}">
                    </Button>
                    <Button Content="button1" Style="{StaticResource buttonStyle}">
                    </Button>
                    <Button Content="button1" Style="{StaticResource buttonStyle}">
                    </Button>
                </StackPanel>

...

       <ScrollViewer  
        Width="1920" 
        Height="1020" 
        HorizontalScrollMode="Enabled" 
        HorizontalScrollBarVisibility="Hidden" 
        VerticalScrollBarVisibility="Hidden">
            <StackPanel Orientation="Horizontal">
                <StackPanel Orientation="Vertical">
                    <Button Content="button1" Style="{StaticResource buttonStyle}">
                    </Button>
                    <Button Content="button1" Style="{StaticResource buttonStyle}">
                    </Button>
                    <Button Content="button1" Style="{StaticResource buttonStyle}">
                    </Button>
                </StackPanel>

                <StackPanel Orientation="Vertical">
                    <Button Content="button1" Style="{StaticResource buttonStyle}">
                    </Button>
                    <Button Content="button1" Style="{StaticResource buttonStyle}">
                    </Button>
                    <Button Content="button1" Style="{StaticResource buttonStyle}">
                    </Button>
                </StackPanel>

                ...

            </StackPanel>
        </ScrollViewer>

Answer 1

Создайте UserControl и определите там StackPanel:

<UserControl
    x:Class="App1.MyUserControl1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App1"
    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">
    <StackPanel Orientation="Vertical">
        <Button Content="button1" Style="{StaticResource buttonStyle}">
        </Button>
        <Button Content="button1" Style="{StaticResource buttonStyle}">
        </Button>
        <Button Content="button1" Style="{StaticResource buttonStyle}">
        </Button>
    </StackPanel>
</UserControl> 

Затем вы можете создать несколько экземпляров вашего UserControl в вашем ScrollViewer:

<ScrollViewer  
        Width="1920" 
        Height="1020" 
        HorizontalScrollMode="Enabled" 
        HorizontalScrollBarVisibility="Hidden" 
        VerticalScrollBarVisibility="Hidden">
    <StackPanel Orientation="Horizontal">
        <local:MyUserControl1 />
        <local:MyUserControl1 />
        <local:MyUserControl1 />
    </StackPanel>
</ScrollViewer>