design: CCTV 플레이어 디자인 적용

SmartAquaViewer/Controls/FFPlayerControl.xaml

@@ -6,42 +6,41 @@
              xmlns:local="clr-namespace:SmartAquaViewer.Controls"
              mc:Ignorable="d" 
              d:DesignHeight="450" d:DesignWidth="800">
-    <Border BorderThickness="1" BorderBrush="#243851">
+    <Border >
         <Grid Background="Transparent">
             <Grid.RowDefinitions>
-                <RowDefinition Height="24"></RowDefinition>
+                <RowDefinition Height="32"/>
-                <RowDefinition Height="*"></RowDefinition>
+                <RowDefinition Height="*"/>
+                <RowDefinition Height="32"/>
             </Grid.RowDefinitions>
-            <Border Grid.RowSpan="2" x:Name="bdrNoSignalContainer" Visibility="{Binding IsPlayingVIsibility}">
+            <Border BorderThickness="0 0 0 1" BorderBrush="#325C80" Background="#264A60">
-                <Border.BorderBrush>
+                <TextBlock x:Name="lblCCTVID" Margin="12 0"
-                    <SolidColorBrush Color="#394861" Opacity="0.4"></SolidColorBrush>
+                           HorizontalAlignment="Left" VerticalAlignment="Center"
-                </Border.BorderBrush>
+                           Style="{StaticResource CCTVTextBlockStyle}"
-                <Border.Background>
+                           Text="{Binding CCTVInfo.DeviceId}"/>
-                    <SolidColorBrush Color="#22262D" Opacity="0.4"></SolidColorBrush>
-                </Border.Background>
-                <Grid VerticalAlignment="Center" HorizontalAlignment="Center" Background="Transparent">
-                    <Grid.RowDefinitions>
-                        <RowDefinition></RowDefinition>
-                        <RowDefinition></RowDefinition>
-                    </Grid.RowDefinitions>
-                    <TextBlock Name="lblVideoStatus" Text="연결 없음"
-                               FontSize="17" Foreground="#414961"></TextBlock>
-                </Grid>
             </Border>
+
+            <Border Grid.Row="1" x:Name="bdrNoSignalContainer" 
+                    Visibility="{Binding IsPlayingVIsibility}"
+                    Background="#1D3649">
+                <TextBlock Name="lblVideoStatus" Text="연결 없음"
+                           VerticalAlignment="Center" HorizontalAlignment="Center"
+                           FontSize="16" Foreground="#999999" FontFamily="{StaticResource SCDream5}"/>
+            </Border>
+            
             <Image x:Name="imgPlayer" Grid.RowSpan="2" Stretch="Fill" Source="{Binding CurrentFrame}"
                    HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>
-            <TextBlock HorizontalAlignment="Left" Grid.RowSpan="2" Margin="20, 5, 5, 0"  x:Name="lblCCTVID" 
-                   FontFamily="Verna" FontSize="15" FontWeight='Bold' Foreground="White"
-                   Text="{Binding CCTVInfo.DeviceId}"/>
             <!--<StackPanel Name="spTopMenuBar"  Visibility="Hidden" Grid.Row="0" Orientation="Horizontal" HorizontalAlignment="Right">
             <Image Name="imgMaximize" Source="../Images/maximize.png" Width="24" Margin="1, 5, 0, 5" MouseLeftButtonUp="imgMaximize_MouseUp" Opacity="0.7" MouseEnter="imgTopmenu_MouseEnter" MouseLeave="imgTopmenu_MouseLeave"/>
         </StackPanel>-->
-            <Grid Grid.Row="1">
+
-                <StackPanel VerticalAlignment="Bottom" Orientation="Vertical">
+            <Border Grid.Row="2" Background="#1D3649"
-                    <TextBlock Text="{Binding CCTVInfo.DeviceName}" HorizontalAlignment="Right" Margin="20, 5, 5, 0"  x:Name="lblCCTVName"
+                    BorderThickness="0 1 0 0" BorderBrush="#325C80">
-                               FontFamily="{StaticResource SCDream6}" FontSize="15" Foreground="White"/>
+                <TextBlock x:Name="lblCCTVName" Text="{Binding CCTVInfo.DeviceName}" 
-                </StackPanel>
+                           HorizontalAlignment="Right" VerticalAlignment="Center"
-            </Grid>
+                           Margin="12 0"
+                           Style="{StaticResource CCTVTextBlockStyle}"/>
+            </Border>
         </Grid>
     </Border>
 </UserControl>

SmartAquaViewer/Resources/Generic.xaml

@@ -783,4 +783,10 @@
         <Setter Property="Width" Value="120" />
         <Setter Property="Height" Value="38" />
     </Style>
+
+    <Style x:Key="CCTVTextBlockStyle" TargetType="TextBlock">
+        <Setter Property="FontFamily" Value="{StaticResource SCDream4}" />
+        <Setter Property="Foreground" Value="White" />
+        <Setter Property="FontSize" Value="16" />
+    </Style>
 </ResourceDictionary>