fix(android): room under the form while typing, measured by nobody
adjustResize changed nothing either: FMX's window is fullscreen, and Android ignores the mode there. So three sources were asked what the keyboard covers - visualViewport, innerHeight, the window itself - and all three answer as if it were not there. Stop asking. While a field has focus the panel reserves 60% of the height below its content; that is overflow, so it scrolls, and the focused field is lifted to the top of the panel where no keyboard can reach it whatever its size. The reserve goes at the first field left, so nothing floats when one is not typing. Crude on purpose. Every attempt at measuring this correctly has been wrong, and the honest version of "we cannot know" is to make the answer not matter.
This commit is contained in:
@@ -76,6 +76,15 @@
|
|||||||
-webkit-overflow-scrolling: touch;
|
-webkit-overflow-scrolling: touch;
|
||||||
overscroll-behavior: contain;
|
overscroll-behavior: contain;
|
||||||
padding: 0 12px calc(16px + var(--kb, 0px)); }
|
padding: 0 12px calc(16px + var(--kb, 0px)); }
|
||||||
|
/* DE LA PLACE SOUS LE CONTENU PENDANT QU'ON TAPE, et rien a mesurer.
|
||||||
|
Le clavier recouvre la page sans que rien ne le dise : ni la fenetre, qui
|
||||||
|
reste en plein ecran, ni visualViewport, qui rapporte la meme hauteur
|
||||||
|
clavier leve. Le panneau n'avait donc aucun debordement et ne pouvait pas
|
||||||
|
defiler - le bas du formulaire restait sous le clavier, definitivement.
|
||||||
|
Reserver 60 % de hauteur le temps de la saisie lui en donne, sans
|
||||||
|
dependre d'une mesure qui n'arrive jamais. Elle disparait au premier
|
||||||
|
champ quitte, donc rien ne flotte quand on ne tape pas. */
|
||||||
|
body.typing .scroll { padding-bottom: 60vh; }
|
||||||
|
|
||||||
/* --- barre de recherche ------------------------------------------------ */
|
/* --- barre de recherche ------------------------------------------------ */
|
||||||
.top { padding: 10px 12px 6px; display: flex; gap: 8px; }
|
.top { padding: 10px 12px 6px; display: flex; gap: 8px; }
|
||||||
@@ -723,8 +732,22 @@ function reportBox(why) {
|
|||||||
+ ' | box client ' + box.clientHeight + ' scroll ' + box.scrollHeight
|
+ ' | box client ' + box.clientHeight + ' scroll ' + box.scrollHeight
|
||||||
+ ' | body=' + sc);
|
+ ' | body=' + sc);
|
||||||
}
|
}
|
||||||
document.addEventListener('focusin', function () {
|
document.addEventListener('focusin', function (ev) {
|
||||||
setTimeout(function () { reportBox('focus'); }, 400);
|
var el = ev.target;
|
||||||
|
if (!el.classList || !el.classList.contains('field-in')) return;
|
||||||
|
document.body.classList.add('typing');
|
||||||
|
// Le champ remonte EN HAUT du panneau : la ou le clavier ne peut pas
|
||||||
|
// l'atteindre, quelle que soit sa hauteur. Differe d'un tour, sinon la place
|
||||||
|
// reservee ci-dessus n'est pas encore prise en compte et il n'y a nulle part
|
||||||
|
// ou remonter.
|
||||||
|
setTimeout(function () {
|
||||||
|
var row = el.closest ? el.closest('.field, .in-wrap') : null;
|
||||||
|
if (row && row.scrollIntoView) row.scrollIntoView({ block: 'start' });
|
||||||
|
reportBox('focus');
|
||||||
|
}, 250);
|
||||||
|
});
|
||||||
|
document.addEventListener('focusout', function () {
|
||||||
|
document.body.classList.remove('typing');
|
||||||
});
|
});
|
||||||
|
|
||||||
// AUCUN CHAMP D'UNE VUE AU REPOS NE GARDE LE FOCUS.
|
// AUCUN CHAMP D'UNE VUE AU REPOS NE GARDE LE FOCUS.
|
||||||
|
|||||||
Reference in New Issue
Block a user