Question

我正在开发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>

我很感激您帮助解决这个小问题。：）

此致

指关节

Answer 1

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

另一种方法是使用javascript在webview中显示标记。但这只有在你进入网络发展的时候。

Android：带有附加子视图的缩放缩放ImageView

1 个答案: