Question

我将视图（viewB）放在另一个视图（viewA）的顶部。较低的viewA有两个按钮，btn1可以点击，btn2不能。理想情况下，我想将viewB的点击传播传递给btn2。

我意识到问题与viewB上的zIndex高于viewA有关，这意味着btn2在技术上落后于它，尽管按钮完全可见。

无论如何都要在不重组的情况下传递点击传播？

这是真实代码的一个非常简化的版本，只是简单地将btn2添加到viewB是不可能的，btn2在真实代码中的确切位置是未知的，它是许多其他视图的子项，都有自己的顶部和左翼。

如果不可能，我同样有兴趣听到这个。感谢。

为iPhone / iPad构建 Ti.SDK 2.0.2.v20120417133255 Ti.Studio 2.0.1 xCode 4.3.2

var w



in = Titanium.UI.createWindow({  
    backgroundColor:'#fff'
});

var viewA = Ti.UI.createView({
        backgroundColor: '#DDD',
});

var btn1 = Ti.UI.createButton({
        top: 50,
        title: 'Click 1',
        height: 50,
        width: 150,
        zIndex: 100,
});
btn1.addEventListener('click', function(){
        alert('click 1');
});
viewA.add(btn1);


var btn2 = Ti.UI.createButton({
        top: 150,
        title: 'Click 2',
        height: 50,
        width: 150,
        zIndex: 100,
});
btn2.addEventListener('click', function(){
        alert('click 2');
});
viewA.add(btn2);

var viewB = Ti.UI.createView({
        top: 120,
        zIndex: 20,
        borderWidth: 1,
        borderColor: '#0000FF',
        // backgroundColor: '#0000FF',
        // opacity: 0.5
});

win.add(viewA);
win.add(viewB);


win.open();
var win = Titanium.UI.createWindow({  
    backgroundColor:'#fff'
});

var viewA = Ti.UI.createView({
        backgroundColor: '#DDD',
});

var btn1 = Ti.UI.createButton({
        top: 50,
        title: 'Click 1',
        height: 50,
        width: 150,
        zIndex: 100,
});
btn1.addEventListener('click', function(){
        alert('click 1');
});
viewA.add(btn1);


var btn2 = Ti.UI.createButton({
        top: 150,
        title: 'Click 2',
        height: 50,
        width: 150,
        zIndex: 100,
});
btn2.addEventListener('click', function(){
        alert('click 2');
});
viewA.add(btn2);

var viewB = Ti.UI.createView({
        top: 120,
        zIndex: 20,
        borderWidth: 1,
        borderColor: '#0000FF',
        // backgroundColor: '#0000FF',
        // opacity: 0.5
});

win.add(viewA);
win.add(viewB);


win.open(
);

in = Titanium.UI.createWindow({ backgroundColor:'#fff' }); var viewA = Ti.UI.createView({ backgroundColor: '#DDD', }); var btn1 = Ti.UI.createButton({ top: 50, title: 'Click 1', height: 50, width: 150, zIndex: 100, }); btn1.addEventListener('click', function(){ alert('click 1'); }); viewA.add(btn1); var btn2 = Ti.UI.createButton({ top: 150, title: 'Click 2', height: 50, width: 150, zIndex: 100, }); btn2.addEventListener('click', function(){ alert('click 2'); }); viewA.add(btn2); var viewB = Ti.UI.createView({ top: 120, zIndex: 20, borderWidth: 1, borderColor: '#0000FF', // backgroundColor: '#0000FF', // opacity: 0.5 }); win.add(viewA); win.add(viewB); win.open(); var win = Titanium.UI.createWindow({ backgroundColor:'#fff' }); var viewA = Ti.UI.createView({ backgroundColor: '#DDD', }); var btn1 = Ti.UI.createButton({ top: 50, title: 'Click 1', height: 50, width: 150, zIndex: 100, }); btn1.addEventListener('click', function(){ alert('click 1'); }); viewA.add(btn1); var btn2 = Ti.UI.createButton({ top: 150, title: 'Click 2', height: 50, width: 150, zIndex: 100, }); btn2.addEventListener('click', function(){ alert('click 2'); }); viewA.add(btn2); var viewB = Ti.UI.createView({ top: 120, zIndex: 20, borderWidth: 1, borderColor: '#0000FF', // backgroundColor: '#0000FF', // opacity: 0.5 }); win.add(viewA); win.add(viewB); win.open( );

Answer 1

我确信在我回答这个并在我的应用程序中实施了解决方案后，有人会以更好的方式回来！

我看了几种方法来解决这个问题，找到btn2的确切位置并将其添加到view2，自动高度通常会导致问题，最终会在+ -20px范围内。不够好。

我使用的解决方案是通过从许多其他视图（topView，leftView，rightView和bottomView）创建view2来在view2图层中打一个洞，然后这些视图会相互缓冲，并留下一个洞btn2所在的位置。这种解决方案严重影响了可扩展性。添加btn3，btn4 ......创建view2所需的视图数量越来越多，越来越难以布局。

我知道这个解决方案的缺点，只是建议它作为一个选项，直到找到更好的东西。

钛点击从较高z指数到较低点的传播

1 个答案: