Initial channel box UI refactor, up to dean now

WhackerLinkConsoleV2/ChannelBox.xaml

@@ -1,29 +1,45 @@
 <UserControl x:Class="WhackerLinkConsoleV2.Controls.ChannelBox"
              xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-             Width="200" Height="150" Background="{Binding Background, RelativeSource={RelativeSource AncestorType=UserControl}}"
+             Width="220" Height="96" Background="Blue">
-             BorderBrush="Gray" BorderThickness="2">
+    <Grid Margin="5">
-    <Border CornerRadius="5" Background="{Binding Background, RelativeSource={RelativeSource AncestorType=UserControl}}">
+        <Grid.ColumnDefinitions>
-        <Grid Margin="5">
+            <ColumnDefinition Width="41"/>
-            <Grid.RowDefinitions>
+            <ColumnDefinition/>
-                <RowDefinition Height="Auto"/>
+            <ColumnDefinition Width="30"/>
-                <RowDefinition Height="Auto"/>
+        </Grid.ColumnDefinitions>
-                <RowDefinition Height="Auto"/>
-                <RowDefinition Height="*"/>
-                <RowDefinition Height="Auto"/>
-            </Grid.RowDefinitions>
 
-            <TextBlock Text="{Binding ChannelName}" FontWeight="Bold" Foreground="White" FontSize="14" Grid.Row="0"/>
+        <Grid.RowDefinitions>
-            <TextBlock Text="{Binding SystemName}" Foreground="LightGray" FontSize="12" Grid.Row="1"/>
+            <RowDefinition Height="2*"/>
-            <TextBlock Text="{Binding LastSrcId}" Foreground="LightGray" FontSize="12" Grid.Row="2"/>
+            <RowDefinition Height="51*"/>
+            <RowDefinition Height="Auto"/>
+        </Grid.RowDefinitions>
 
-            <Button Content="PTT" Width="80" Margin="0,5,0,0" Background="Green" Foreground="White" Name="PttButton"
+        <!-- Left Side PTT Button -->
-                    HorizontalAlignment="Left" Grid.Row="3" Click="PTTButton_Click"/>
+        <Button Background="Green" Name="PttButton" Click="PTTButton_Click" Grid.RowSpan="3" HorizontalAlignment="Left" Width="52" Margin="-7,-5,0,-5" Grid.ColumnSpan="2">
-            <Button Content="Page Select" Width="80" Margin="80,5,0,0" Background="Green" Foreground="White" Name="PageSelectButton"
+            <Image Source="pack://application:,,,/WhackerLinkConsoleV2;component/Assets/instantptt.png" Width="24" Height="45"/>
-                    HorizontalAlignment="Left" Grid.Row="3" Click="PageSelectButton_Click"/>
+        </Button>
 
-            <Slider Grid.Row="4" Minimum="0" Maximum="4" Value="{Binding Volume, Mode=TwoWay}"
+        <!-- Main Info Section -->
-                Width="180" Margin="5" Name="VolumeSlider" ValueChanged="VolumeSlider_ValueChanged"/>
+        <StackPanel Grid.Column="1" HorizontalAlignment="Left" Width="129" Margin="8,-4,0,5" Grid.RowSpan="2">
-        </Grid>
+            <TextBlock Text="{Binding ChannelName}" FontWeight="Bold" Foreground="White" FontSize="15"/>
-    </Border>
+            <TextBlock Text="{Binding LastSrcId}" Foreground="LightGray" FontSize="12"/>
+            <TextBlock Text="{Binding SystemName}" Foreground="LightGray" FontSize="12"/>
+        </StackPanel>
+
+        <!-- Volume Slider -->
+        <Slider Grid.Column="2" Grid.RowSpan="2" Minimum="0" Maximum="4" Value="{Binding Volume, Mode=TwoWay}" 
+                Orientation="Vertical" Height="80" VerticalAlignment="Top" Name="VolumeSlider" 
+                ValueChanged="VolumeSlider_ValueChanged" Margin="5,3,5,0" Grid.Row="1"/>
+
+        <!-- Bottom Buttons -->
+        <StackPanel Grid.Column="1" Grid.Row="2" Orientation="Horizontal" Margin="8,0,71,0">
+            <Button Width="31" Height="33" Background="SteelBlue" x:Name="PageSelectButton" Click="PageSelectButton_Click">
+                <Image Source="pack://application:,,,/WhackerLinkConsoleV2;component/Assets/pageselect.png" Width="24" Height="24"/>
+            </Button>
+            <Button Width="28" Height="33" Background="SteelBlue">
+                <Image Source="pack://application:,,,/WhackerLinkConsoleV2;component/Assets/channelmarker.png" Width="24" Height="24"/>
+            </Button>
+        </StackPanel>
+    </Grid>
 </UserControl>

WhackerLinkConsoleV2/MainWindow.xaml.cs

@@ -268,12 +268,12 @@ namespace WhackerLinkConsoleV2
                         channelBox.MouseRightButtonDown += ChannelBox_MouseRightButtonDown;
                         ChannelsCanvas.Children.Add(channelBox);
 
-                        offsetX += 220;
+                        offsetX += 225;
 
-                        if (offsetX + 200 > ChannelsCanvas.ActualWidth)
+                        if (offsetX + 220 > ChannelsCanvas.ActualWidth)
                         {
                             offsetX = 20;
-                            offsetY += 170;
+                            offsetY += 106;
                         }
                     }
                 }

WhackerLinkConsoleV2/WhackerLinkConsoleV2.csproj

@@ -9,6 +9,13 @@
     <Platforms>AnyCPU;x64</Platforms>
   </PropertyGroup>
 
+  <ItemGroup>
+    <None Remove="Assets\channelmarker.png" />
+    <None Remove="Assets\instantptt.png" />
+    <None Remove="Assets\pageselect.png" />
+    <None Remove="Assets\pttselect.png" />
+  </ItemGroup>
+
  
 
   <ItemGroup>
@@ -20,6 +27,21 @@
     <ProjectReference Include="..\WhackerLinkLib\WhackerLinkLib.csproj" />
   </ItemGroup>
 
+  <ItemGroup>
+    <Resource Include="Assets\channelmarker.png">
+      <CopyToOutputDirectory>Always</CopyToOutputDirectory>
+    </Resource>
+    <Resource Include="Assets\instantptt.png" />
+    <Resource Include="Assets\pageselect.png" />
+    <Resource Include="Assets\pttselect.png" />
+  </ItemGroup>
+
+  <ItemGroup>
+    <Page Update="ChannelBox.xaml">
+      <CopyToOutputDirectory></CopyToOutputDirectory>
+    </Page>
+  </ItemGroup>
+
 
 
 </Project>