logo标签列表

Chrome Flash播放器在Flash窗口中创建透明矩形

flashgoogle-chromevisual-glitch
8

我在Flash视频播放器中遇到了一个很奇怪、非常难以复现的图形故障，目前只出现在Chrome浏览器中。

screenshot

"进入建筑物"下面的灰色矩形显示了flash播放器所在的html div的背景颜色。 "我们在哪里"链接下面有一个较小的矩形。这些都是精灵（包含几个其他精灵和显示对象），具有脚本悬停动画（它们缓慢地向一个随机点移动，该点在其起点范围内）。这个故障会随着它们一起改变大小，有时会消失。

最奇怪的是，它让整个Flash组件看起来透明。当视频播放器创建时，我运行了以下代码：

        graphics.clear();
        graphics.beginFill(0xff00ff, 1);
        graphics.drawRect(0, 0, _stage.stageWidth, _stage.stageHeight);
        graphics.endFill();

视频播放器的后面应该有一个亮色，如果我不加载视频播放器，我已经确认它在那里。然而，这个亮色没有显示出来，而是包含播放器的背景div透过来了。
这对我来说毫无意义......我不知道如何调试。我只知道故障的出现取决于文本链接在屏幕上悬停的位置。
Flash是以WMODE透明加载的，因为它具有半透明的“翼展”。
编辑：
网址是www.48hourgames.com。一旦您创建一个帐户，您将看到以上截图结束的视频播放器。
确保您的Chrome浏览器是最新版本。从主菜单中选择**关于Google Chrome**，如果需要，它会自动查找并安装最新版本。 - arttronics
1
这并没有解决问题。它在所有使用最新版本Chrome的机器上都会发生。 - joon
我注意到你在stage变量前使用了下划线 _，这看起来有些奇怪。也许应该使用 stage.stageWidth 和 stage.stageHeight 代替？通常，下划线用于指定变量。如果确实需要使用下划线，语法可能应该是 this._stage.stageWidth 和 this._stage.stageHeight。 - arttronics
这个问题在Chromium Issues Archive中。 - trkaplan
1
这不是你提到的那个问题，它与Flash无关。 - joon
显示剩余2条评论
5个回答
5
这是Pepper Flash 播放器的问题。Adobe和Google一直在努力解决这个问题，这也是他们计划在Linux平台上让Flash继续运行的方式。
不幸的是，Pepper Flash非常容易出现故障。今年夏天期间，Pepper Flash 成为Chrome 在所有操作系统上默认的Flash 插件。它有很多问题，没有实际解决方案，除了禁用它（并希望Adobe/Google会解决这些问题）。
禁用Pepper Flash的方法： 1.打开：chrome://plugins 2.点击右上角的详细信息图标 3.找到Flash Player插件部分，您可能已经安装了几个版本的Flash插件。我只是安装了Chrome来验证它是否是问题，结果发现有Pepper Flash以及2个“普通”版本的Flash。 4.禁用路径中包含“PepperFlash”的Flash插件。
1
这非常有帮助。您能否提供任何官方信息或错误报告，以便我可以跟踪它们？ - joon
抱歉我从未寻找过错误报告，但互联网上充斥着仅在Pepper Flash/Chrome中出现的问题报告。其中一些问题无法解决（特别是涉及网络摄像头的问题）。然而，Tiffon在他的答案中发布了一些好的想法作为解决方法，可能会有所帮助。尤其是如果您正在使用非标准的wmode值，这会带来自己的一系列问题。 - Sunil D.
启发性的回答。谢谢。 - net.uk.sweet
4
我能够可靠地重现这个问题。以下是一些想法：
  • 听起来像是wmode transparent可能会经常出现问题。也许你可以使Flash元素宽度为100%，并在左/右边距中进行无缝背景。在Flash中，您可以通过stage.scaleMode = StageScaleMode.NO_SCALE;防止其缩放内容。如果Flash占据整个宽度，则可以摆脱wmode transparent并且可能就可以了。
  • 您是否尝试将覆盖电影的两个按钮的cacheAsBitmap设置为true？
  • 因为伪影只在电影结束时出现，当它是静止帧时，也许当电影达到最终状态时，在电影上设置cacheAsBitmap为true会起作用？
  • 也许在电影达到最终状态时，用一个外观相同的PNG图像替换电影？
  • 如果它们还不是PNG图像，也许将这两个按钮替换为PNG图像？

如果这些都不起作用...那就更加绝望了。

  • 也许将侧边菜单（扩展的Flash元素）从SWF中拆分出来成为自己的SWF，并放在电影SWF上方。这样，电影SWF可以失去wmode transparent，也许侧边菜单不会出现故障。
  • 侧边菜单可以是HTML。
    • 鼠标悬停状态可以是HTML元素。
    • 或者，侧边菜单可以调用Flash元素来切换悬停文本。通过ExternalInterface类注册调用Flash（详见详情）。

由于我没有代码可供测试，这些都有点靠猜测。

我会从与cacheAsBitmap相关的想法开始。然后尝试PNG的想法（按钮，最后一帧）。从那里开始，尝试全宽度版本的Flash元素。如果这些都不起作用，您可能需要考虑新设计。如果这不是一个选项，我会按照上述方法拆分侧边菜单。

一个可能的替代设计是将菜单放置在视频上方：http://imgur.com/fjh3b - tiffon
2
今天我遇到了一个问题，使用最新的Flash Player 11.6和Chrome 27。在某些电脑上可以正常工作，但在其他几台电脑上却不能正常工作，这使得很难追踪问题，因为在我的电脑上没有出现过这种情况。
我认为这是Flash的bug，而不是Chrome的问题，因为当我右键单击 ->放大，右键单击 ->缩小时，肮脏的补丁会消失。
所以我找到了一个快速解决方法。
尝试了cacheAsBitmap方法：不起作用（这个修复方法对于“透明度黑色”问题有效，但对于这个问题无效）。
尝试了两个帧图像方法：也不起作用（不确定原因）。
最后我找到了一个解决方法（已经测试了多次）：
由于肮脏的白色斑点只在动画结束时显示出来，我在舞台上放置了一个透明的形状变形剪辑，并让它永远运行。这样就可以解决问题了。
附言：实际上，我试图将这个作为评论添加，而不是答案，但找不到方法，这很奇怪。
我的Chrome中的SWF设置为wmode=transprent，但是我在透明PNG后面得到了黑色背景。这只发生在我的一个特定项目中。我将PNG设置为电影剪辑，并将cacheAsBitmap设置为true，这样就解决了黑色背景问题。 - Ronnie
0

我也遇到了同样的问题，在我的视频播放器中也是如此。

只有在Chrome Pepper Flash中才会出现问题，而且只有在使用透明Wmode嵌入swf时才会出现问题。

今天我在网上找到了一个解决方法/变通方法/黑科技，可以帮我解决这个问题：

"如果你想用一个简单的黑科技来绕过这个问题，那么你可以画一个透明填充的MovieClip。然后每一帧都切换它的“alpha”属性。因为它的填充是透明的，所以它的“alpha”属性除了强制全屏重新绘制以更新MovieClip的alpha属性之外，不起任何作用。这反过来又修复了由于wmode透明而导致的任何错误渲染。

通过添加moueEnabled = false，您确保该黑科技不会干扰任何现有的鼠标事件"

import flash.display.MovieClip;
import flash.events.Event;

var redrawAll = new MovieClip();
redrawAll.mouseEnabled = false;
redrawAll.graphics.beginFill(0x000000, 0);
redrawAll.graphics.moveTo(0,0);
redrawAll.graphics.lineTo(stage.stageWidth, 0);
redrawAll.graphics.lineTo(stage.stageWidth, stage.stageHeight);
redrawAll.graphics.lineTo(0, stage.stageHeight);
redrawAll.graphics.endFill();
addChild(redrawAll);

addEventListener(Event.ENTER_FRAME, function(e:Event){
    redrawAll.alpha = (redrawAll.alpha == 0)? 1 : 0;                 
});

"

来源：https://code.google.com/p/chromium/issues/detail?id=173089#c12

0
今天我在玩拼图游戏时，在我的Google Chrome 31.0.1650.63上遇到了这个问题。我通常不使用这个浏览器，因为flash应该在每个浏览器中都能正常工作，所以当听到白色矩形覆盖在我的游戏上时，我有点惊讶。将wmode设置为opaque而不是transparent可以解决这个问题。
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接