feat(ui): mobile polish — tab bar icons, server overlay, status text

Tab bar: replace plain Header strings with icon+label StackPanels
(≡ ↑ ↓ ⊙ ⊕); style TabStrip with UniformGrid so all five tabs share
the full width equally; center content and add touch padding. Icons
are visible only on mobile (IsMobile binding); desktop keeps text only.

Server settings overlay: dual layout for host/port/TLS input (vertical
on mobile: host full-width, port+TLS side by side) and for action
buttons (stacked full-width on mobile). Known-server list item shows
host on one line and tcp/ssl ports on the line below on mobile.

Connection status bar: simplify to "connesso" / "non connesso" —
remove the "a host:port" suffix from the connected state and
consolidate all disconnected/error/cert-changed states to conn.none.
This commit is contained in:
2026-06-14 21:40:15 +02:00
parent cfc48ff86f
commit 4c0edde4f7
3 changed files with 134 additions and 25 deletions
+2 -2
View File
@@ -52,7 +52,7 @@ public sealed class Loc
["menu.net.resetcerts"] = ["Reset certificati SSL", "Reset SSL certificates", "Restablecer certificados SSL", "Réinitialiser les certificats SSL", "Redefinir certificados SSL", "SSL-Zertifikate zurücksetzen"], ["menu.net.resetcerts"] = ["Reset certificati SSL", "Reset SSL certificates", "Restablecer certificados SSL", "Réinitialiser les certificats SSL", "Redefinir certificados SSL", "SSL-Zertifikate zurücksetzen"],
["menu.settings"] = ["_Impostazioni", "_Settings", "_Configuración", "_Paramètres", "_Configurações", "_Einstellungen"], ["menu.settings"] = ["_Impostazioni", "_Settings", "_Configuración", "_Paramètres", "_Configurações", "_Einstellungen"],
["menu.help"] = ["_Help", "_Help", "_Ayuda", "_Aide", "_Ajuda", "_Hilfe"], ["menu.help"] = ["_Help", "_Help", "_Ayuda", "_Aide", "_Ajuda", "_Hilfe"],
["help.title"] = ["Informazioni sul software", "About this software", "Información del software", "À propos du logiciel", "Sobre o software", "Über die Software"], ["help.title"] = ["Informazioni", "About", "Información", "À propos", "Sobre", "Über"],
["help.info"] = [ ["help.info"] = [
"Wallet SPV per la criptovaluta Palladium (PLM).", "Wallet SPV per la criptovaluta Palladium (PLM).",
"SPV wallet for the Palladium (PLM) cryptocurrency.", "SPV wallet for the Palladium (PLM) cryptocurrency.",
@@ -191,7 +191,7 @@ public sealed class Loc
["conn.reconnecting"] = ["riconnessione…", "reconnecting…", "reconectando…", "reconnexion…", "reconectando…", "Verbindung wird wiederhergestellt…"], ["conn.reconnecting"] = ["riconnessione…", "reconnecting…", "reconectando…", "reconnexion…", "reconectando…", "Verbindung wird wiederhergestellt…"],
["conn.error"] = ["errore di connessione", "connection error", "error de conexión", "erreur de connexion", "erro de conexão", "Verbindungsfehler"], ["conn.error"] = ["errore di connessione", "connection error", "error de conexión", "erreur de connexion", "erro de conexão", "Verbindungsfehler"],
["conn.certchanged"] = ["certificato cambiato", "certificate changed", "certificado cambiado", "certificat modifié", "certificado alterado", "Zertifikat geändert"], ["conn.certchanged"] = ["certificato cambiato", "certificate changed", "certificado cambiado", "certificat modifié", "certificado alterado", "Zertifikat geändert"],
["conn.connectedto"] = ["connesso a", "connected to", "conectado a", "connecté à", "conectado a", "verbunden mit"], ["conn.connectedto"] = ["connesso", "connected", "conectado", "connecté", "conectado", "verbunden"],
["conn.connectingto"] = ["connessione a", "connecting to", "conectando a", "connexion à", "conectando a", "Verbindung zu"], ["conn.connectingto"] = ["connessione a", "connecting to", "conectando a", "connexion à", "conectando a", "Verbindung zu"],
// Messaggi di stato principali // Messaggi di stato principali
@@ -144,11 +144,11 @@ public partial class MainWindowViewModel
_client.Disconnected += _ => Dispatcher.UIThread.Post(() => _client.Disconnected += _ => Dispatcher.UIThread.Post(() =>
{ {
IsConnected = false; IsConnected = false;
ConnectionStatus = Loc.Tr("conn.disconnected"); ConnectionStatus = Loc.Tr("conn.none");
}); });
IsConnected = true; IsConnected = true;
_autoReconnect = true; _autoReconnect = true;
ConnectionStatus = $"{Loc.Tr("conn.connectedto")} {host}:{port}{(UseSsl ? " (TLS)" : "")}"; ConnectionStatus = Loc.Tr("conn.connectedto");
} }
if (_account is null || _doc is null) if (_account is null || _doc is null)
@@ -186,13 +186,13 @@ public partial class MainWindowViewModel
catch (CertificatePinMismatchException ex) catch (CertificatePinMismatchException ex)
{ {
IsConnected = false; IsConnected = false;
ConnectionStatus = Loc.Tr("conn.certchanged"); ConnectionStatus = Loc.Tr("conn.none");
StatusMessage = ex.Message; StatusMessage = ex.Message;
} }
catch (Exception ex) catch (Exception ex)
{ {
IsConnected = _client?.IsConnected == true; IsConnected = _client?.IsConnected == true;
ConnectionStatus = IsConnected ? ConnectionStatus : Loc.Tr("conn.error"); ConnectionStatus = IsConnected ? ConnectionStatus : Loc.Tr("conn.none");
StatusMessage = $"Errore: {ex.Message}"; StatusMessage = $"Errore: {ex.Message}";
} }
finally finally
+120 -11
View File
@@ -199,8 +199,33 @@
<TabControl Grid.Row="1" <TabControl Grid.Row="1"
TabStripPlacement="{Binding IsMobile, Converter={x:Static vm:BoolToTabPlacementConverter.Instance}}"> TabStripPlacement="{Binding IsMobile, Converter={x:Static vm:BoolToTabPlacementConverter.Instance}}">
<TabControl.Styles>
<!-- Tab equamente distribuiti su tutta la larghezza -->
<Style Selector="TabStrip">
<Setter Property="ItemsPanel">
<ItemsPanelTemplate>
<UniformGrid Rows="1"/>
</ItemsPanelTemplate>
</Setter>
</Style>
<Style Selector="TabItem">
<Setter Property="HorizontalAlignment" Value="Stretch"/>
<Setter Property="HorizontalContentAlignment" Value="Center"/>
<Setter Property="VerticalContentAlignment" Value="Center"/>
<Setter Property="Padding" Value="6,8"/>
</Style>
</TabControl.Styles>
<!-- 1. Storico --> <!-- 1. Storico -->
<TabItem Header="{Binding Loc[tab.history]}"> <TabItem>
<TabItem.Header>
<StackPanel Spacing="2" HorizontalAlignment="Center">
<TextBlock Text="≡" FontSize="19" HorizontalAlignment="Center"
IsVisible="{Binding IsMobile}"/>
<TextBlock Text="{Binding Loc[tab.history]}" FontSize="12"
HorizontalAlignment="Center"/>
</StackPanel>
</TabItem.Header>
<Grid RowDefinitions="Auto,*" Margin="4"> <Grid RowDefinitions="Auto,*" Margin="4">
<TextBlock Grid.Row="0" Text="{Binding Loc[history.hint]}" <TextBlock Grid.Row="0" Text="{Binding Loc[history.hint]}"
IsVisible="{Binding IsDesktop}" IsVisible="{Binding IsDesktop}"
@@ -241,7 +266,15 @@
</TabItem> </TabItem>
<!-- 2. Invia --> <!-- 2. Invia -->
<TabItem Header="{Binding Loc[tab.send]}"> <TabItem>
<TabItem.Header>
<StackPanel Spacing="2" HorizontalAlignment="Center">
<TextBlock Text="↑" FontSize="19" HorizontalAlignment="Center"
IsVisible="{Binding IsMobile}"/>
<TextBlock Text="{Binding Loc[tab.send]}" FontSize="12"
HorizontalAlignment="Center"/>
</StackPanel>
</TabItem.Header>
<StackPanel Spacing="10" Margin="8" MaxWidth="640" HorizontalAlignment="Left"> <StackPanel Spacing="10" Margin="8" MaxWidth="640" HorizontalAlignment="Left">
<!-- Contatto rapido --> <!-- Contatto rapido -->
<StackPanel Orientation="Horizontal" Spacing="8"> <StackPanel Orientation="Horizontal" Spacing="8">
@@ -298,7 +331,15 @@
</TabItem> </TabItem>
<!-- 3. Ricevi --> <!-- 3. Ricevi -->
<TabItem Header="{Binding Loc[tab.receive]}"> <TabItem>
<TabItem.Header>
<StackPanel Spacing="2" HorizontalAlignment="Center">
<TextBlock Text="↓" FontSize="19" HorizontalAlignment="Center"
IsVisible="{Binding IsMobile}"/>
<TextBlock Text="{Binding Loc[tab.receive]}" FontSize="12"
HorizontalAlignment="Center"/>
</StackPanel>
</TabItem.Header>
<StackPanel Spacing="10" Margin="8"> <StackPanel Spacing="10" Margin="8">
<TextBlock Text="{Binding Loc[receive.next]}"/> <TextBlock Text="{Binding Loc[receive.next]}"/>
<!-- Desktop: indirizzo + copia su una riga --> <!-- Desktop: indirizzo + copia su una riga -->
@@ -332,7 +373,15 @@
</TabItem> </TabItem>
<!-- 4. Indirizzi --> <!-- 4. Indirizzi -->
<TabItem Header="{Binding Loc[tab.addresses]}"> <TabItem>
<TabItem.Header>
<StackPanel Spacing="2" HorizontalAlignment="Center">
<TextBlock Text="⊙" FontSize="19" HorizontalAlignment="Center"
IsVisible="{Binding IsMobile}"/>
<TextBlock Text="{Binding Loc[tab.addresses]}" FontSize="12"
HorizontalAlignment="Center"/>
</StackPanel>
</TabItem.Header>
<Grid RowDefinitions="Auto,*" Margin="4"> <Grid RowDefinitions="Auto,*" Margin="4">
<!-- Intestazione colonne — solo desktop --> <!-- Intestazione colonne — solo desktop -->
<Grid Grid.Row="0" ColumnDefinitions="90,60,*,140,60" Margin="12,4" <Grid Grid.Row="0" ColumnDefinitions="90,60,*,140,60" Margin="12,4"
@@ -382,7 +431,15 @@
</TabItem> </TabItem>
<!-- 5. Contatti --> <!-- 5. Contatti -->
<TabItem Header="{Binding Loc[tab.contacts]}"> <TabItem>
<TabItem.Header>
<StackPanel Spacing="2" HorizontalAlignment="Center">
<TextBlock Text="⊕" FontSize="19" HorizontalAlignment="Center"
IsVisible="{Binding IsMobile}"/>
<TextBlock Text="{Binding Loc[tab.contacts]}" FontSize="12"
HorizontalAlignment="Center"/>
</StackPanel>
</TabItem.Header>
<Grid RowDefinitions="Auto,*,Auto,Auto" Margin="4"> <Grid RowDefinitions="Auto,*,Auto,Auto" Margin="4">
<!-- Intestazioni colonne — solo desktop --> <!-- Intestazioni colonne — solo desktop -->
<Grid Grid.Row="0" ColumnDefinitions="180,*" Margin="12,4" <Grid Grid.Row="0" ColumnDefinitions="180,*" Margin="12,4"
@@ -671,8 +728,9 @@
<TextBlock Text="{Binding Loc[server.title]}" <TextBlock Text="{Binding Loc[server.title]}"
FontSize="18" FontWeight="Bold"/> FontSize="18" FontWeight="Bold"/>
<!-- Host + porta separati --> <!-- Host + porta — Desktop: 3 colonne -->
<Grid ColumnDefinitions="*,Auto,Auto" RowDefinitions="Auto,Auto"> <Grid ColumnDefinitions="*,Auto,Auto" RowDefinitions="Auto,Auto"
IsVisible="{Binding IsDesktop}">
<TextBlock Grid.Row="0" Grid.Column="0" Text="{Binding Loc[server.host]}" <TextBlock Grid.Row="0" Grid.Column="0" Text="{Binding Loc[server.host]}"
FontSize="11" Foreground="Gray"/> FontSize="11" Foreground="Gray"/>
<TextBlock Grid.Row="0" Grid.Column="1" Text="{Binding Loc[server.port]}" <TextBlock Grid.Row="0" Grid.Column="1" Text="{Binding Loc[server.port]}"
@@ -686,9 +744,29 @@
<CheckBox Grid.Row="1" Grid.Column="2" IsChecked="{Binding UseSsl}" <CheckBox Grid.Row="1" Grid.Column="2" IsChecked="{Binding UseSsl}"
Margin="10,2,0,0" VerticalAlignment="Center"/> Margin="10,2,0,0" VerticalAlignment="Center"/>
</Grid> </Grid>
<!-- Host + porta — Mobile: verticale -->
<StackPanel Spacing="8" IsVisible="{Binding IsMobile}">
<StackPanel Spacing="3">
<TextBlock Text="{Binding Loc[server.host]}" FontSize="11" Foreground="Gray"/>
<TextBox Text="{Binding ServerHost}" FontFamily="monospace"/>
</StackPanel>
<Grid ColumnDefinitions="*,Auto">
<StackPanel Grid.Column="0" Spacing="3">
<TextBlock Text="{Binding Loc[server.port]}" FontSize="11" Foreground="Gray"/>
<TextBox Text="{Binding ServerPort}" FontFamily="monospace"/>
</StackPanel>
<StackPanel Grid.Column="1" Spacing="3" Margin="16,0,0,0"
VerticalAlignment="Center">
<TextBlock Text="TLS" FontSize="11" Foreground="Gray"
HorizontalAlignment="Center"/>
<CheckBox IsChecked="{Binding UseSsl}"
HorizontalAlignment="Center"/>
</StackPanel>
</Grid>
</StackPanel>
<!-- Azioni --> <!-- Azioni — Desktop: in riga -->
<StackPanel Orientation="Horizontal" Spacing="8"> <StackPanel Orientation="Horizontal" Spacing="8" IsVisible="{Binding IsDesktop}">
<Button Content="{Binding Loc[wallet.connect]}" Classes="accent" <Button Content="{Binding Loc[wallet.connect]}" Classes="accent"
Command="{Binding ConnectAndSyncCommand}" IsEnabled="{Binding !IsSyncing}"/> Command="{Binding ConnectAndSyncCommand}" IsEnabled="{Binding !IsSyncing}"/>
<Button Content="{Binding Loc[wallet.discover]}" <Button Content="{Binding Loc[wallet.discover]}"
@@ -696,6 +774,18 @@
<Button Content="{Binding Loc[wallet.resetcert]}" <Button Content="{Binding Loc[wallet.resetcert]}"
Command="{Binding ResetCertificatesCommand}"/> Command="{Binding ResetCertificatesCommand}"/>
</StackPanel> </StackPanel>
<!-- Azioni — Mobile: in colonna -->
<StackPanel Spacing="6" IsVisible="{Binding IsMobile}">
<Button Content="{Binding Loc[wallet.connect]}" Classes="accent"
Command="{Binding ConnectAndSyncCommand}" IsEnabled="{Binding !IsSyncing}"
HorizontalAlignment="Stretch" HorizontalContentAlignment="Center"/>
<Button Content="{Binding Loc[wallet.discover]}"
Command="{Binding DiscoverServersCommand}"
HorizontalAlignment="Stretch" HorizontalContentAlignment="Center"/>
<Button Content="{Binding Loc[wallet.resetcert]}"
Command="{Binding ResetCertificatesCommand}"
HorizontalAlignment="Stretch" HorizontalContentAlignment="Center"/>
</StackPanel>
<!-- Stato connessione --> <!-- Stato connessione -->
<StackPanel Orientation="Horizontal" Spacing="6"> <StackPanel Orientation="Horizontal" Spacing="6">
@@ -725,16 +815,35 @@
</ListBox.Styles> </ListBox.Styles>
<ListBox.ItemTemplate> <ListBox.ItemTemplate>
<DataTemplate x:DataType="net:KnownServer"> <DataTemplate x:DataType="net:KnownServer">
<Grid ColumnDefinitions="*,Auto"> <Panel>
<!-- Desktop: host + porte in 2 colonne -->
<Grid ColumnDefinitions="*,Auto"
IsVisible="{Binding $parent[UserControl].((vm:MainWindowViewModel)DataContext).IsDesktop}">
<TextBlock Grid.Column="0" Text="{Binding Host}" <TextBlock Grid.Column="0" Text="{Binding Host}"
FontFamily="monospace" FontSize="13" FontFamily="monospace" FontSize="13"
VerticalAlignment="Center"/> VerticalAlignment="Center"/>
<TextBlock Grid.Column="1" FontSize="11" Foreground="Gray" <TextBlock Grid.Column="1" FontSize="11" Foreground="Gray"
VerticalAlignment="Center"> VerticalAlignment="Center">
<Run Text="tcp "/><Run Text="{Binding TcpPort}"/> <Run Text="tcp "/><Run Text="{Binding TcpPort}"/>
<Run Text=" / ssl"/><Run Text="{Binding SslPort}"/> <Run Text=" ssl "/><Run Text="{Binding SslPort}"/>
</TextBlock> </TextBlock>
</Grid> </Grid>
<!-- Mobile: host sopra, porte sotto -->
<StackPanel Spacing="1" Margin="0,3"
IsVisible="{Binding $parent[UserControl].((vm:MainWindowViewModel)DataContext).IsMobile}">
<TextBlock Text="{Binding Host}"
FontFamily="monospace" FontSize="13"
TextTrimming="CharacterEllipsis"/>
<StackPanel Orientation="Horizontal" Spacing="12">
<TextBlock FontSize="11" Foreground="Gray">
<Run Text="tcp "/><Run Text="{Binding TcpPort}"/>
</TextBlock>
<TextBlock FontSize="11" Foreground="Gray">
<Run Text="ssl "/><Run Text="{Binding SslPort}"/>
</TextBlock>
</StackPanel>
</StackPanel>
</Panel>
</DataTemplate> </DataTemplate>
</ListBox.ItemTemplate> </ListBox.ItemTemplate>
</ListBox> </ListBox>