From 380fb5ba50968511de9574d3eac525a0d17079e2 Mon Sep 17 00:00:00 2001
From: Miguel <miguel.vera.csa@gmail.com>
Date: Sat, 6 Sep 2025 22:33:08 +0200
Subject: [PATCH] refactor: Enhance ucHydTank layout and improve information
 panel with detailed flow metrics

---
 ObjetosSim/HydraulicComponents/ucHydTank.xaml | 137 +++++++++++++-----
 1 file changed, 100 insertions(+), 37 deletions(-)

diff --git a/ObjetosSim/HydraulicComponents/ucHydTank.xaml b/ObjetosSim/HydraulicComponents/ucHydTank.xaml
index cbb6eec..ba37973 100644
--- a/ObjetosSim/HydraulicComponents/ucHydTank.xaml
+++ b/ObjetosSim/HydraulicComponents/ucHydTank.xaml
@@ -43,12 +43,12 @@
                        RadiusY="3"
                        VerticalAlignment="Bottom"
                        Margin="4,4,4,4">
-                            <Rectangle.Height>
-                <MultiBinding Converter="{StaticResource LevelToHeightMultiConverter}">
-                    <Binding Path="FillPercentage"/>
-                    <Binding Path="Tamano" Converter="{StaticResource MeterToPixelConverter}"/>
-                </MultiBinding>
-            </Rectangle.Height>
+                <Rectangle.Height>
+                    <MultiBinding Converter="{StaticResource TankLevelToHeightConverter}">
+                        <Binding Path="FillPercentage"/>
+                        <Binding Path="Tamano"/>
+                    </MultiBinding>
+                </Rectangle.Height>
             </Rectangle>
 
             <!-- Líneas de nivel (marcas visuales) -->
@@ -72,43 +72,106 @@
                        VerticalAlignment="Center"
                        Foreground="White" 
                        FontWeight="Bold" 
-                       FontSize="10"
+                       FontSize="12"
                        Effect="{StaticResource DropShadowEffect}"/>
 
-            <!-- Indicador de tipo de tanque -->
-            <TextBlock Text="{Binding TankTypeIndicator}" 
-                       HorizontalAlignment="Left" 
-                       VerticalAlignment="Top"
-                       Foreground="Navy" 
-                       FontWeight="Bold" 
-                       FontSize="8"
-                       Margin="2,0,0,0"/>
+            <!-- Indicador de tipo de tanque y fluido -->
+            <Grid HorizontalAlignment="Left" VerticalAlignment="Top" Margin="2,2,0,0">
+                <Grid.RowDefinitions>
+                    <RowDefinition Height="Auto"/>
+                    <RowDefinition Height="Auto"/>
+                </Grid.RowDefinitions>
+                
+                <!-- Tipo de tanque -->
+                <Border Grid.Row="0" Background="Navy" CornerRadius="2" Padding="3,1">
+                    <TextBlock Text="{Binding TankTypeIndicator}" 
+                               Foreground="White" 
+                               FontWeight="Bold" 
+                               FontSize="8" />
+                </Border>
+                
+                <!-- Tipo de fluido -->
+                <Border Grid.Row="1" Background="DarkGreen" CornerRadius="2" Padding="2,1" Margin="0,1,0,0">
+                    <TextBlock Text="{Binding CurrentFluidDescription}" 
+                               Foreground="White" 
+                               FontSize="6" 
+                               FontWeight="SemiBold"
+                               TextTrimming="CharacterEllipsis"
+                               MaxWidth="40"/>
+                </Border>
+            </Grid>
         </Grid>
 
-        <!-- Panel de información -->
-        <Grid Canvas.Top="{Binding Tamano, Converter={StaticResource MeterToPixelConverter}, ConverterParameter=1.05}"
+        <!-- Panel de información mejorado -->
+        <Grid Canvas.Top="{Binding Tamano, Converter={StaticResource MeterToPixelConverter}, ConverterParameter=1.08}"
               Width="{Binding Tamano, Converter={StaticResource MeterToPixelConverter}}">
-            <StackPanel Orientation="Horizontal" 
-                        HorizontalAlignment="Center"
-                        Margin="0,2,0,0">
             
-            <!-- Presión actual -->
-            <TextBlock Text="{Binding CurrentPressureBar, StringFormat='{}{0:F1} bar'}" 
-                       Foreground="White" Background="Blue" 
-                       Padding="2" Margin="1" FontSize="8"/>
-            
-            <!-- Nivel actual -->
-            <TextBlock Text="{Binding CurrentLevel, StringFormat='{}{0:F2} m'}" 
-                       Foreground="White" Background="Green" 
-                       Padding="2" Margin="1" FontSize="8"/>
-            
-            <!-- Balance de flujo -->
-            <TextBlock Text="{Binding FlowBalanceLMin, StringFormat='{}{0:F1} L/min'}" 
-                       Foreground="White" 
-                       Background="{Binding FlowBalanceColor}"
-                       Padding="2" Margin="1" FontSize="8"/>
-            
-            </StackPanel>
+            <!-- Fondo semitransparente para el panel de información -->
+            <Border Background="#CC000000" CornerRadius="3" Margin="0,2,0,0" Padding="2">
+                <StackPanel Orientation="Vertical" HorizontalAlignment="Center">
+                    
+                    <!-- Fila superior: Presión y Nivel -->
+                    <StackPanel Orientation="Horizontal" HorizontalAlignment="Center" Margin="0,1">
+                        <!-- Presión actual -->
+                        <Border Background="#FF1E90FF" CornerRadius="2" Padding="3,2" Margin="1">
+                            <StackPanel Orientation="Horizontal">
+                                <TextBlock Text="P:" Foreground="White" FontSize="7" FontWeight="Bold"/>
+                                <TextBlock Text="{Binding CurrentPressure, StringFormat='{}{0:F1}'}" 
+                                           Foreground="White" FontSize="7" FontWeight="SemiBold" Margin="1,0,0,0"/>
+                                <TextBlock Text="bar" Foreground="White" FontSize="6" Opacity="0.9" Margin="1,0,0,0"/>
+                            </StackPanel>
+                        </Border>
+                        
+                        <!-- Nivel actual -->
+                        <Border Background="#FF32CD32" CornerRadius="2" Padding="3,2" Margin="1">
+                            <StackPanel Orientation="Horizontal">
+                                <TextBlock Text="N:" Foreground="White" FontSize="7" FontWeight="Bold"/>
+                                <TextBlock Text="{Binding CurrentLevelM, StringFormat='{}{0:F2}'}" 
+                                           Foreground="White" FontSize="7" FontWeight="SemiBold" Margin="1,0,0,0"/>
+                                <TextBlock Text="m" Foreground="White" FontSize="6" Opacity="0.9" Margin="1,0,0,0"/>
+                            </StackPanel>
+                        </Border>
+                    </StackPanel>
+                    
+                    <!-- Fila inferior: Flujos -->
+                    <StackPanel Orientation="Horizontal" HorizontalAlignment="Center" Margin="0,1">
+                        <!-- Flujo de entrada -->
+                        <Border Background="#FF228B22" CornerRadius="2" Padding="3,2" Margin="1">
+                            <StackPanel Orientation="Horizontal">
+                                <TextBlock Text="↓" Foreground="White" FontSize="8" FontWeight="Bold"/>
+                                <TextBlock Text="{Binding InletFlow, StringFormat='{}{0:F1}'}" 
+                                           Foreground="White" FontSize="7" FontWeight="SemiBold" Margin="1,0,0,0"/>
+                            </StackPanel>
+                        </Border>
+                        
+                        <!-- Flujo de salida -->
+                        <Border Background="#FFDC143C" CornerRadius="2" Padding="3,2" Margin="1">
+                            <StackPanel Orientation="Horizontal">
+                                <TextBlock Text="↑" Foreground="White" FontSize="8" FontWeight="Bold"/>
+                                <TextBlock Text="{Binding OutletFlow, StringFormat='{}{0:F1}'}" 
+                                           Foreground="White" FontSize="7" FontWeight="SemiBold" Margin="1,0,0,0"/>
+                            </StackPanel>
+                        </Border>
+                        
+                        <!-- Balance de flujo -->
+                        <Border Background="{Binding FlowBalanceColor}" CornerRadius="2" Padding="3,2" Margin="1">
+                            <StackPanel Orientation="Horizontal">
+                                <TextBlock Text="Δ:" Foreground="White" FontSize="7" FontWeight="Bold"/>
+                                <TextBlock Text="{Binding FlowBalance, StringFormat='{}{0:F1}'}" 
+                                           Foreground="White" FontSize="7" FontWeight="SemiBold" Margin="1,0,0,0"/>
+                            </StackPanel>
+                        </Border>
+                    </StackPanel>
+                    
+                    <!-- Unidades comunes -->
+                    <TextBlock Text="L/min" 
+                               Foreground="White" 
+                               FontSize="6" 
+                               HorizontalAlignment="Center" 
+                               Opacity="0.8" 
+                               Margin="0,1,0,0"/>
+                </StackPanel>
+            </Border>
         </Grid>
     </Canvas>