2013-02-21 20 views
5

Próbuję utworzyć aplikację do czatowania przy użyciu aplikacji PhoneGap na urządzenia z systemem iOS. Aplikacja ma nagłówek, który pokazuje zalogowanego użytkownika, stopkę, w której użytkownik może napisać swoją wiadomość tekstową, oraz widok listy umieszczony w treści wiadomości.Strona PhoneGap przewiń w górę po pojawieniu się klawiatury w urządzeniach z systemem iOS, która powoduje uszkodzenie strony PhoneGap

Zaktualizowałem do najnowszej wersji JQueryMobile (1.3.0), ale problem nadal występuje w aplikacji. Załączam migawkę pokazuje, w jaki sposób układ staje się uszkodzony. (http://i.stack.imgur.com/RsLfT.png)

Próbowałem kilku rozwiązań, takich jak uniemożliwianie przewijania strony (ustawianie UIWebViewBounce na false) i nie skalowanie (skalowalne przez użytkownika = nie) i inne zmiany interfejsu użytkownika, ale problem nie został rozwiązany.

Czy ktoś ma pomysł, jak to naprawić? (Jak odświeżenia po wyglądzie miękkiej klawiatury)


Odpowiedz

3

Aby rozwiązać ten problem tymczasowo (bo pokazuje przerw podczas gdy klawiatura jest wyświetlana), można ustawić „KeyboardShrinksView” na „true” w konfiguracji file (config.xml) lub dodać go:

<widget> 
    ... 
    <preference name="KeyboardShrinksView" value="true" /> 

    <plugins>... 
+0

.. i to jest dziedzictwo po roku: http://stackoverflow.com/questions/21739396/phonegap-3-3-ios-keyboardshrinksview – commonpike

1

I skontaktowaliśmy PhoneGap Wsparcie i poinformował, że oczekuje się, że właściwa fix do zrobienia w PhoneGap 2.6 zwolnienia dotyczącego tej kwestii

+1

O ile rozumiem, problem pojawia się, gdy pojawia się klawiatura, a następnie przewija się stronę ORAZ istnieje dodatkowa przestrzeń (około 40 pikseli wysokości) dołączona na końcu strony. Jeśli to prawda, to nadal istnieje w PG 3.0 :( –

2

Teraz można dodać :

document.body.scrollTop = 0; 

za każdym razem, gdy pole wejściowe odbierze rozmycie.

+0

dzięki Zejesago, próbowałem tego rozwiązania wcześniej, ale strona pojawi się poruszając się w górę iw dół i jest denerwujące dla użytkowników –

+0

@zejesago, działa .... dzięki kumplowi. starałem się, aby to rozwiązanie zadziałało !!! +1 dla ciebie! – Sushant

+0

@zejesago, czy możemy naprawić nagłówek, gdy klawiatura jest otwarta? Oto moje pytanie z zrzutami ekranu [link] (http: // stackoverflow.com/questions/24378587/iphone-keyboard-push-page-up-in-phonegap) – Sushant

1

Naprawiłem go za pomocą CSS oraz owijkę

/*Phone < 5:*/ 
@media screen and (device-aspect-ratio: 2/3) { 
    .content { 
    height: 416px !important; 
} 
} 

/*iPhone 5:*/ 
@media screen and (device-aspect-ratio: 40/71) { 
    .content { 
    height: 504px !important; 
    } 
} 
+0

Witaj steeve, wypróbowałem twoje rozwiązanie, czasami naprawiasz układ, ale problem się pojawia (testowany przy użyciu PhoneGap 2.5) –

+0

W moim przypadku został całkowicie rozwiązany, ponieważ nic nie zależy od wysokości okna, a wszystko to dotyczy kontenera. Nie ma co do tego wątpliwości jest rodzimym błędem, ale nie ma innego rozwiązania. – Steeve17

2

miałem ten sam problem przy użyciu Twitter bootstrap 3.

dodania:

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> 

Rozwiązał problem dla mnie.

1

Ekran Wysokość zmienia się, gdy klawiatura wyskakuje

Cordova/PhoneGap wysokości ekranu aplikacji lub window.innerHeight wartość jest coraz zmniejszona, gdy klawiatura wyskakuje, to re-rozmiary zawartość wewnątrz & sprawia, że ​​ekran wyglądają uszkodzony.

Za pomocą Javascript, Na lub w aplikacji initialize ustaw wysokość ekranu urządzenia na swój element opakowania/pojemnika.

$('#container').height(window.innerHeight); // jQuery