Включение масштабирования области просмотра в приложении Android Phonegap не имеет никакого эффекта - PullRequest
19 голосов
/ 01 апреля 2012

Мне нужно иметь возможность включать и выключать пинч-зум с помощью настроек области просмотра в моем приложении Android PhoneGap.

Но я не могу заставить область просмотра вообще влиять на масштабирование при использовании PhoneGap. Я не могу включить Pinch-zoom в PhoneGap, но при просмотре с помощью собственного браузера Android на веб-странице все работает нормально.

Я потратил много времени на поиски решения, но безрезультатно.

Я создал очень простой index.html для тестирования с настройкой области просмотра, например:

<meta name="viewport" content="user-scalable=yes" />

Как предположили некоторые, я также пробовал окно просмотра:

<meta name="viewport" content="user-scalable=1" />

Другие решения для Android PhoneGap могут включать Android Native Pinch-Zoom, которые были предложены здесь: увеличить пробел для Android Но это не будет работать для меня, так как мне нужно иметь возможность контролировать масштабирование из javascript. То есть Мне нужно иметь возможность использовать javascript для изменения настроек области просмотра, чтобы контролировать, когда доступно масштабирование по пинчу (масштабируемое пользователем = да / масштабируемое пользователем = нет)

Обратите внимание, что другие параметры окна просмотра, такие как «initial-scale» и «target-densitydpi», работают нормально. Например, установка initial-scale = 2 запускает приложение в увеличенном масштабе.

(в настоящее время я тестирую масштабирование на PhoneGap 1.4.1 и HTC Desire HD Android 2.3.3)

Я начинаю думать, что упустил что-то очевидное, так как нахожу так мало информации о подобных проблемах ...

Минимальный index.html:

<!DOCTYPE HTML>
<html>
  <head>
    <meta name="viewport" content="user-scalable=yes" />
    <meta http-equiv="Content-type" content="text/html; charset=utf-8">
    <title>Minimal AppLaud App</title>
      <script type="text/javascript" charset="utf-8" src="phonegap-1.4.1.js"></script>
      <script type="text/javascript" charset="utf-8">

        var onDeviceReady = function() {
            document.getElementById("devready").innerHTML = "OnDeviceReady fired.";
        };

        function init() {
            document.addEventListener("deviceready", onDeviceReady, true);
        }   
      </script>  

  </head>
  <body onload="init();" id="stage" class="theme">
    <h2>Minimal AppLaud App</h2>
    <p> LOTS OF TEXT WHICH HAVE BEEN REMOVED HERE </p>

    <p><span id="devready">onDeviceReady not fired.</span></p>

  </body>
</html>

Цени любые идеи, которые у тебя могут быть!

Ответы [ 6 ]

13 голосов
/ 23 октября 2012

Используете ли вы PhoneGap Build? С PhoneGap Build это невозможно.

С Desktop PhoneGap, если вы еще этого не сделали, следуйте инструкциям PhoneGap Руководство по началу работы с Android и настройте свой код в проекте Eclipse.

После настройки отредактируйте основной файл Java, как в руководстве по началу работы: Добавьте следующий импорт:

import android.webkit.WebSettings; 
import android.webkit.WebSettings.ZoomDensity;

Ниже 'super.loadUrl ("file: ///android_asset/www/index.html");' Введенную строку в качестве части руководства по запуску добавить:

settings.setBuiltInZoomControls(true);
settings.setSupportZoom(true);
settings.setDefaultZoom(ZoomDensity.MEDIUM); 

Очистите и постройте свой проект - теперь разрешено масштабирование.

Чтобы ограничить, насколько пользователи могут увеличивать масштаб, добавьте метатег, как показано ниже, на каждую HTML-страницу:

<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, minimum-scale=1, maximum-scale=1.5, user-scalable=1">
6 голосов
/ 14 марта 2016

Только что подтвердил, что Pinch Zoom работает на следующих телефонах Android:

  • Samsung Galaxy S820L Android 4.4

  • LG Sunset L33L Android 5.0

С помощью CLI PhoneGap (не службы) в Windows:

C:\>phonegap --version
5.4.1

Android SDK Инструменты Verion:

24.4.1 (from the SDK Manager)

Вот код для MainActivity.java (платформы \ android \ src \ com \ phonegap \ helloworld):

package com.phonegap.helloworld;

import android.os.Bundle;
import org.apache.cordova.*;

import android.webkit.WebView;
import android.webkit.WebSettings;

public class MainActivity extends CordovaActivity
{
    @Override
    public void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        // Set by <content src="index.html" /> in config.xml
        loadUrl(launchUrl);

        WebView webView = (WebView) appView.getEngine().getView();
        WebSettings settings = webView.getSettings();

        settings.setBuiltInZoomControls(true);
        settings.setDefaultZoom(WebSettings.ZoomDensity.MEDIUM);
        settings.setSupportZoom(true);
    }
}

И это в index.html:

 <meta name="viewport" content="user-scalable=yes, initial-scale=1, maximum-scale=3, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />

Еще одна заметка - с этим звонком:

settings.setDefaultZoom(WebSettings.ZoomDensity.MEDIUM);

получил это при строительстве:

uses or overrides a deprecated API - Note: Recompile with -Xlint:deprecation for details

Прокомментировал это, и Zoom не был затронут.

Спасибо, ребята !!!

2 голосов
/ 07 апреля 2016

Кто бы ни даже после этого не нашел решения, я нашел ответ в Github:

https://github.com/LouisT/cordova-useragent/issues/1

В основном вы должны:

import android.webkit.WebView;

А потом:

// super.appView.getSettings().setBuiltInZoomControls(true);
// super.appView.getSettings().setDefaultZoom(ZoomDensity.MEDIUM); 
// super.appView.getSettings().setSupportZoom(true);
// Instead use this
WebView webView = (WebView) appView.getEngine().getView();
WebSettings settings = webView.getSettings();
settings.setBuiltInZoomControls(true);
settings.setDefaultZoom(ZoomDensity.MEDIUM);
settings.setSupportZoom(true);
1 голос
/ 23 февраля 2016

Для cordova 5.xx вам нужно использовать решение от https://github.com/LouisT/cordova-useragent/issues/1

import android.webkit.WebView;

WebView webView = (WebView) appView.getEngine().getView();
WebSettings settings = webView.getSettings();
settings.setBuiltInZoomControls(true);
settings.setDefaultZoom(ZoomDensity.MEDIUM);
settings.setSupportZoom(true);

Для меня было необходимо изменить ZoomDensity.MEDIUM на WebSettings.ZoomDensity.MEDIUM

0 голосов
/ 11 июля 2013

html5 документ должен начинаться с:

<!DOCTYPE html>

Без этой строки не работало окно просмотра AppBrowser в Phonegap Android

0 голосов
/ 09 апреля 2012

У меня точно такая же проблема, и кроме тестирования различных настроек области просмотра, я попробовал следующие предложения: Сжатие в Android с Phonegap и jQUERY Mobile , но я не могу заставить его работать (тестирование наSamsung Galaxy SII, Android 4.0.3).Тем не менее, другие сообщили об успешном масштабировании с помощью подсказок по ссылке.Надеюсь, это вам тоже поможет!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...