[MOD-2179] Update Ti.Paint Module to work with new 3D-Touch properties
GitHub Issue | n/a |
---|---|
Type | New Feature |
Priority | None |
Status | In Progress |
Resolution | Unresolved |
Affected Version/s | n/a |
Fix Version/s | n/a |
Components | n/a |
Labels | n/a |
Reporter | Angel Petkov |
Assignee | Angel Petkov |
Created | 2015-12-15T19:54:37.000+0000 |
Updated | 2016-08-21T18:19:00.000+0000 |
Description
Updating the Ti.Paint module to work along side the new 3D-Touch properties. Each section of the line's width is now sized properly ,depending on the force value. PR: https://github.com/appcelerator-modules/ti.paint/pull/14
var Paint = require('ti.paint');
var win = Ti.UI.createWindow({ backgroundColor: '#fff' });
var win2 = Ti.UI.createWindow({ backgroundColor: 'white' });
var paintView = Paint.createPaintView({
top :0,
right :0,
bottom :80,
left :0,
strokeColor :'black',
strokeAlpha :255,
eraseMode :false
});
win.add(paintView);
var changeColor = Ti.UI.createButton({
bottom :80,
left :10,
width :Ti.UI.SIZE,
height :Ti.UI.SIZE,
title :'changeColor'
});
changeColor.addEventListener("click",function(e){
var string = "";
var textArea = Ti.UI.createTextArea({
borderWidth : 2,
borderColor : '#bbb',
borderRadius : 5,
color : '#888',
font : {fontSize:20, fontWeight:'bold'},
keyboardType : Ti.UI.KEYBOARD_TYPE_DEFAULT,
returnKeyType : Ti.UI.RETURNKEY_GO,
editable : true
});
win.add(textArea);
textArea.addEventListener("blur",function(e){
string = e.value;
paintView.strokeColor = string;
win.remove(textArea);
});
});
win.add(changeColor);
var clear = Ti.UI.createButton({
bottom:40,
left:140,
width:95,
height:30,
title:'Clear'
});
clear.addEventListener('click', function() {
paintView.clear();
});
win.add(clear);
var buttonStrokeAlpha = Ti.UI.createButton({
bottom :70,
right :10,
width :100,
height :30,
title :'Alpha : 100%'
});
buttonStrokeAlpha.addEventListener('click', function(e) {
paintView.strokeAlpha = 1.5;
});
win.add(buttonStrokeAlpha);
var buttonStrokeColorEraser = Ti.UI.createButton({
bottom :40,
right :10,
width :100,
height :30,
title:'Erase : Off' });
buttonStrokeColorEraser.addEventListener('click', function(e) {
paintView.eraseMode = (paintView.eraseMode) ? false : true;
e.source.title = (paintView.eraseMode) ? 'Erase : On' : 'Erase : Off';
});
var width = Ti.UI.createButton({
bottom :40,
left :10,
width :Ti.UI.SIZE,
height :30,
title :'setwidthModifier'
});
width.addEventListener('click', function() { paintView.widthModifier = 2; });
win.add(width);
var saveBtn = Ti.UI.createButton({
bottom :70,
left :140,
width :95,
height :30,
title :'save'
});
saveBtn.addEventListener('click', function() {
var sigImg = paintView.toImage(null,false);
var filename = ("Test_signature.bmp");
var label = Ti.UI.createLabel({
backgroundImage : sigImg,
title : 'Click me!',
center : 10,
width : 100,
height : 100,
borderColor :"black",
borderRadius :2
});
win2.add(label);
win2.open();
win.close();
});
win.add(saveBtn)
win.add(buttonStrokeColorEraser);
win.open();
No comments