drumkit-old/DrumKit/bin/Debug/UI/DrumsSettingsControl.xaml

<UserControl
    x:Class="DrumKit.DrumsSettingsControl"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:DrumKit"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    d:DesignHeight="661.955"
    d:DesignWidth="696.617">
    
    <UserControl.Resources>
        
        <Style x:Key="MyButtonStyle" TargetType="Button" BasedOn="{StaticResource TextButtonStyle}">
            <Setter Property="Margin" Value="0,0,14,0" />
            
        </Style>

        <Style x:Key="MyTitleTextStyle" TargetType="TextBlock" BasedOn="{StaticResource TitleTextStyle}">
            <Setter Property="Margin" Value="20,0,0,10" />
        </Style>

    </UserControl.Resources>
    
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>
        
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
        
        <!-- Drum list -->
        <ListView Name="listDrums" 
                  Grid.Row="0" Grid.Column="0" />
        
        <!-- Drumkit settings -->
        <ScrollViewer Grid.Row="0" Grid.Column="1">
        
            <Grid>

                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto"/>
                    <ColumnDefinition />
                    <ColumnDefinition Width="20" />
                </Grid.ColumnDefinitions>

                <Grid.RowDefinitions>
                    <RowDefinition Height="32" />
                    <RowDefinition Height="36" />
                    <RowDefinition Height="36" />
                    <RowDefinition Height="96" />
                    <RowDefinition Height="96" />
                    <RowDefinition Height="96" />
                    <RowDefinition Height="32" />
                    <RowDefinition Height="32" />
                    <RowDefinition Height="32" />
                    <RowDefinition Height="32" />
                    <RowDefinition Height="36" />
                    <RowDefinition />
                </Grid.RowDefinitions>

                <!-- Definition -->
                <TextBlock Style="{StaticResource MyTitleTextStyle}">Drum definition</TextBlock>
            
                <!-- ID -->
                <TextBlock Style="{StaticResource BodyTextStyle}" Grid.Row="1">ID</TextBlock>
            
                <TextBox Name="textID" Grid.Row="1" Grid.Column="1"
                         IsReadOnly="True" VerticalAlignment="Center" />

                <!-- Name -->
                <TextBlock Style="{StaticResource BodyTextStyle}" Grid.Row="2">Name</TextBlock>

                <TextBox Name="textName" Grid.Row="2" Grid.Column="1"
                         IsReadOnly="True" VerticalAlignment="Center" />

                <!-- Image -->
                <TextBlock Style="{StaticResource BodyTextStyle}" Grid.Row="3">Image</TextBlock>

                <Image Name="imageNormal" Grid.Row="3" Grid.Column="1" />

                <!-- Image pressed -->
                <TextBlock Style="{StaticResource BodyTextStyle}" Grid.Row="4">Pressed image</TextBlock>

                <Image Name="imagePressed" Grid.Row="4" Grid.Column="1" />

                <!-- Sounds -->
                <TextBlock Style="{StaticResource BodyTextStyle}" Grid.Row="5">Sounds</TextBlock>

                <TextBox Name="textSounds" Grid.Row="5" Grid.Column="1"
                         IsReadOnly="True" AcceptsReturn="True"/>

                <!-- Configuration -->
                <TextBlock Style="{StaticResource MyTitleTextStyle}" Grid.Row="6" VerticalAlignment="Bottom">Configuration</TextBlock>

                <!-- Enabled -->
                <TextBlock Style="{StaticResource BodyTextStyle}" Grid.Row="7">Enabled</TextBlock>

                <ToggleSwitch Name="toggleEnabled" Grid.Row="7" Grid.Column="1" Margin="0,-11,0,0"/>

                <!-- Volume left -->
                <TextBlock Style="{StaticResource BodyTextStyle}" Grid.Row="8">Volume left</TextBlock>

                <Slider Name="sliderVolL" Grid.Row="8" Grid.Column="1" />

                <!-- Volume right -->
                <TextBlock Style="{StaticResource BodyTextStyle}" Grid.Row="9">Volume right</TextBlock>

                <Slider Name="sliderVolR" Grid.Row="9" Grid.Column="1" />

                <!-- Key -->
                <TextBlock Style="{StaticResource BodyTextStyle}" Grid.Row="10">Key</TextBlock>

                <TextBox Name="textKey" Grid.Row="10" Grid.Column="1"
                         VerticalAlignment="Center" />

            </Grid>
        </ScrollViewer>
        
        <!-- Buttons -->
        <StackPanel Grid.Row="1" Grid.ColumnSpan="2" Orientation="Horizontal">
            <Button Style="{StaticResource MyButtonStyle}">Create</Button>
            <Button Style="{StaticResource MyButtonStyle}">Delete</Button>
            <Border Width="20" />
            <TextBlock Style="{StaticResource BodyTextStyle}" Margin="0,0,0,7">Note: You are now editing the current drumkit. To edit another, change the current drumkit.</TextBlock>
        </StackPanel>
        
    </Grid>
    
</UserControl>