[TIMOB-14927] Android: Dynamically changing the view's size leaves a black shadow
GitHub Issue | n/a |
---|---|
Type | Bug |
Priority | Low |
Status | Open |
Resolution | Unresolved |
Affected Version/s | Release 3.1.2 |
Fix Version/s | n/a |
Components | Android |
Labels | Android, View, touchmove |
Reporter | André Perazzi |
Assignee | Unknown |
Created | 2013-08-20T14:53:01.000+0000 |
Updated | 2018-02-28T20:04:25.000+0000 |
Description
*Problem*
When resizing a view (tested using touchmove event, but may occur when changing the values by any other way), if I reduce the rectangle(View) on Android, it will leave behind a black shadow wherever the rectangle is placed. The black mark disappears when you move the rectangle around the screen, like an eraser.
*Steps to reproduce*
1. Run the code above:
2. With the finger, try to reduce the rectangle by touching on the right/bottom area(of the rectangle) and moving the finger.
3. If you reduce the size, the black shadow will be left behind.
4. Touching on the middle of the rectangle and dragging it over the shadow will erase it.
*Test case*
var win = Ti.UI.createWindow({
exitOnClose : true,
});
var view = Ti.UI.createView({
width : '100%',
backgroundColor : 'white',
height : '100%',
});
win.add(view);
var b1 = Ti.UI.createView({
width : 300,
height : 400,
backgroundColor : 'red',
left : 20,
top : 20,
zindex : 10
});
view.add(b1);
// var olt = Titanium.UI.create2DMatrix();
var curX, curY, count = 0, w, h;
b1.addEventListener('touchstart', function(e) {
curX = e.x;
curY = e.y;
w = b1.width;
h = b1.height;
});
var formatW = 4;
var formatH = 3;
b1.addEventListener('touchmove', function(e) {
if (curX * 100 / w > 80 && curY * 100 / h > 80) {
var d = Math.sqrt(e.x * e.x + e.y * e.y);
var mmD = d + ((d - Math.sqrt(w * w + h * h)) / 3);
var width = Math.sqrt((Math.pow(mmD, 2) * Math.pow(formatW, 2)) / (Math.pow(formatW, 2) + Math.pow(formatH, 2)));
var height = Math.sqrt(Math.pow(mmD, 2) - Math.pow(width, 2));
Ti.API.info('diagonal = ' + mmD + ' wid ' + width);
b1.height = width;
b1.width = height;
Ti.API.info(e);
Ti.API.info(mmD);
} else {
if (count % 3 == 0) {
var deltaX = e.x - curX, deltaY = e.y - curY;
b1.left += deltaX;
b1.top += deltaY;
// olt = olt.translate(deltaX, deltaY);
// b1.animate({
// transform : olt,
// duration : 50
// });
count = 0;
}
count++;
}
});
win.open();
Attachments
File | Date | Size |
---|---|---|
VID_20130820_114606.mp4 | 2013-08-20T14:53:01.000+0000 | 10117418 |
Tested and confirmed with Samsung Galaxy S3 Android 4.0.3 with Ti SDK 3.1.1 GA and 3.1.2 GA. On the latest 3.2 CI, the test case fails to function; there is no black shadow, but re-sizing is broken. It works as expected on Samsung Galaxy S2 Android 2.3.6, so it looks to be OS version-specific.
Just noticed that setting borderWidth:0 (of b1 view) prevent the problem.