热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

在Android的WebView中修改选择时,文本选择菜单消失

我到处搜索,似乎找不到任何遇到相同问题的人。问题摘要:当我选

我到处搜索,似乎找不到任何遇到相同问题的人。

问题摘要:
当我选择一些文本时,会出现标准菜单(“复制”,“粘贴”等),但是当我修改选择内容以使其包含具有某些CSS规则的 words 时,菜单会消失(选择时保持活动状态。

到目前为止,我在以下设备上遇到了该问题:


  • “三星Galaxy Tab S”(SM-T705),Android 6.0.1,Chrome / 78.0.3904.108

  • “三星Galaxy Tab A”(SM-T550),Android 7.1.1,Chrome / 77.0.3865.92

  • “三星Galaxy Tab S4”(SM-T830),Android 9,Chrome / 78.0.3904.108

  • “ OnePlus 6T”,Android 9,Chrome / 79.0.3945.93

低于6的Android版本似乎没有受到影响(我认为是因为文本选择菜单不同)。

较长版本的问题:
我正在一个项目中,我们的网页中充满了文本,这些文本应该是可选择的。
问题是某些HTML元素具有打破文本选择菜单的CSS规则,我不知道为什么。
很遗憾,这些网页是由第三方生成的,因此我无法直接控制其结构/ CSS规则。
我拿走了其中一页,并尽可能地剥离了它,只保留了复制问题所需的内容。

这是页面的HTML:














class="sid19 sf19 sf1 sf20 di psr b0 l0" data-x="126" data-y="322" id="word8">ONE class=" sf19 di psr b0 l0 fm sf22"> class="sid23 sf19 sf1 sf20 di psr b0 l0" data-x="165" data-y="322" id="word9">TWO class=" sf19 di psr b0 l0 fm sf24"> class="sid25 sf19 sf1 sf20 di psr b0 l0" data-x="246" data-y="322" id="word10">THREE class=" sf7 di psr b0 l0 fm sf8">


class="sid448 sf448 sf1 sf449 di psr b0 l0" data-x="126" data-y="580"
id="word234">FOUR
class="sid452 sf448 sf452 sf449 di psr b0 l0" data-x="143" data-y="579"
id="word235">FIVE class="sid455 sf448 sf452 sf449 di psr b0 l0" data-x="179" data-y="579"
id="word236">SIX class=" sf448 di psr b0 l0 fm sf456"> class="sid457 sf448 sf1 sf449 di psr b0 l0" data-x="260" data-y="580"
id="word237">SEVEN class="sid459 sf448 sf1 sf449 di psr b0 l0" data-x="280" data-y="580"
id="word238">EIGHT class=" sf7 di psr b0 l0 fm sf8">






这是页面的CSS:

body {
height: 754px;
margin: 0;
width: 558px;
}
span {
border: 0;
margin: 0;
white-space: pre;
position: relative;
}
#container {
height: 754.016px;
left: 0px;
overflow: hidden;
position: absolute;
top: 0px;
width: 558.425px;
}
#parent-p1 {
-moz-transform: scale(0.15613);
-moz-transform-origin: left bottom;
-ms-transform: scale(0.015613);
-ms-transform-origin: left bottom;
-o-transform: scale(0.015613);
-o-transform-origin: left bottom;
-webkit-transform: scale(0.015613);
-webkit-transform-origin: left bottom;
height: 100%;
position: absolute;
white-space: nowrap;
width: 100%;
}
#first_span {
bottom: 27661.888px;
left: 8073.216px;
}
#second_span {
-moz-transform: matrix(0.98,-0,1,0);
-moz-transform-origin: bottom left;
-ms-transform: matrix(0.98,0);
-ms-transform-origin: bottom left;
-webkit-transform: matrix(0.98,0);
-webkit-transform-origin: bottom left;
bottom: 11185.536px;
left: 8073.216px;
transform: matrix(0.98,0);
transform-origin: bottom left;
}
.vab {
vertical-align: bottom;
}
.psa {
position: absolute;
}
.lh1 {
line-height: 1;
}
.psr {
position: relative;
}
.b0 {
bottom: 0;
}
.l0 {
left: 0;
}
.fm {
font-family: monospace;
}
.sf7 {
font-size: 0px;
}
.sf8 {
letter-spacing: 0px;
}
.sf19 {
font-size: 2048px;
}
.sf20 {
color: #D6AB52;
}
.sf22 {
letter-spacing: -807.117px;
}
.sf24 {
letter-spacing: -798.643px;
}
.sf448 {
font-size: 1280.002px;
}
.sf449 {
color: #CA9937;
}
.sf451 {
letter-spacing: -509.595px;
}
.sf454 {
letter-spacing: -548.36px;
}
.sf456 {
letter-spacing: -509.217px;
}
.sf458 {
letter-spacing: -509.749px;
}
.sid23 {
letter-spacing: -7.629px;
}
.sid25 {
letter-spacing: -2.664px;
}
.sid448 {
letter-spacing: -0px;
}
.sid452 {
letter-spacing: 9.408px;
}
.sid455 {
letter-spacing: 0px;
}
.sid457 {
letter-spacing: 0px;
}
.sid459 {
letter-spacing: -4.058px;
}

页面加载方式如下:

public class Mainactivity extends AppCompatactivity {
private WebView webView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
webView = findViewById(R.id.webview);
webView.setWebContentsDebuggingEnabled(true);
webView.loadUrl("file:///android_asset/page.html");
}
}

如果有用,我可以将测试应用程序上传到GitHub。

以下是一些说明问题的情况。

情况1:


  • 选择“一个”,出现菜单。 (好)

情况2:


  • 选择“两个”,出现菜单。

  • 更改选择,以便也包括“ ONE”。菜单消失,而选择保持激活状态。 (不好)

情况3:


  • 选择“两个”,出现菜单。

  • 更改选择,以便也包含“三个”。菜单仍然在那里。 (好)

情况4:


  • 选择“四个”,出现菜单。 (好)

案例5:


  • 选择“五个”,出现菜单。

  • 更改选择,以便也包括“四个”。菜单消失,而选择保持激活状态。 (不好)

案例6:


  • 选择“五个”,出现菜单。

  • 更改选择,以便也包括“六个”(或“七个”或“八个”)。菜单仍然在那里。 (好)

基本上,如果仅选择引起问题的单词,则会显示菜单。仅当创建包含有问题的单词的文本选择时,它才会消失。
在提供示例的示例中,引起问题的单词分别是“一个”和“四个”,但是我不认为它们本身就是原因。
碰巧的是,这些单词中的每个单词都在元素(id="first_span"id="second_span")的开头,这些元素具有可能导致问题的特定CSS规则。
有问题的CSS规则是"left: ...px;",并且在两个元素都禁用了CSS规则(或将其设置为0)后,菜单的行为符合预期。
所以现在我不知道这是元素重叠,嵌套或其他原因引起的问题。

希望我提供了所有必要的信息,如果有人能帮助我弄清楚发生了什么以及为什么发生这种情况,我将不胜感激。



经过一些挖掘,我发现问题不是由WebView引起的,而是由Chrome(在“ 71.0.3578.99”和“ 76.0.3793.0”之间的某些版本中引入)引起的。
实际上,它们的错误跟踪器上的以下链接已经存在一个未解决的问题:
https://bugs.chromium.org/p/chromium/issues/detail?id=962413


推荐阅读
author-avatar
愛情伈語gg
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有