移动端addEventListener监听点击事件组件检测点错位

banete

用LBitmap载入图片，LSprite.addChild后，使用addEventListener监听LMouseEvent.MOUSE_DOWN时，电脑上正常，但是手机端的事件触发位置一般处于图片的左上角，下方无反应，如果图片较小时，检测点处于外部，很难触发事件。
并且LBitmap的addEventListener根本无效，使用您的http://lufylegend.com/demo/test/49.html页面，将  button01 = new LButtonSample1("测试按钮1",50);  替换为 button01=new LBitmap( new LBitmapData("#00ffff", 0, 0, 100, 100));后不能监听点击事件

lufy

请看api文档
LBitmap中并没有LMouseEvent.MOUSE_DOWN
http://lufylegend.com/api/zh_CN/out/classes/LBitmap.html

banete

好吧，大神。关于错位的问题，您有什么看法吗？

banete

我用LSprite.addChild添加了多个LBitmap，通过图层叠加把它们组合成了一张图，但是在手机上监听点击事件时，监听事件的触发点都偏左上角，是不是分辨率方面的问题？

lufy

banete 发表于 2014-10-17 18:27
我用LSprite.addChild添加了多个LBitmap，通过图层叠加把它们组合成了一张图，但是在手机上监听点击事件时 ...

能否提供运行连接或者代码？

banete

大神，我觉得可能是由于我页面布局的缘故，一开始我是想在一个页面里面划出一个div来加载canvas来展示动画的，因此把页面划分成了三部分
<div id="header" style="width:250px;height:80px;margin-left:auto;margin-right:auto;margin-top:5%;"></div>
<div id="legend"  style="width:800px;height:450px;margin-left:auto;margin-right:auto;margin-top:5%;"></div>
<div id="footer" style="width:250px;height:80px;margin-left:auto;margin-right:auto;margin-top:5%;" ></div>
<script>
LInit(50,"legend",800,450,main);
var layer,label,button01,button02;
function main(){
        LGlobal.setDebug(true);

        var backLayer = new LSprite();
        backLayer.graphics.drawRect(1,"#000000",[0,0,LGlobal.width,LGlobal.height],true,"#cccccc");
        addChild(backLayer);

        layer = new LSprite();
        layer.y = 100;
        layer.graphics.drawRect(2,"#ff0000",[0,0,500,300],true,"#880088");
        backLayer.addChild(layer);

        button02=new LBitmap( new LBitmapData("#00ffff", 0, 0, 100, 100));
        button02.x = 10;
        button02.y = 10;
        button01 = new LSprite();
        button01.addChild(button02);
        layer.addChild(button01);
        label = new LTextField();
        label.text = "layer01";
        label.size = 20;
        label.x = 400;
        label.y = 10;
        layer.addChild(label);

        mouseevent();
}
function mouseevent(){
        layer.addEventListener(LMouseEvent.MOUSE_DOWN,mousedownlayer);
        layer.addEventListener(LMouseEvent.MOUSE_UP,mouseuplayer);

        button01.addEventListener(LMouseEvent.MOUSE_DOWN,mousedownbutton01);
        button01.addEventListener(LMouseEvent.MOUSE_UP,mouseupbutton01);
}
function mousedownlayer(e){
        trace("layer01 is mousedown");
}
function mouseuplayer(e){
        trace("layer01 is mouseup");
        console.log(button01);
}
function mousedownbutton01(e){
        trace("button01 is mousedown");
}
function mouseupbutton01(e){
        trace("button01 is mouseup");
}
</script>

banete

用的测试机是三星galaxy note
点击button区域不能触发，触发区域在button外的上部
像这种布局在pc端是没有问题的，但在手机上就会错位

lufy

banete 发表于 2014-10-19 19:36
用的测试机是三星galaxy note
点击button区域不能触发，触发区域在button外的上部
像这种布局在pc端是没有 ...

上面这样设置，确实会导致手机上出现问题

既然最终还是由canvas来显示页面的，
那么你说的这个开始的动画，完全可以用引擎来实现啊，不需要自己再做特殊处理了
引擎提供全屏设置，页面上的各种对其方式，以及多种动画效果，所以这些东西最好都由引擎来完成