0

我正在开发一个 Android 平板电脑应用程序，我有一个可以缩放的蓝图。从侧面菜单中，我可以将小符号拖到可缩放的图像中，以后可以单击和修改。把它想象成地图上的标记。

对于缩放部分，到目前为止我使用的是 WebView。这是我处理此功能的代码：

public void handlePinchZooming() {
    WebView webView = (WebView) findViewById(R.id.blueprintWebView);
    webView.setInitialScale(50);
    webView.getSettings().setBuiltInZoomControls(true);
    WebSettings settings = webView.getSettings();
    settings.setUseWideViewPort(true);
    settings.setLoadWithOverviewMode(true);
    webView.loadUrl("file:///android_asset/blueprint_example.jpg");
}

为了将标记拖到图像中并将它们添加为子项，我使用以下代码：

private void handleDragDrop() {
    findViewById(R.id.markerButton01).setOnTouchListener(new DragDropTouchListener());
    findViewById(R.id.markerButton02).setOnTouchListener(new DragDropTouchListener());
    findViewById(R.id.markerButton03).setOnTouchListener(new DragDropTouchListener());
    findViewById(R.id.blueprintWebView).setOnDragListener(new DragDropDragListener());
}

private final class DragDropTouchListener implements View.OnTouchListener {
    public boolean onTouch(View view, MotionEvent motionEvent) {
        view.setAlpha(100);
        if (motionEvent.getAction() == MotionEvent.ACTION_DOWN) {
            view.getLayoutParams().width = 50;
            view.getLayoutParams().height = 50;
            ClipData data = ClipData.newPlainText("", "");
            View.DragShadowBuilder shadowBuilder = new View.DragShadowBuilder(view);
            view.startDrag(data, shadowBuilder, view, 0);
            view.setVisibility(View.INVISIBLE);
            return true;
        } else {
            return false;
        }
    }
}

class DragDropDragListener implements View.OnDragListener {
    Drawable enterShape = getResources().getDrawable(R.drawable.blueprint_example);
    Drawable normalShape = getResources().getDrawable(R.drawable.blueprint_example);

    @Override
    public boolean onDrag(View v, DragEvent event) {
        int action = event.getAction();
        switch (event.getAction()) {
            case DragEvent.ACTION_DRAG_STARTED:
                // Do nothing
                break;
            case DragEvent.ACTION_DRAG_ENTERED:
                v.setBackgroundDrawable(enterShape);
                break;
            case DragEvent.ACTION_DRAG_EXITED:
                v.setBackgroundDrawable(normalShape);
                break;
            case DragEvent.ACTION_DROP:
                // Dropped, reassign View to ViewGroup
                View view = (View) event.getLocalState();
                ViewGroup owner = (ViewGroup) view.getParent();
                owner.removeView(view);
                WebView container = (WebView) v;
                container.addView(view);
                view.setX(event.getX()-25);
                view.setY(event.getY()-25);
                view.setVisibility(View.VISIBLE);
                setMarkerOnClickListener(view);
                break;
            case DragEvent.ACTION_DRAG_ENDED:
                v.setBackgroundDrawable(normalShape);
            default:
                break;
        }
        return true;
    }
}

现在，当我四处滑动蓝图图像时，标记会随之移动，但一旦我放大或缩小，标记之间的绝对距离始终保持相同，这使得它们远离蓝图上所需的位置。

我不确定您是否需要这个，但这是我的布局的 XML 文件的一部分：

<LinearLayout
        android:orientation="horizontal"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" android:gravity="center|right">

    <WebView
            android:layout_width="800dp"
            android:layout_height="600dp"
            android:id="@+id/blueprintWebView"
            android:layout_gravity="center" android:layout_margin="100dp"/>
    <LinearLayout
            android:orientation="vertical"
            android:layout_width="150dp"
            android:layout_height="fill_parent" android:layout_gravity="right" android:layout_marginRight="80dp"
            android:gravity="center_vertical|right" android:baselineAligned="false">
        <RelativeLayout
                android:layout_width="fill_parent"
                android:layout_height="150dp">
            <ImageView
                    android:layout_width="fill_parent"
                    android:layout_height="150dp"
                    android:id="@+id/imageButton01" android:src="@drawable/icon_printer"
                    android:adjustViewBounds="false"
                    android:longClickable="false"
                    android:cropToPadding="false" android:scaleType="fitCenter" android:layout_marginTop="20dp"
                    android:layout_marginBottom="20dp"/>
            <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:id="@+id/markerButton01" android:src="@drawable/icon_marker_pink"
                    android:scaleType="fitCenter" android:cropToPadding="false" android:visibility="visible"
                    android:focusableInTouchMode="false" android:alpha="0" android:adjustViewBounds="false"/>
        </RelativeLayout>
        <RelativeLayout
                android:layout_width="fill_parent"
                android:layout_height="150dp">
            <ImageView
                    android:layout_width="fill_parent"
                    android:layout_height="150dp"
                    android:id="@+id/imageButton02" android:src="@drawable/icon_printer"
                    android:scaleType="fitCenter" android:layout_marginTop="20dp" android:layout_marginBottom="20dp"/>
            <ImageView
                    android:layout_width="wrap_content" android:layout_height="wrap_content"
                    android:id="@+id/markerButton02" android:src="@drawable/icon_marker_pink"
                    android:scaleType="fitCenter" android:cropToPadding="false" android:visibility="visible"
                    android:focusableInTouchMode="false" android:alpha="0" android:adjustViewBounds="false"
                    android:baselineAlignBottom="false"/>
        </RelativeLayout>
        <RelativeLayout
                android:layout_width="fill_parent"
                android:layout_height="150dp">
            <ImageView
                    android:layout_width="fill_parent"
                    android:layout_height="150dp"
                    android:id="@+id/imageButton03" android:src="@drawable/icon_printer" android:cropToPadding="false"
                    android:scaleType="fitCenter" android:layout_marginBottom="20dp" android:layout_marginTop="20dp"/>
            <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content"
                         android:id="@+id/markerButton03" android:src="@drawable/icon_marker_pink"
                         android:scaleType="fitCenter" android:cropToPadding="false" android:visibility="visible"
                         android:focusableInTouchMode="false" android:alpha="0" android:adjustViewBounds="false"
                         android:baselineAlignBottom="false" android:focusable="false"/>
        </RelativeLayout>
    </LinearLayout>
</LinearLayout>

感谢您为解决这个小问题提供的所有帮助。:)

问候，

指关节

4

1 回答 1

0

您可能需要自己重新计算捏合位置。我不知道 webview 是否允许您获取有关其缩放状态等的信息。也许您会想要切换到此方法，让您完全控制缩放过程： Android Image View Pinch Zoom

另一种方法可能是使用 javascript 在 webview 中显示标记。但这仅适用于您从事 Web 开发的情况。

于 2013-04-01T22:45:59.967 回答