Public Access
Android: a customisable key bar, a quick-access keyboard, a long-press cursor gesture, and a side panel on tablets
The key bar above the software keyboard is now the user's own: which keys, in what order, up to sixteen in two rows that never scroll. Ctrl and Alt latch across the bar and the phone's keyboard, and Ctrl or Alt with a cursor key sends the modified CSI form. Seven predefined groups (essentials, cursor, control, symbols, tmux, vim, function) and keys of one's own, written in \e / ^C notation, are arranged on a customise sheet that saves as it goes. A grid button swaps the software keyboard for a quick-access keyboard of the same height, with KEYS, SNIPPETS, HISTORY and APPEARANCE tabs; it reopens to the tab last used. Snippets go through the shell's existing InsertSnippet. History keeps a typed command only once the remote has echoed it, so nothing typed at a password prompt is ever recorded; it is memory-only and LOCK clears it. Each session pump now keeps its last kilobyte of output and the alternate-screen state for that test (OutputTail). Long-press and drag on the terminal sends arrow keys, as a joystick with three speeds by distance; scrolling is unchanged and there is no mode switch. It takes the touch before Chromium's own long press, so a held finger no longer pastes; paste is on the bar by default instead. A switch in APPEARANCE turns the gesture off. The text-size buttons moved from the bar to APPEARANCE. On wide screens the same tabs open as a side panel beside the terminal, toggled from the top bar, with the bar's own keys repeated at the top of KEYS while the bar stands down. The model, gesture arithmetic, echo reading and history are in DodoSSH.Client.Shell and covered by TerminalKeyboardTests and OutputTailTests. Builds clean; not yet exercised on a device, because the emulator's install is locked behind a passphrase that was not recorded.
This commit is contained in:
1 parent
c21de4ade4
commit
367cebae9b
22 files changed
+3949
-344
No files matched your search
@@ -167,7 +167,7 @@
|
||||
job — see the remark on the header in PhoneShell.axaml. -->
|
||||
<Border Grid.Row="0" Height="35" Background="{StaticResource DeepChrome}"
|
||||
BorderBrush="{StaticResource Border}" BorderThickness="0,0,0,1">
|
||||
<Grid ColumnDefinitions="Auto,*,Auto,Auto">
|
||||
<Grid ColumnDefinitions="Auto,*,Auto,Auto,Auto">
|
||||
|
||||
<!--
|
||||
Back, and it goes to the page this terminal was opened over rather than to Hosts by name. The
|
||||
@@ -304,11 +304,34 @@
|
||||
<Button Grid.Column="3" Classes="icon" Content="+" Height="34" Margin="0,0,4,0"
|
||||
Click="OnSheetRequested"
|
||||
Command="{Binding OpenConnectSheetCommand}" />
|
||||
|
||||
<!--
|
||||
The wide screen's side panel, shown and hidden — the quick-access keyboard beside the terminal
|
||||
rather than under it. Here rather than at the start of the key bar, which is where a phone keeps
|
||||
its toggle: on a tablet the bar is not drawn while the panel is open, and the control that brings
|
||||
the panel back cannot live inside the thing the panel replaced. Lit while open, like a latched key.
|
||||
-->
|
||||
<Button Grid.Column="4" Classes="icon" Height="34" Margin="0,0,4,0"
|
||||
Classes.accent="{Binding Keyboard.IsSidePanelOpen}"
|
||||
AutomationProperties.Name="Keys, snippets and history"
|
||||
IsVisible="{Binding $parent[views:TerminalScreen].IsWide}"
|
||||
Command="{Binding Keyboard.ToggleSidePanelCommand}">
|
||||
<TextBlock FontFamily="{StaticResource IconFont}" FontSize="18" Text=""
|
||||
HorizontalAlignment="Center" VerticalAlignment="Center" />
|
||||
</Button>
|
||||
</Grid>
|
||||
</Border>
|
||||
|
||||
<!-- ============ the renderer ============ -->
|
||||
<Panel Grid.Row="1">
|
||||
<!-- ============ the renderer, and the wide screen's side panel ============ -->
|
||||
<!--
|
||||
Two columns, and the second is collapsed except on a wide screen with the panel open. Beside the
|
||||
renderer rather than over it, for the reason nothing on this head is drawn over it: the WebView is a
|
||||
native child composited above everything Avalonia paints, so a panel laid on top would be invisible.
|
||||
Taking its width off the terminal refits the grid and tells the remote, exactly as the software
|
||||
keyboard taking its height does.
|
||||
-->
|
||||
<Grid Grid.Row="1" ColumnDefinitions="*,Auto">
|
||||
<Panel Grid.Column="0">
|
||||
|
||||
<!--
|
||||
============ nothing open ============
|
||||
@@ -551,60 +574,21 @@
|
||||
IsVisible="{Binding IsTerminalShowing, FallbackValue=False}" />
|
||||
</Panel>
|
||||
|
||||
<!-- ============ accessory keys ============ -->
|
||||
<!--
|
||||
The row every Android SSH client ships, and the reason is not preference: a software keyboard has no
|
||||
Ctrl, no Esc, no Tab and no arrows, and without them a phone cannot interrupt a process, complete a
|
||||
path, or reach the previous command. Ctrl and Alt latch — pressed once they apply to the next key and
|
||||
then release, because holding a modifier while typing is not possible one-thumbed.
|
||||
The quick-access keyboard as a side panel: additional keys, snippets, history and appearance in view
|
||||
while the terminal is worked in, which is what a tablet's width is for. 320 wide, which at the 600dp
|
||||
where this head turns wide leaves the terminal 280 — a narrow terminal, and a panel somebody can close
|
||||
from the bar above; at a tablet's 900 it is a third.
|
||||
|
||||
ShowsBarGroup, because the bar under the terminal stands down while this is open and the keys someone
|
||||
put on it have to go somewhere they can still be reached.
|
||||
-->
|
||||
<!-- Only with a pane to type into: the keys send bytes at a session, and a connecting tab has none. -->
|
||||
<!--
|
||||
◆ TWO FIXED ROWS THAT FILL THE WIDTH, AND NOTHING HERE SCROLLS. THAT IS THE WHOLE CHANGE.
|
||||
<Border Grid.Column="1" Width="320" BorderBrush="{StaticResource Border}" BorderThickness="1,0,0,0"
|
||||
IsVisible="{Binding $parent[views:TerminalScreen].ShowsSidePanel}">
|
||||
<views:QuickAccessKeyboard x:Name="SidePanel" ShowsBarGroup="True" />
|
||||
</Border>
|
||||
</Grid>
|
||||
|
||||
What this replaced was one 33-pixel row holding eleven 30-by-44 keys inside a horizontal ScrollViewer,
|
||||
and it was wrong in two ways that compounded each other.
|
||||
|
||||
── the scroller was eating the presses ──────────────────────────────────────────────────────────────
|
||||
A horizontally scrollable strip and a row of buttons want opposite things from the same gesture. Every
|
||||
tap starts as a press and a few pixels of travel, and a ScrollViewer that can pan claims exactly that:
|
||||
a thumb coming down at an angle — which is how a thumb comes down — is read as the start of a pan, the
|
||||
button never sees a click, and the row slides slightly instead. Pressing a key and having the keys
|
||||
move is the single most confidence-destroying thing a keyboard can do, and it happened often enough
|
||||
to be the first thing anybody noticed about this row.
|
||||
|
||||
── and the keys were too small to hit anyway ─────────────────────────────────────────────────────────
|
||||
30 tall. Android's own minimum touch target is 48 and every accessory row in every terminal on the
|
||||
platform is somewhere near it. The height had been taken down from 38 to save a strip of terminal,
|
||||
which is a trade worth making right up until the control stops working, and 30 is past that.
|
||||
|
||||
── what the other clients do, because all of them agree ─────────────────────────────────────────────
|
||||
Termux, Termius, JuiceSSH, ConnectBot and Blink all ship this row and not one of them scrolls it.
|
||||
They divide the width evenly between a fixed set of keys and, where the set does not fit, they use a
|
||||
second row — Termux ships two by default. That is not convention for its own sake: a key whose
|
||||
position is fixed can be hit without looking, which is the entire point of a modifier row you use
|
||||
while reading the output above it. A key that might have scrolled has to be found first.
|
||||
|
||||
So: two rows, every key stretched to an equal share of the width, none of it scrollable, and 40 tall
|
||||
instead of 30. Nothing was dropped — all eleven keys are here, and the four that mattered most are the
|
||||
ones that benefit, because the arrows were the keys living past the right edge.
|
||||
|
||||
── what it costs, stated rather than buried ─────────────────────────────────────────────────────────
|
||||
About 51 pixels of terminal, which is four or five lines of output. That is a real price and it is the
|
||||
right one: the row that was cheaper did not work, and a terminal with five more lines and no reachable
|
||||
Ctrl is not the better surface.
|
||||
|
||||
── the split ────────────────────────────────────────────────────────────────────────────────────────
|
||||
Modifiers and punctuation on top, cursor keys underneath. The arrows go on the lower row because they
|
||||
are the keys pressed repeatedly and in sequence — history, then along the line — so they want the row
|
||||
the thumb rests nearest, and there are only four of them, which leaves them the widest targets on the
|
||||
whole keypad. The text-size buttons ride at that row's right-hand end, outside the flex.
|
||||
|
||||
The five pixels above the whole thing are a gap and not a border. The renderer is a native child view,
|
||||
so nothing Avalonia draws can sit on top of it — a hairline between the two would have to be a row of
|
||||
its own — and a terminal whose last line of output is flush against a row of grey keys reads as one
|
||||
surface that has gone wrong rather than as two that are different things.
|
||||
-->
|
||||
<!-- ============ what a terminal says once its shell has stopped ============ -->
|
||||
<!--
|
||||
The phone's half of SessionEndedBar, and it needs it more than the desk does: a mobile link drops on
|
||||
@@ -654,71 +638,90 @@
|
||||
</StackPanel>
|
||||
</Border>
|
||||
|
||||
<Border Grid.Row="3" IsVisible="{Binding IsTerminalShowing}" Margin="0,5,0,0">
|
||||
<StackPanel Spacing="4">
|
||||
<!-- ============ the keys ============ -->
|
||||
<!--
|
||||
The keys a software keyboard does not have, and the way to all the others.
|
||||
|
||||
── the bar ──────────────────────────────────────────────────────────────────────────────────────────
|
||||
The row every Android SSH client ships, and the reason is not preference: a software keyboard has no
|
||||
Ctrl, no Esc, no Tab and no arrows, and without them a phone cannot interrupt a process, complete a
|
||||
path, or reach the previous command. Ctrl and Alt latch — pressed once they apply to the next key, from
|
||||
the bar or from the phone's own keyboard, and then release — because holding a modifier while typing is
|
||||
not possible one-thumbed.
|
||||
|
||||
It is somebody's own now: which keys, in what order, set on the customise screen and kept on this
|
||||
device. What did not change is the shape the old fixed keypad argued its way to, and the argument still
|
||||
holds. Nothing here scrolls — a horizontally scrollable strip reads a thumb coming down at an angle as
|
||||
the start of a pan, and the key never sees the press. Every key gets an equal share of its row's width,
|
||||
so "ctrl" and "|" are the same target. At most eight to a row and two rows, which keeps a key at about
|
||||
41dp on a 360dp phone; anything past sixteen belongs on the quick-access keyboard. The first eight are
|
||||
the top row, so a person arranging their bar decides the rows by the order alone.
|
||||
|
||||
As shipped: modifiers and punctuation on top, cursor keys underneath, nearest the thumb, because they
|
||||
are the keys pressed repeatedly and in sequence — history, then along the line.
|
||||
|
||||
── the grid button ──────────────────────────────────────────────────────────────────────────────────
|
||||
At the bar's left-hand end, outside the rows, and the one key nobody can remove: it is the way to the
|
||||
quick-access keyboard and from there to the customise screen, so a bar arranged to nothing is still a
|
||||
bar with a way back. Lit while the panel is up, as a latched modifier is, because it is a state.
|
||||
|
||||
── the panel ────────────────────────────────────────────────────────────────────────────────────────
|
||||
The quick-access keyboard, in the software keyboard's place: the code-behind puts the phone's keyboard
|
||||
away as this opens and gives this the height that keyboard last had, so the bar does not move between
|
||||
the two. Tapping the terminal brings the phone's keyboard back and puts this away again.
|
||||
|
||||
The five pixels above the whole thing are a gap and not a border. The renderer is a native child view,
|
||||
so nothing Avalonia draws can sit on top of it — a hairline between the two would have to be a row of its
|
||||
own — and a terminal whose last line is flush against a row of grey keys reads as one surface gone wrong.
|
||||
-->
|
||||
<StackPanel Grid.Row="3" IsVisible="{Binding $parent[views:TerminalScreen].ShowsKeys}">
|
||||
|
||||
<Grid ColumnDefinitions="Auto,*" Margin="8,5,8,4">
|
||||
|
||||
<!--
|
||||
Modifiers and punctuation. Populated from the table in the code-behind, which is also where the
|
||||
bytes each one sends live; a UniformGrid rather than a StackPanel so the seven divide the width
|
||||
between them instead of taking what their labels happen to need — "ctrl" is four characters and
|
||||
"|" is one, and on a row of keys those two want the same target, not proportional ones.
|
||||
Focusable="False", for the reason every key carries it — see the remark on Button.hotkey's use in
|
||||
QuickAccessKeyboard. A button here that took focus would take it off the terminal's input surface,
|
||||
and the keyboard would go with it.
|
||||
-->
|
||||
<UniformGrid x:Name="AccessoryKeys" Columns="7" Margin="8,0" />
|
||||
<Button Grid.Column="0" Classes="hotkey" Width="44" Focusable="False" VerticalAlignment="Bottom"
|
||||
Margin="0,0,4,0"
|
||||
Classes.latched="{Binding Keyboard.IsQuickAccessOpen}"
|
||||
AutomationProperties.Name="Keys, snippets and history"
|
||||
IsVisible="{Binding !$parent[views:TerminalScreen].IsWide}"
|
||||
Click="OnQuickAccessToggled">
|
||||
<TextBlock FontFamily="{StaticResource IconFont}" FontSize="18" Text=""
|
||||
HorizontalAlignment="Center" VerticalAlignment="Center" />
|
||||
</Button>
|
||||
|
||||
<!--
|
||||
The cursor keys, and the two text-size buttons riding at the end.
|
||||
<ItemsControl Grid.Column="1" ItemsSource="{Binding Keyboard.BarRows}">
|
||||
<ItemsControl.ItemsPanel>
|
||||
<ItemsPanelTemplate><StackPanel Spacing="4" /></ItemsPanelTemplate>
|
||||
</ItemsControl.ItemsPanel>
|
||||
<ItemsControl.ItemTemplate>
|
||||
<DataTemplate x:DataType="vm:KeyRowViewModel">
|
||||
<ItemsControl ItemsSource="{Binding Keys}">
|
||||
<ItemsControl.ItemsPanel>
|
||||
<ItemsPanelTemplate><UniformGrid Rows="1" /></ItemsPanelTemplate>
|
||||
</ItemsControl.ItemsPanel>
|
||||
<ItemsControl.ItemTemplate>
|
||||
<DataTemplate x:DataType="vm:KeyButtonViewModel">
|
||||
<Button Classes="hotkey" Focusable="False" Classes.latched="{Binding IsLatched}"
|
||||
Content="{Binding Label}" AutomationProperties.Name="{Binding Hint}"
|
||||
Command="{Binding PressCommand}" />
|
||||
</DataTemplate>
|
||||
</ItemsControl.ItemTemplate>
|
||||
</ItemsControl>
|
||||
</DataTemplate>
|
||||
</ItemsControl.ItemTemplate>
|
||||
</ItemsControl>
|
||||
</Grid>
|
||||
|
||||
Grid rather than a second UniformGrid across the whole width: the arrows share what is left after
|
||||
A− and A+ have taken their fixed 44 each, so the four of them flex and the two of them do not.
|
||||
Putting all six in one uniform row would make the font buttons as wide as an arrow key and move
|
||||
them every time the row's contents changed.
|
||||
-->
|
||||
<Grid ColumnDefinitions="*,Auto" Margin="8,0">
|
||||
|
||||
<UniformGrid x:Name="ArrowKeys" Grid.Column="0" Columns="4" />
|
||||
|
||||
<!--
|
||||
The text-size buttons.
|
||||
|
||||
They used to have a row of their own above the terminal, on the argument that the accessory row
|
||||
scrolls and these two must never be off-screen — a terminal too small to read is exactly the
|
||||
state in which hunting for the control that fixes it is worst. Nothing on this keypad scrolls
|
||||
any more, so that argument is now satisfied by construction rather than by placement.
|
||||
|
||||
A phone cannot press Ctrl+plus. The desktop head has that chord and needs no buttons; this head
|
||||
has no keyboard to press it with, which is why the two heads differ here and nowhere else in
|
||||
this screen.
|
||||
|
||||
Disabled at the ends rather than clamping silently. A button that keeps accepting taps and does
|
||||
nothing reads as the terminal having stopped responding, which is the one thing this screen must
|
||||
never look like.
|
||||
|
||||
◆ Focusable="False", for the reason the accessory keys carry in code — see
|
||||
TerminalScreen.axaml.cs. Every button on this keypad sits over a terminal somebody is typing
|
||||
into, and an ordinary one takes Avalonia's focus off the input surface on tap. Making the text
|
||||
smaller must not cost the keyboard.
|
||||
-->
|
||||
<!-- No Spacing: Button.hotkey carries a 2-pixel side margin, so the gaps here match the
|
||||
UniformGrid cells' without being counted twice. -->
|
||||
<StackPanel Grid.Column="1" Orientation="Horizontal" Margin="8,0,0,0">
|
||||
<Border Width="1" Height="20" Background="{StaticResource Border}" Margin="0,0,4,0"
|
||||
VerticalAlignment="Center" />
|
||||
|
||||
<Button Classes="hotkey" Width="44" Focusable="False"
|
||||
Command="{Binding ShrinkTerminalFontCommand}"
|
||||
IsEnabled="{Binding CanShrinkTerminalFont}">
|
||||
<TextBlock Classes="mono" FontSize="13" Text="A−" />
|
||||
</Button>
|
||||
|
||||
<Button Classes="hotkey" Width="44" Focusable="False"
|
||||
Command="{Binding EnlargeTerminalFontCommand}"
|
||||
IsEnabled="{Binding CanEnlargeTerminalFont}">
|
||||
<TextBlock Classes="mono" FontSize="15" Text="A+" />
|
||||
</Button>
|
||||
</StackPanel>
|
||||
</Grid>
|
||||
</StackPanel>
|
||||
</Border>
|
||||
<Border BorderBrush="{StaticResource Border}" BorderThickness="0,1,0,0"
|
||||
Height="{Binding $parent[views:TerminalScreen].QuickAccessHeight}"
|
||||
IsVisible="{Binding $parent[views:TerminalScreen].ShowsQuickAccessPanel}">
|
||||
<views:QuickAccessKeyboard x:Name="BottomPanel" />
|
||||
</Border>
|
||||
</StackPanel>
|
||||
|
||||
</Grid>
|
||||
|
||||
@@ -866,6 +869,185 @@
|
||||
</Border>
|
||||
</Panel>
|
||||
|
||||
<!-- ============ the customise sheet ============ -->
|
||||
<!--
|
||||
Reached from CUSTOMIZE at the top of the quick-access keyboard's KEYS tab: which keys are on the bar
|
||||
and in what order, which groups the KEYS tab shows and in what order, and keys of one's own.
|
||||
|
||||
Taller than the other two sheets, nearly the whole display, because it is a page of settings rather
|
||||
than a menu — and it scrolls for the same reason. It takes the screen the way they do too: opening it
|
||||
collapses the renderer (see MainWindowViewModel.IsTerminalShowing), so nothing is drawn over the
|
||||
WebView and the boxes on it can have the keyboard.
|
||||
|
||||
Every change applies the moment it is made, to the bar and to the settings file, which is why there is
|
||||
DONE and no SAVE. See TerminalKeyboardViewModel.
|
||||
|
||||
↑ and ↓ rather than drag handles. A drag inside a scrolling sheet is the same gesture as a scroll and
|
||||
has to be told apart by a long press nobody can see; two buttons are slower and never wrong.
|
||||
-->
|
||||
<Panel IsVisible="{Binding Keyboard.IsCustomizing}">
|
||||
|
||||
<Button Classes="scrim" Command="{Binding Keyboard.CloseCustomizeCommand}" />
|
||||
|
||||
<Border Margin="0,40,0,0" Background="{StaticResource Panel}"
|
||||
BorderBrush="{StaticResource BorderMid}" BorderThickness="0,1,0,0"
|
||||
CornerRadius="22,22,0,0" Padding="20,18,20,0">
|
||||
<Grid RowDefinitions="Auto,Auto,*">
|
||||
|
||||
<Border Grid.Row="0" Width="38" Height="4" CornerRadius="2" Background="{StaticResource BorderMid}"
|
||||
HorizontalAlignment="Center" Margin="0,0,0,12" />
|
||||
|
||||
<Grid Grid.Row="1" ColumnDefinitions="*,Auto" Margin="0,0,0,8">
|
||||
<TextBlock Grid.Column="0" Classes="title" Text="CUSTOMIZE KEYS" FontSize="13"
|
||||
VerticalAlignment="Center" />
|
||||
<Button Grid.Column="1" Classes="row" MinHeight="40" Padding="14,0"
|
||||
Command="{Binding Keyboard.CloseCustomizeCommand}">
|
||||
<TextBlock Classes="label" FontSize="9" Text="DONE" />
|
||||
</Button>
|
||||
</Grid>
|
||||
|
||||
<ScrollViewer Grid.Row="2" HorizontalScrollBarVisibility="Disabled">
|
||||
<StackPanel Spacing="6" Margin="0,0,0,24">
|
||||
|
||||
<!-- ── the bar ── -->
|
||||
<Grid ColumnDefinitions="*,Auto" Margin="0,4,0,0">
|
||||
<TextBlock Grid.Column="0" Classes="label" Text="THE BAR" />
|
||||
<TextBlock Grid.Column="1" Classes="detail" FontSize="10" Text="{Binding Keyboard.BarCountText}" />
|
||||
</Grid>
|
||||
<TextBlock Classes="body" TextWrapping="Wrap"
|
||||
Text="The first eight keys are the top row and the rest the second. Tap a key in a group below to put it on the bar or take it off." />
|
||||
|
||||
<ItemsControl ItemsSource="{Binding Keyboard.BarEditor}">
|
||||
<ItemsControl.ItemTemplate>
|
||||
<DataTemplate x:DataType="vm:BarEditorRowViewModel">
|
||||
<Border BorderBrush="{StaticResource Border}" BorderThickness="0,0,0,1" Padding="0,4">
|
||||
<Grid ColumnDefinitions="64,*,Auto,Auto,Auto">
|
||||
<TextBlock Grid.Column="0" Classes="mono" FontSize="13" FontWeight="SemiBold"
|
||||
Text="{Binding Label}" VerticalAlignment="Center"
|
||||
TextTrimming="CharacterEllipsis" />
|
||||
<StackPanel Grid.Column="1" Spacing="1" VerticalAlignment="Center">
|
||||
<TextBlock Classes="detail" FontSize="10.5" Text="{Binding Hint}"
|
||||
TextTrimming="CharacterEllipsis" />
|
||||
<TextBlock Classes="detail" FontSize="9" Foreground="{StaticResource TextFaint}"
|
||||
Text="{Binding Row}" />
|
||||
</StackPanel>
|
||||
<Button Grid.Column="2" Classes="icon" Height="40" Width="40"
|
||||
AutomationProperties.Name="Move earlier" Command="{Binding MoveUpCommand}">
|
||||
<TextBlock FontFamily="{StaticResource IconFont}" FontSize="18" Text="" />
|
||||
</Button>
|
||||
<Button Grid.Column="3" Classes="icon" Height="40" Width="40"
|
||||
AutomationProperties.Name="Move later" Command="{Binding MoveDownCommand}">
|
||||
<TextBlock FontFamily="{StaticResource IconFont}" FontSize="18" Text="" />
|
||||
</Button>
|
||||
<Button Grid.Column="4" Classes="icon" Height="40" Width="40"
|
||||
AutomationProperties.Name="Take off the bar" Command="{Binding RemoveCommand}">
|
||||
<TextBlock FontFamily="{StaticResource IconFont}" FontSize="18" Text=""
|
||||
Foreground="{StaticResource TextFaint}" />
|
||||
</Button>
|
||||
</Grid>
|
||||
</Border>
|
||||
</DataTemplate>
|
||||
</ItemsControl.ItemTemplate>
|
||||
</ItemsControl>
|
||||
|
||||
<TextBlock Classes="body" TextWrapping="Wrap" IsVisible="{Binding !Keyboard.HasBar}"
|
||||
Text="The bar is empty, so only the grid button is drawn above the keyboard." />
|
||||
|
||||
<!-- ── the groups ── -->
|
||||
<TextBlock Classes="label" Text="GROUPS" Margin="0,16,0,0" />
|
||||
<TextBlock Classes="body" TextWrapping="Wrap"
|
||||
Text="The quick-access keyboard shows the ticked groups, in this order. A lit key is on the bar." />
|
||||
|
||||
<ItemsControl ItemsSource="{Binding Keyboard.GroupEditor}">
|
||||
<ItemsControl.ItemTemplate>
|
||||
<DataTemplate x:DataType="vm:GroupEditorRowViewModel">
|
||||
<Border BorderBrush="{StaticResource Border}" BorderThickness="0,0,0,1" Padding="0,6,0,10">
|
||||
<StackPanel Spacing="6">
|
||||
<Grid ColumnDefinitions="*,Auto,Auto">
|
||||
<CheckBox Grid.Column="0" IsChecked="{Binding IsShown}" MinHeight="40">
|
||||
<TextBlock Classes="mono" FontSize="12.5" FontWeight="SemiBold" Text="{Binding Title}" />
|
||||
</CheckBox>
|
||||
<Button Grid.Column="1" Classes="icon" Height="40" Width="40"
|
||||
AutomationProperties.Name="Move up" Command="{Binding MoveUpCommand}">
|
||||
<TextBlock FontFamily="{StaticResource IconFont}" FontSize="18" Text="" />
|
||||
</Button>
|
||||
<Button Grid.Column="2" Classes="icon" Height="40" Width="40"
|
||||
AutomationProperties.Name="Move down" Command="{Binding MoveDownCommand}">
|
||||
<TextBlock FontFamily="{StaticResource IconFont}" FontSize="18" Text="" />
|
||||
</Button>
|
||||
</Grid>
|
||||
<ItemsControl ItemsSource="{Binding Keys}">
|
||||
<ItemsControl.ItemsPanel>
|
||||
<ItemsPanelTemplate><WrapPanel /></ItemsPanelTemplate>
|
||||
</ItemsControl.ItemsPanel>
|
||||
<ItemsControl.ItemTemplate>
|
||||
<DataTemplate x:DataType="vm:KeyChoiceViewModel">
|
||||
<Button Classes="chiptoggle" Classes.worn="{Binding IsOnBar}" Margin="0,0,6,6"
|
||||
Command="{Binding ToggleCommand}">
|
||||
<TextBlock Classes="mono" FontSize="12" Text="{Binding Label}" />
|
||||
</Button>
|
||||
</DataTemplate>
|
||||
</ItemsControl.ItemTemplate>
|
||||
</ItemsControl>
|
||||
</StackPanel>
|
||||
</Border>
|
||||
</DataTemplate>
|
||||
</ItemsControl.ItemTemplate>
|
||||
</ItemsControl>
|
||||
|
||||
<!-- ── keys of one's own ── -->
|
||||
<TextBlock Classes="label" Text="ADD A KEY" Margin="0,16,0,0" />
|
||||
|
||||
<ItemsControl ItemsSource="{Binding Keyboard.CustomKeyEditor}">
|
||||
<ItemsControl.ItemTemplate>
|
||||
<DataTemplate x:DataType="vm:CustomKeyRowViewModel">
|
||||
<Border BorderBrush="{StaticResource Border}" BorderThickness="0,0,0,1" Padding="0,4">
|
||||
<Grid ColumnDefinitions="64,*,Auto">
|
||||
<TextBlock Grid.Column="0" Classes="mono" FontSize="13" FontWeight="SemiBold"
|
||||
Text="{Binding Label}" VerticalAlignment="Center"
|
||||
TextTrimming="CharacterEllipsis" />
|
||||
<TextBlock Grid.Column="1" Classes="detail" FontSize="10.5" Text="{Binding Sequence}"
|
||||
VerticalAlignment="Center" TextTrimming="CharacterEllipsis" />
|
||||
<Button Grid.Column="2" Classes="icon" Height="40" Width="40"
|
||||
AutomationProperties.Name="Delete this key" Command="{Binding DeleteCommand}">
|
||||
<TextBlock FontFamily="{StaticResource IconFont}" FontSize="18" Text=""
|
||||
Foreground="{StaticResource DangerText}" />
|
||||
</Button>
|
||||
</Grid>
|
||||
</Border>
|
||||
</DataTemplate>
|
||||
</ItemsControl.ItemTemplate>
|
||||
</ItemsControl>
|
||||
|
||||
<!--
|
||||
ShowSuggestions off on both boxes, for the reason the terminal's own input surface turns it off:
|
||||
an autocorrecting keyboard capitalises the e in \e and puts a full stop after ^C, and the key
|
||||
then sends something nobody typed.
|
||||
-->
|
||||
<TextBox Classes="field" Text="{Binding Keyboard.NewKeyLabel}" MaxLength="10"
|
||||
TextInputOptions.ShowSuggestions="False"
|
||||
PlaceholderText="Label, as it appears on the key" />
|
||||
<TextBox Classes="field" Text="{Binding Keyboard.NewKeySequence}"
|
||||
TextInputOptions.ShowSuggestions="False"
|
||||
PlaceholderText="What it sends, e.g. \e:wq\r or ^C" />
|
||||
<TextBlock Classes="body" TextWrapping="Wrap"
|
||||
Text="\e is Escape, \r is Enter, \t is Tab, and ^ before a letter is Ctrl; \^ is a plain caret. Keys are kept on this phone in plain text, so this is no place for a password." />
|
||||
<Button Classes="primary" Content="ADD KEY" Command="{Binding Keyboard.AddCustomKeyCommand}" />
|
||||
<TextBlock Classes="detail" TextWrapping="Wrap" Foreground="{StaticResource WarnText}"
|
||||
Text="{Binding Keyboard.CustomizeStatus}"
|
||||
IsVisible="{Binding Keyboard.CustomizeStatus, Converter={x:Static StringConverters.IsNotNullOrEmpty}}" />
|
||||
|
||||
<Button Classes="secondary" Content="RESET TO DEFAULTS" Margin="0,16,0,0"
|
||||
Command="{Binding Keyboard.ResetLayoutCommand}" />
|
||||
<TextBlock Classes="detail" TextWrapping="Wrap"
|
||||
Text="Puts the bar and the groups back as they shipped. Keys you added are kept." />
|
||||
|
||||
</StackPanel>
|
||||
</ScrollViewer>
|
||||
</Grid>
|
||||
</Border>
|
||||
</Panel>
|
||||
|
||||
</Panel>
|
||||
|
||||
</UserControl>
|
||||
Reference in new issue
Block a user