LaunchyBarControl.xaml

<UserControl x:Class="CodingWithCalvin.LaunchyBar.UI.LaunchyBarControl"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:vs="clr-namespace:Microsoft.VisualStudio.Shell;assembly=Microsoft.VisualStudio.Shell.15.0"
             xmlns:imaging="clr-namespace:Microsoft.VisualStudio.Imaging;assembly=Microsoft.VisualStudio.Imaging"
              mc:Ignorable="d"
             d:DesignHeight="600" d:DesignWidth="48"
             Background="{DynamicResource {x:Static vs:VsBrushes.ToolWindowBackgroundKey}}">

  <UserControl.Resources>
    <BooleanToVisibilityConverter x:Key="BoolToVisibility"/>

    <Style x:Key="LaunchyBarButtonStyle" TargetType="Button">
      <Setter Property="Width" Value="44"/>
      <Setter Property="Height" Value="40"/>
      <Setter Property="Margin" Value="0,4"/>
      <Setter Property="Padding" Value="0"/>
      <Setter Property="BorderThickness" Value="0"/>
      <Setter Property="Background" Value="Transparent"/>
      <Setter Property="Foreground" Value="{DynamicResource {x:Static vs:VsBrushes.CommandBarTextActiveKey}}"/>
      <Setter Property="Cursor" Value="Hand"/>
      <Setter Property="Template">
        <Setter.Value>
          <ControlTemplate TargetType="Button">
            <Grid>
              <Grid.ColumnDefinitions>
                <ColumnDefinition Width="3"/>
                <ColumnDefinition Width="*"/>
              </Grid.ColumnDefinitions>

              <!-- Active indicator bar on the left edge -->
              <Rectangle x:Name="ActiveIndicator"
                         Grid.Column="0"
                         Fill="{DynamicResource {x:Static vs:VsBrushes.AccentMediumKey}}"
                         RadiusX="1" RadiusY="1"
                         Margin="0,6"
                         Visibility="Collapsed"/>

              <Border x:Name="Border"
                      Grid.Column="1"
                      Background="{TemplateBinding Background}"
                      BorderBrush="{TemplateBinding BorderBrush}"
                      BorderThickness="{TemplateBinding BorderThickness}"
                      CornerRadius="4"
                      Padding="8">
                <ContentPresenter HorizontalAlignment="Center"
                                  VerticalAlignment="Center"/>
              </Border>
            </Grid>
            <ControlTemplate.Triggers>
              <Trigger Property="IsMouseOver" Value="True">
                <Setter TargetName="Border" Property="Background"
                        Value="{DynamicResource {x:Static vs:VsBrushes.CommandBarHoverKey}}"/>
              </Trigger>
              <Trigger Property="IsPressed" Value="True">
                <Setter TargetName="Border" Property="Background"
                        Value="{DynamicResource {x:Static vs:VsBrushes.CommandBarSelectedKey}}"/>
              </Trigger>
              <Trigger Property="IsEnabled" Value="False">
                <Setter Property="Opacity" Value="0.5"/>
              </Trigger>
              <DataTrigger Binding="{Binding IsActive}" Value="True">
                <Setter TargetName="ActiveIndicator" Property="Visibility" Value="Visible"/>
              </DataTrigger>
            </ControlTemplate.Triggers>
          </ControlTemplate>
        </Setter.Value>
      </Setter>
    </Style>
  </UserControl.Resources>

  <Grid>
    <Grid.RowDefinitions>
      <RowDefinition Height="Auto"/>
      <RowDefinition Height="Auto"/>
      <RowDefinition Height="*"/>
      <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>

    <!-- LaunchyBar Logo -->
    <Image Grid.Row="0"
           Source="pack://application:,,,/CodingWithCalvin.LaunchyBar;component/Resources/logo-32.png"
           Width="32" Height="32"
           HorizontalAlignment="Center"
           Margin="0,8,0,12"
           ToolTip="LaunchyBar"/>

    <!-- Separator -->
    <Rectangle Grid.Row="1"
               Height="1"
               Margin="8,0,8,8"
               Fill="{DynamicResource {x:Static vs:VsBrushes.CommandBarMenuSeparatorKey}}"/>

    <!-- Top Items (flow down) -->
    <ItemsControl Grid.Row="2"
                  ItemsSource="{Binding TopItems}"
                  VerticalAlignment="Top">
      <ItemsControl.ItemTemplate>
        <DataTemplate>
          <Button Style="{StaticResource LaunchyBarButtonStyle}"
                  Command="{Binding DataContext.LaunchCommand, RelativeSource={RelativeSource AncestorType=UserControl}}"
                  CommandParameter="{Binding}"
                  ToolTip="{Binding Name}">
            <imaging:CrispImage Width="24" Height="24"
                                Moniker="{Binding IconMoniker}" />
          </Button>
        </DataTemplate>
      </ItemsControl.ItemTemplate>
    </ItemsControl>

    <!-- Bottom Items (flow up) -->
    <ItemsControl Grid.Row="3"
                  ItemsSource="{Binding BottomItems}"
                  VerticalAlignment="Bottom">
      <ItemsControl.ItemTemplate>
        <DataTemplate>
          <Button Style="{StaticResource LaunchyBarButtonStyle}"
                  Command="{Binding DataContext.LaunchCommand, RelativeSource={RelativeSource AncestorType=UserControl}}"
                  CommandParameter="{Binding}"
                  ToolTip="{Binding Name}">
            <imaging:CrispImage Width="24" Height="24"
                                Moniker="{Binding IconMoniker}" />
          </Button>
        </DataTemplate>
      </ItemsControl.ItemTemplate>
    </ItemsControl>
  </Grid>
</UserControl>