fix(vnc): Tastatur-Button folgt echter Tastatur-Sichtbarkeit
Androids Zurueck-Taste versteckt die Tastatur ohne den TextInput zu blurren → ⌨-Button blieb an, erst der uebernaechste Tap oeffnete wieder. Jetzt setzt keyboardDidShow/Hide den Button-Zustand; Oeffnen erzwingt blur→focus, damit ein noch fokussiertes Feld die Tastatur neu aufklappt. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
@@ -11,7 +11,7 @@
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
import React, { useCallback, useEffect, useRef, useState } from 'react';
|
import React, { useCallback, useEffect, useRef, useState } from 'react';
|
||||||
import { NativeSyntheticEvent, ScrollView, StyleSheet, Text, TextInput, TextInputChangeEventData, TextInputKeyPressEventData, TouchableOpacity, View } from 'react-native';
|
import { Keyboard, NativeSyntheticEvent, ScrollView, StyleSheet, Text, TextInput, TextInputChangeEventData, TextInputKeyPressEventData, TouchableOpacity, View } from 'react-native';
|
||||||
import { WebView, WebViewMessageEvent } from 'react-native-webview';
|
import { WebView, WebViewMessageEvent } from 'react-native-webview';
|
||||||
import desktop from '../../services/desktop';
|
import desktop from '../../services/desktop';
|
||||||
import { NOVNC_HTML } from '../assets/novncHtml';
|
import { NOVNC_HTML } from '../assets/novncHtml';
|
||||||
@@ -58,6 +58,16 @@ const VncTile: React.FC<Props> = ({ projectId, focused, port = 5901 }) => {
|
|||||||
return () => teardown();
|
return () => teardown();
|
||||||
}, [focused, teardown]);
|
}, [focused, teardown]);
|
||||||
|
|
||||||
|
// Button-Zustand an die ECHTE Tastatur-Sichtbarkeit koppeln: Androids
|
||||||
|
// Zurueck-Taste blendet die Tastatur aus, ohne den TextInput zu blurren —
|
||||||
|
// ueber keyboardDidHide setzen wir das ⌨-Symbol trotzdem zurueck.
|
||||||
|
useEffect(() => {
|
||||||
|
if (!focused) return;
|
||||||
|
const show = Keyboard.addListener('keyboardDidShow', () => setKbdOn(true));
|
||||||
|
const hide = Keyboard.addListener('keyboardDidHide', () => setKbdOn(false));
|
||||||
|
return () => { show.remove(); hide.remove(); };
|
||||||
|
}, [focused]);
|
||||||
|
|
||||||
const ctl = useCallback((fn: string) => {
|
const ctl = useCallback((fn: string) => {
|
||||||
webRef.current?.injectJavaScript(`window.ariaVncCtl && window.ariaVncCtl.${fn}(); true;`);
|
webRef.current?.injectJavaScript(`window.ariaVncCtl && window.ariaVncCtl.${fn}(); true;`);
|
||||||
}, []);
|
}, []);
|
||||||
@@ -99,11 +109,13 @@ const VncTile: React.FC<Props> = ({ projectId, focused, port = 5901 }) => {
|
|||||||
else webRef.current?.injectJavaScript(`window.ariaVncKey && window.ariaVncKey.char(${cp}); true;`);
|
else webRef.current?.injectJavaScript(`window.ariaVncKey && window.ariaVncKey.char(${cp}); true;`);
|
||||||
}, [activeMods, sendCombo, clearMods]);
|
}, [activeMods, sendCombo, clearMods]);
|
||||||
|
|
||||||
// Tastatur ein-/ausblenden: echtes RN-<TextInput> fokussieren → Android oeffnet
|
// Tastatur ein-/ausblenden. Oeffnen: blur→focus erzwingt das Aufklappen auch
|
||||||
// die Software-Tastatur zuverlaessig (anders als ein verstecktes WebView-Feld).
|
// dann, wenn der TextInput noch fokussiert ist (Tastatur per Zurueck-Taste
|
||||||
|
// versteckt). Schliessen: Keyboard.dismiss(); den Button-Zustand setzt der
|
||||||
|
// keyboardDidShow/Hide-Listener — nicht hier —, damit er nie „haengen" bleibt.
|
||||||
const toggleKbd = useCallback(() => {
|
const toggleKbd = useCallback(() => {
|
||||||
if (kbdOn) { kbdRef.current?.blur(); setKbdOn(false); }
|
if (kbdOn) { Keyboard.dismiss(); }
|
||||||
else { setKbdOn(true); setTimeout(() => kbdRef.current?.focus(), 0); }
|
else { kbdRef.current?.blur(); setTimeout(() => kbdRef.current?.focus(), 30); }
|
||||||
}, [kbdOn]);
|
}, [kbdOn]);
|
||||||
|
|
||||||
// Druckbare Zeichen: Prefix-Diff des (wachsenden) Feldes → nur neu Getipptes an
|
// Druckbare Zeichen: Prefix-Diff des (wachsenden) Feldes → nur neu Getipptes an
|
||||||
@@ -182,7 +194,6 @@ const VncTile: React.FC<Props> = ({ projectId, focused, port = 5901 }) => {
|
|||||||
onChange={onKbdChange}
|
onChange={onKbdChange}
|
||||||
onKeyPress={onKbdKeyPress}
|
onKeyPress={onKbdKeyPress}
|
||||||
onSubmitEditing={() => pressKey(KEYSYM.Enter)}
|
onSubmitEditing={() => pressKey(KEYSYM.Enter)}
|
||||||
onBlur={() => setKbdOn(false)}
|
|
||||||
keyboardType="visible-password"
|
keyboardType="visible-password"
|
||||||
returnKeyType="send"
|
returnKeyType="send"
|
||||||
autoCapitalize="none"
|
autoCapitalize="none"
|
||||||
|
|||||||
Reference in New Issue
Block a user