具有可点击区域的可缩放 SVG - Android

2024-03-26

我正在做一个非常简单的应用程序。它需要显示一个包含广义世界地图的 SVG。通过单击城市名称(svg 矩形),我需要显示与该城市对应的另一个 SVG。此外,所有 SVG 都必须支持缩放和平移。

我设法让 SVG 支持缩放和平移,效果非常完美。为此,我正在使用svg-android https://code.google.com/archive/p/svg-android/用于渲染 SVG 和自定义的库触摸图像视图 https://github.com/MikeOrtiz/TouchImageView用于平移、缩放以及捕获比例和触摸事件。但是,在 Android 中似乎不可能在 SVG 上创建可点击区域。

我尝试使用蛮力,在每次用户交互(触摸或按比例)以及每次单击 SVG 时重新计算我感兴趣的区域的位置,以检查我的区域(矩形列表)是否包含该点,并执行相应的操作。

这不起作用,因为我无法理解计算规则MotionEvent#getX/Y和类似的方法。也许对于固定 SVG 我可以实现这一点,但对于可缩放,我真的不能。

有什么提示吗?这在 Android 中可能吗?


首先,非常抱歉这么晚才回复。希望对每个人来说还不算太晚:)

我制造了一个带有代码示例的 GitHub 存储库 https://github.com/AlexMilutinovic/ClickZoomSVG(不适用于工作应用程序),所以请使用它! :)

使用 repo 的自述文件了解一些详细信息。

核心解决方案:

SVG svg = SVGParser.getSVGFromResource(getResources(), R.raw.world_map);

// Get image view (this is our SVG map that is going to be clickable and zoomable):
ImageView touchImageView = (ImageView) view.findViewById(R.id.touchImageView);

// Create drawable (will convert svg to drawable so we can set it to image view as a bitmap):
PictureDrawable image = svg.createPictureDrawable();
Bitmap b = drawableToBitmap(image); // refer to WorldMapFragment for source code of the converting method 
touchImageView.setImageBitmap(b);

// Create image with clickable areas from previous image view and set listener to id (listener of type OnClickableAreaClickedListener created in onAttach callback):
ClickableAreasImage clickableAreasImage = new ClickableAreasImage(new PhotoViewAttacher(touchImageView), listener);

// Define your clickable areas
// parameter values (pixels): (x coordinate, y coordinate, width, h eight) and assign an object to it
List<ClickableArea> clickableAreas = new ArrayList<>();
Map<String, FintemCity> cities = svg.getCities();
for (String key : cities.keySet()){
  clickableAreas.add(cities.get(key).toClickableArea(getMetrics()));
}

// Set your clickable areas to the image
clickableAreasImage.setClickableAreas(clickableAreas);

感谢投票! :)

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

具有可点击区域的可缩放 SVG - Android 的相关文章

  • 如何查看 Android 设备上安装的 SD 卡还有多少可用空间?

    如何以编程方式检查 Android 设备上安装的 SD 卡有多少可用空间 要获取外部 SD 卡的可用 可用 空间以显示与菜单 gt 设置 gt SD 卡和手机存储的编号一致的编号 请使用以下代码 StatFs stat new StatFs
  • Kotlin 中的单例类

    我想知道如何在 Kotlin 中创建一个单例类 以便我的 Util 类在每次应用程序执行时仅实例化一次 但是 当我将 Java 类转换为 kotlin 时 生成了以下代码 它是否正确 companion object private var
  • 如果我使用单例,在哪里关闭 SQLiteOpenHelper

    我有以下课程允许用户获得SQLiteOpenHelper object import android content Context public class DBUtils private DBUtils private static D
  • Android 中的 JDBC 连接

    有没有人在 android 中尝试过 JDBC 连接 因为在 Android 2 3 中支持 JDBC 我必须在没有 Web 服务的情况下连接 Mysql 我已经提出申请 但它给了我错误 public class MysqlConnect
  • 需要在 Android Studio 中使用 Team Foundation 客户端可能的替代方案/解决方法吗?

    我有一个场景 我需要使用 android studio 作为 IDE 使用 Team Foundation Server 作为源代码控制存储库 问题是android studio中没有TFS的插件 并且没有 TFS Windows 的独立客
  • 在 CollapsingToolbarLayout 中设置 minHeight 没有任何效果

    我目前使用 CollapsingToolbarLayout 遇到的主要问题是 无论我尝试什么 工具栏的 minHeight 属性都没有任何效果 我想要的结果是这样的 CollapsingToolbarLayout 具有一定的展开高度和一定的
  • 在 Android 中绘制一条带有弯曲边缘的线

    I am using canvas drawLine to draw some line in android but the lines are too sharp but i need a curved edges 这里的 1 是我所拥
  • SVG 图标像素对齐?

    在此图像中 左侧 黑色 垃圾桶是图标字体 它的字体大小是 16px 这使得图标在 100 的时间里看起来都很清晰 两个蓝色垃圾桶是 SVG 它们具有完全相同的标记 其中之一happened一个是像素对齐的 另一个不是 我怎样才能强制我的 S
  • 安装 OpenGL ES 并编译 Android 代码

    我刚刚开始在 android 上学习 OpenGL ES 使用这本书 https rads stackoverflow com amzn click com 1430226471 并遇到了采用的问题source http apress co
  • sqlite 插入表中 select * from

    我需要在 Android 应用程序中将数据从一个表移动到另一个表 我想使用以下sql insert into MYTABLE2 select id STATUS risposta DATETIME now data ins from MYT
  • Android 6.0 缺乏访问相机服务的权限

    我在 Android 6 0 中使用 Camera2API 我在Android 5 0中没有报错 然而 当我在 Android 6 0 中使用我的代码时 我遇到了问题 问题是有时我可以成功打开相机并拍照 但有时相机打不开 出现错误 java
  • 将原生 Twilio Android SDK 与 Flutter 集成

    我正在尝试使用 flutter 创建 IP 语音 VOIP 移动应用程序 我还没有看到 twilio 语音 api 的 flutter 插件的实现 所以我使用 MethodChannel 将我的应用程序与本机 android 语音 api
  • 尝试在空对象引用上调用虚拟方法“java.lang.String org.jsoup.nodes.Element.ownText()”

    我正在使用下面的代码来获取版本名称 from 应用商店通过使用 jsoup 我正在获取详细信息 但它引发了一些异常 我的代码是 public class ForceUpdateAsync extends AsyncTask
  • 更改弹出对话框的背景颜色

    我编写了显示弹出对话框的 android 代码 但我想将背景颜色从黑色更改为白色 然后更改文字颜色 这是对话框的代码 mPrefs PreferenceManager getDefaultSharedPreferences this Boo
  • setKeyListener 将覆盖 setInputType 并更改键盘

    大家好 我在两个设备之间遇到问题 在实践中使用InputType和KeyListener我正在操纵一个EditText让它从数字键盘接收逗号和数字 有关更多背景信息 请检查我之前的question https stackoverflow c
  • 分配函数后如何删除 onmouseout 事件?

    我有一个问题 我正在为 onmouseout 事件分配一个函数 但运行该事件后 我需要将其删除 将非常感谢您的帮助 这取决于你的代码 如果你用 d3 这样做 那么你可以说 在 onmouseout 事件函数中 element on mous
  • 将视图放置在 ConstraintLayout 之外

    我想将视图放置在ConstraintLayout用滑动动画来制作它们的动画 我尝试过设置像这样的约束constraintBottom toTopOf parent 但是View留在容器内 请注意 我希望通过使用内置动画的约束来实现此目的 而
  • 如何从耳机插孔获取电力?

    我的问题是是否有人知道如何创建一个可以通过设备的耳机插孔发送电荷的 Android 应用程序 就像这个视频中那样 该视频展示了一款 iPhone 应用程序 可控制插入耳机插孔的 LED 我想知道如何访问该设备来发送电信号 抱歉我的英语不是我
  • 有什么方法可以禁用/覆盖 Galaxy Tab 4 上的多任务按钮吗? [复制]

    这个问题在这里已经有答案了 我们编写了一个工业控制应用程序 并随我们的制造产品预装在三星 Galaxy 平板电脑上 我们使用的平板电脑是运行 Honeycomb 的 Tab 10 但我们无法再获得足够的 OEM 平板电脑 因此我们改用运行
  • Android On Focus Listener 和 On Click Listener on ImageView

    我有一个 imageview 它具有两个属性 可聚焦的 and 可聚焦触摸模式 set to true

随机推荐

  • VBA 使用架构文件提取数据

    我下面有这个代码 Option Explicit Sub MadMule2 Dim IE As InternetExplorer Dim el Dim els Dim colDocLinks As New Collection Dim Ti
  • FastAPI 中的单元测试

    我有一个使用 FastAPI 开发的后端应用程序 使用 SQLModel SQLAlchemy 和 Pydantic 并连接到 Postgres 数据库 我有集成测试来测试我的端点是否可以与暂存 PG DB 正常工作 但现在我必须编写单元测
  • 使用波形符 ~ 扩展对 HOME 目录进行测试时得到负面结果

    我收到一个奇怪的错误 似乎无法弄清楚为什么 特别是因为它在一个地方有效 但在另一种情况下无效 我有他的代码来检查这些目录是否存在 并且带有 的 HOME 目录在此代码片段中失败 if d valueToTest then echo Fail
  • 运行自动发现的 python 单元测试的子集

    简短的问题在 Python 的单元测试模块中使用自动发现方法时 是否可以在运行时选择要运行的单元测试 背景我正在使用 unittest 模块在外部系统上运行系统测试 请参阅下面的示例 sudo testcase unittest 模块允许我
  • 使用 500GB 内存时,Pandas pd.melt 在取消旋转 3.5 GB csv 时抛出内存错误

    使用 500GB 内存时 Pandas pd melt 在取消旋转 3 5 GB csv 时抛出内存错误 是否有任何解决方案 功能可用于 unpivot 巨大的 CSV 文件 当前的 csv 有超过 5000 列 我在同样的问题上苦苦挣扎
  • 错误的 UDP 校验和没有效果:为什么?

    我正在尝试测试 UDP 程序 如果它接收到 UDP 校验和错误的数据 会发生什么情况 奇怪的是 它似乎没有任何效果 并且有效负载被成功接收 至少在 OS X 上是通过环回接口成功接收的 下面是一个示例 其中使用以下方式发送数据SOCK RA
  • Elasticsearch 中的 _search 查询如何工作?

    问题更在于 Elasticsearch 节点如何交互以给出特定的搜索结果以及搜索请求的流程是什么 我参考了以下链接来理解 但它们对于我想要理解的内容不是很清楚 https www elastic co guide en elasticsea
  • 使用指针的数组长度[重复]

    这个问题在这里已经有答案了 数组长度可以使用以下方式计算 arr 1 arr然后简化为 arr 1 arr这进一步简化为1 arr arr 但是 当在与完成内存分配的函数不同的函数中计算长度时 会计算出错误的结果 例如 include
  • 为什么 Typescript 中需要 infer 关键字?

    为什么 Typescript 开发人员创建了infer关键词 根据文件 https www typescriptlang org docs handbook release notes typescript 2 8 html 这是如何使用它
  • ASP.NET MVC - 从 MemoryStream 下载 Excel 文件(损坏的文件)

    我正在尝试使用浏览器中的内置下载来下载 Excel 文件 基本上 在我的控制器中创建 Excel 文件后 下载工作正常 但是当我尝试在 Excel 中打开此文件时 我被告知该文件已损坏 Excel 无法打开文件 Report xlsx 因为
  • 释放从新放置分配的内存

    考虑下面的代码 include iostream include conio h using namespace std class sample private int i public sample int ii 0 i ii cout
  • 打开android studio配置文件时发生OOM错误

    安卓版本 8 0 0 当我调用file list时 如果我打开android studio profiler来监控内存 很容易出现OOM错误 如下 java lang OutOfMemoryError EnsureLocalCapacity
  • .NET Core 初始请求缓慢

    面对创建新的小型服务的任务 我想知道是否有一些最佳实践指南来确保该服务的快速响应时间 包括前 1 3 个请求 首先 我喜欢使用 NET Core 和 webapi 模板 NET Core 6 创建服务 但是创建其中一些后 我注意到服务的初始
  • Java 数组和列表的共同祖先

    在 NET 中 数组和列表都以 Enumerable 作为祖先 因此接受 Enumerable 作为参数的方法可以同时接收数组和列表作为其参数 我想知道Java中是否有类似的东西 不 Java 中没有类似的东西 我通常建议你设计 API 方
  • setTimeOut 和本地函数

    我正在开发 Axe 4 0 我正在尝试在具有本地函数的作业中使用 Object setTimeOut 方法 如中所述msdn 文档 http msdn microsoft com en US library aa857865 28v ax
  • 在类模板中为成员函数定义单个模板,并在成员函数中使用两个模板

    我目前正在学习模板如何在 C 中工作 特别是 我正在查看类模板中的单个成员函数模板 为了理解我的意思 代码如下 foo h template
  • 向光标位置插入元素(表格)

    我想创建一个具有自定义样式的新 Table 元素 并将其附加到文档中的当前光标位置 我发现可以通过以下方式获取当前位置 var cursor DocumentApp getActiveDocument getCursor 返回一个 Posi
  • ASP.Net 中 URL 中的 UrlEncoding Plus(+)

    我正在对一个字符串进行加密和 Base64 处理 一切都运行良好 直到我从 QueryString 集合中检索加密的字符串 加密文本包含一个加号 当我检索加密的字符串时 曾经有加号的地方现在变成了空格 正如您可以想象的那样 这不会解密 我尝
  • 搜索颠覆历史(全文)

    有没有办法对颠覆存储库执行全文搜索 包括所有历史记录 例如 我编写了一个在某处使用过的功能 但后来不需要它 所以我对文件进行了 svn rm d 但现在我需要再次找到它以将其用于其他用途 svn 日志可能会说 删除了未使用的内容 之类的内容
  • 具有可点击区域的可缩放 SVG - Android

    我正在做一个非常简单的应用程序 它需要显示一个包含广义世界地图的 SVG 通过单击城市名称 svg 矩形 我需要显示与该城市对应的另一个 SVG 此外 所有 SVG 都必须支持缩放和平移 我设法让 SVG 支持缩放和平移 效果非常完美 为此