Klawiatura Wyświetlana pozycja zawiedlonych elementów

Question

Mam grę wymagającą wprowadzenia klawiatury dotykowej telefonu komórkowego. Jego wyświetlanie ma problem, gdy tylko klawiatura pojawia się przy ustawieniu ostrości tekstu, cały mój element, którego pozycja: absolut powoduje, że wszystko jest pomieszane.

Czy istnieje wtyczka, która umożliwia zawsze wyświetlenie klawiatury mobilnej, aby zmienić położenie wszystkich elementów? Czy muszę zmienić ustawienia css tak, aby elementy nie zepsuły się po wyświetleniu klawiatury?

Jak mam to wdrożyć?

Jest to jeden z elementu CSS:

#mixer{ 
    position: absolute; 
    bottom:29%; 
    left:25%; 
    width: 234px; 
    height: 210px; 
    background: transparent url(img/mixer.png) 0 50px no-repeat; 
} 

Uwaga: używam jQuery mobile, PhoneGap na Android środowiska.

Answer 1

W swojej AndroidManifest.xml, dodaj następującą linię w ramach działania z klawiaturą:

android:windowSoftInputMode="adjustNothing"

Answer 2

Myślę, że Twój problem polega na tym, że Twój atrybut Dna jest ustawiony na "w tym przypadku" 29%. możesz ustawić go jako absolutny z TOP zamiast z dołu.

W ten sposób będzie naciskać od góry, zamiast patrzeć w dół, w tym przypadku na klawiaturę.

, więc chcesz mieć 29% dna, 100 - 29 = 71 Usuń dno 29% i zmień na 71%.

Answer 3

Posłuchaj pokazu/ukryj wydarzenia w Softkeyboard. To odpowiedź na SO ma przykład kodu:

Softkeyboard event Listener in Android

Gdy Softkeyboard jest w przedstawionym stanie, należy użyć oddzielnego „klawiaturę jest pokazane” CSS na swojej grze. Po ukryciu Softkeyboard powróć do poprzedniego "CSS z klawiaturą".

Ten poprzedni Q & A na SO zajmuje się podobnej sytuacji:

phonegap application layout issue with soft keyboard in Android 2.3.6 and in iPhone 5.0

Answer 4

Wpadłem na to w aplikacji na iPada, a nie na Androidzie, ale wygląda na to samo.

jQuery mobile ustawia wysokość strony z javascript po zmianie wielkości - wszystko wyrównane do dolnej części strony zostaje przeniesione w górę w html, w tym samym czasie, gdy system operacyjny przewija cały widok, aby zachować poprzednią pozycję wejścia widoczny.

Naprawiłem problem z niektórymi css, który sprawia, że ​​przeglądarka ignoruje ustawienie wysokości. Ułatwia także zmianę orientacji.

.ui-mobile, .ui-mobile .ui-page { 
    min-height: 100% !important; 
    } 

Answer 5

Sprawdź te links-

http://android-developers.blogspot.in/2009/04/updating-applications-for-on-screen.html

http://developer.android.com/reference/android/R.attr.html#windowSoftInputMode

spróbuj dodać w jawnym android: windowSoftInputMode = parametr "adjustResize" do tagu aktywności.

Mam nadzieję, że to pomaga.