Define foundational UI layout

MirisWisdom · Dec 4, 2021 · c5e2d8a · c5e2d8a
1 parent 2d448ac
commit c5e2d8a
Showing 1 changed file with 112 additions and 4 deletions.
diff --git a/gui/MainWindow.xaml b/gui/MainWindow.xaml
@@ -3,10 +3,118 @@
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
-        xmlns:local="clr-namespace:Gunloader.GUI"
         mc:Ignorable="d"
-        Title="MainWindow" Height="450" Width="800">
-    <Grid>
+        Title="Gunloader"
+        Width="640"
+        Height="480">
+
+    <!-- Universal styles -->
+    <Window.Resources>
+        <Style TargetType="Button">
+            <Setter Property="Width"
+                    Value="75" />
+            <Setter Property="Padding"
+                    Value="5" />
+        </Style>
+        <Style TargetType="TextBox">
+            <Setter Property="Padding"
+                    Value="5" />
+            <Setter Property="VerticalContentAlignment"
+                    Value="Center" />
+        </Style>
+    </Window.Resources>
 
+    <!-- Main Grid -->
+    <Grid Margin="10">
+        <Grid.RowDefinitions>
+            <RowDefinition Height="Auto" />
+            <RowDefinition />
+            <RowDefinition Height="Auto" />
+        </Grid.RowDefinitions>
+
+        <!-- Source -->
+        <GroupBox Grid.Row="0"
+                  Header="Video">
+            <Grid>
+                <Grid.ColumnDefinitions>
+                    <ColumnDefinition />
+                    <ColumnDefinition />
+                </Grid.ColumnDefinitions>
+
+                <!-- Title -->
+                <DockPanel Grid.Column="0"
+                           Margin="0,0,5,0">
+                    <Label Content="Album Title:"
+                           DockPanel.Dock="Top" />
+                    <TextBox Margin="0,0,1,0" />
+                </DockPanel>
+
+                <!-- Video -->
+                <DockPanel Grid.Column="1"
+                           Margin="5,0,0,0">
+                    <Label Content="YouTube URL or Local Video:"
+                           DockPanel.Dock="Top" />
+                    <Button Content="Browse"
+                            DockPanel.Dock="Right" />
+                    <TextBox Margin="0,0,10,0"
+                             VerticalContentAlignment="Center" />
+                </DockPanel>
+            </Grid>
+        </GroupBox>
+
+        <!-- Songs -->
+        <GroupBox Grid.Row="1" 
+                  Header="Songs">
+            <Grid>
+                <Grid.RowDefinitions>
+                    <RowDefinition Height="Auto" />
+                    <RowDefinition />
+                </Grid.RowDefinitions>
+
+                <!-- New Track -->
+                <Grid Grid.Row="0" Margin="0,0,0,5">
+                    <Grid.ColumnDefinitions>
+                        <ColumnDefinition />
+                        <ColumnDefinition />
+                        <ColumnDefinition />
+                        <ColumnDefinition Width="Auto" />
+                    </Grid.ColumnDefinitions>
+
+                    <StackPanel Grid.Column="0"
+                                Margin="0,0,5,0">
+                        <Label Content="Title:" />
+                        <TextBox />
+                    </StackPanel>
+
+                    <StackPanel Grid.Column="1"
+                                Margin="5,0,5,0">
+                        <Label Content="Start Time:" />
+                        <TextBox />
+                    </StackPanel>
+
+                    <StackPanel Grid.Column="2"
+                                Margin="5,0,5,0">
+                        <Label Content="End Time:" />
+                        <TextBox />
+                    </StackPanel>
+
+                    <StackPanel Grid.Column="3"
+                                Margin="5,0,0,0">
+                        <Label Content="" />
+                        <Button Content="Add" />
+                    </StackPanel>
+                </Grid>
+
+                <!-- Current Tracks -->
+                <DataGrid Grid.Row="1"
+                          Margin="0,5,0,0" />
+            </Grid>
+        </GroupBox>
+
+        <!-- Process -->
+        <Button Grid.Row="2"
+                Width="Auto"
+                Content="Process"
+                Margin="0,5,0,0" />
     </Grid>
-</Window>
+</Window>