一款行为类似于浏览器（缩放/平移）的Android实现

Question

一款行为类似于浏览器（缩放/平移）的Android实现

androidlayoutzoomingpan

3

我想知道是否有可能创建一个Android应用程序，其行为与Android手机上的任何浏览器相同，包括以下内容：

(捏)缩放
平移/滚动

我已经尝试了一些方法

ZoomView 能够解决第一个问题，但当布局大于屏幕时无法正常工作（这时需要滚动/平移：如果超出屏幕，则布局会被裁剪，并且在 {{code}ScrollView} 中放置时行为奇怪）。
为了平移/滚动，我尝试使用 TwoDScrollView，但与上述控件一样，这个控件也有些问题。
ZoomableRelativeLayout 可以工作，甚至实现了捏合缩放，但只适用于图像。例如，可点击区域在进行缩放/平移时不会移动。因此，这也行不通。

备选方案

我正在使用WebView/PhoneGap，但我并不是HTML（5）或JavaScript方面的专家。

问题

如果我有一个布局可能比屏幕更大，并使其完全可缩放和平移，最好是本地实现，应该采取什么方法？

我读过的文章

当前实现及其缺点

View zoomableLayout = ((LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE)).inflate(R.layout.actuallayout, null, false);
zoomableLayout.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT));

zoomView = new ZoomView(this);
zoomView.addView(zoomableLayout);
LinearLayout main_container = (LinearLayout) findViewById(R.id.main_container);
main_container.addView(zoomView);

这很不错，只要未缩放的布局适合屏幕大小。一旦它变得更大，我需要实现一个ScrollView，功能就不如预期。例如，如果我向下滚动并放大，我无法滚动到顶部，只能滚动到放大时可见的内容。

- stealthjong

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- stealthjong · Accepted Answer

我强烈建议使用 PhoneGap 来通过 HTML5 进行编程。这并不难。

编辑：需要执行以下几个步骤：

1. 添加 cordova 作为库（在我的情况下是 cordova-2.5.0.jar）。 2. 创建一个类来处理返回的 JavaScript 调用（参见下面的 JSComm.java）。 3. 创建一个带有 webview 的活动 DroidGap（参见下面）；请注意，Apache 在更新版本中将其重命名为 CordovaActivity。 4. 创建一个 JavaScript 文件（参见下面）。 5. 创建一个 HTML 页面（参见下面），其中包括对您的 JavaScript 文件和 cordova JavaScript 文件（在我的情况下是 cordova-2.5.0.js）的引用。 6. 在 /res/xml/config.xml 中添加一些 xml（参见下面）。 7. 不要忘记将您的活动添加到清单中。

JSComm.java

public class JSComm extends CordovaPlugin {     
    public boolean execute(final String action, final JSONArray args, CallbackContext callbackContext) {
        final CallbackContextWrapper callbackContextWrapper = new CallbackContextWrapper(callbackContext);
        if (action.equals("MyString")
            return handleIt(args.getJSONObject(0));
        else 
            return false;
    }
}

MyCordovaActivity.java

public class FormViewer extends DroidGap {
    @SuppressLint("SetJavaScriptEnabled")
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        super.init();
        super.appView.getSettings().setJavaScriptEnabled(true);
        super.appView.getSettings().setSupportZoom(true);
        super.appView.getSettings().setBuiltInZoomControls(true);
        super.appView.getSettings().setDisplayZoomControls(false);
        super.appView.getSettings().setUseWideViewPort(true);
        super.appView.getSettings().setLoadWithOverviewMode(true);
        super.loadUrl("file:///" + myHTMLFilePath);
    }

    public void nextPage() {
        this.sendJavascript("nextPage()"); //example
    }
}

JSComm.js

function nextPage() {
  var inputted = trytogetinputs(); //some method: get all html input elements
  cordova.exec(
      null, //what to execute when success? Nothing in this case.
      function(args) {
          addErrorBorders(args); //What to do if fail? add some error borders in this case.
      },
      "JSComm", //name of CordovaPlugin class
      "MyString", //to identify what method was run
      [inputted] //some data you can send along.
  );
}

您的HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
    <title>Title</title>
    <link rel="stylesheet" type="text/css" href="common.css">
    <script type="text/javascript" src="../../jquery.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="../../cordova-2.5.0.js"></script><!--Cordova js file-->
    <script type="text/javascript" charset="utf-8" src="../../javacomm.js"></script><!--Your js file-->
    <script type="text/javascript" src="../../jquery-ui.min.js"></script>
    <script type="text/javascript" src="../../jquery.signature.min.js"></script>
  </head>
  <body background="0.png">...etc...</body></html>

xml

<?xml version="1.0" encoding="utf-8"?>
<!--
       Licensed to the Apache Software Foundation (ASF) under one
       or more contributor license agreements.  See the NOTICE file
       distributed with this work for additional information
       regarding copyright ownership.  The ASF licenses this file
       to you under the Apache License, Version 2.0 (the
       "License"); you may not use this file except in compliance
       with the License.  You may obtain a copy of the License at

         http://www.apache.org/licenses/LICENSE-2.0

       Unless required by applicable law or agreed to in writing,
       software distributed under the License is distributed on an
       "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
       KIND, either express or implied.  See the License for the
       specific language governing permissions and limitations
       under the License.
-->
<cordova>
    <!--
    access elements control the Android whitelist.
    Domains are assumed blocked unless set otherwise
     -->

    <access origin="http://127.0.0.1*"/> <!-- allow local pages -->

    <!-- <access origin="https://example.com" /> allow any secure requests to example.com -->
    <!-- <access origin="https://example.com" subdomains="true" /> such as above, but including subdomains, such as www -->
    <access origin=".*"/>

    <!-- <content src="http://mysite.com/myapp.html" /> for external pages -->
    <content src="index.html" />

    <log level="DEBUG"/>
    <preference name="useBrowserHistory" value="true" />
    <preference name="exit-on-suspend" value="false" />
    <preference name="fullscreen" value="false" />
<plugins>
    <plugin name="App" value="org.apache.cordova.App"/>
    <plugin name="Geolocation" value="org.apache.cordova.GeoBroker"/>
    <plugin name="Device" value="org.apache.cordova.Device"/>
    <plugin name="Accelerometer" value="org.apache.cordova.AccelListener"/>
    <plugin name="Compass" value="org.apache.cordova.CompassListener"/>
    <plugin name="Media" value="org.apache.cordova.AudioHandler"/>
    <plugin name="Camera" value="org.apache.cordova.CameraLauncher"/>
    <plugin name="Contacts" value="org.apache.cordova.ContactManager"/>
    <plugin name="File" value="org.apache.cordova.FileUtils"/>
    <plugin name="NetworkStatus" value="org.apache.cordova.NetworkManager"/>
    <plugin name="Notification" value="org.apache.cordova.Notification"/>
    <plugin name="Storage" value="org.apache.cordova.Storage"/>
    <plugin name="FileTransfer" value="org.apache.cordova.FileTransfer"/>
    <plugin name="Capture" value="org.apache.cordova.Capture"/>
    <plugin name="Battery" value="org.apache.cordova.BatteryListener"/>
    <plugin name="SplashScreen" value="org.apache.cordova.SplashScreen"/>
    <plugin name="Echo" value="org.apache.cordova.Echo" />
    <plugin name="Globalization" value="org.apache.cordova.Globalization"/>
    <plugin name="InAppBrowser" value="org.apache.cordova.InAppBrowser"/>
    <plugin name="JSComm" value="com.example.application.JSComm"/>
</plugins>
</cordova>