I have 3 groups each contain a rect and a text. When creating each group I set "name" attribute to "false". Then I add these groups to an array called "groups". The problem is, that I want to get the "name" attribute when I do dragstart on one of these groups. I get the "name" only when I drag these groups for the first time. Meaning I startdrag the first - it works, second - works, third - works, but dragging one of them twice fails with "groups[i].name is not a function". That I dont understand, since it worked the first time.
this is how I created groups:
var group1 = new Konva.Group({
x: 30,
y: 50,
draggable: true,
name: "false",
});
var text1 = new Konva.Text({
fontSize: 26,
fontFamily: 'Calibri',
text: 'Hello',
fill: 'black',
padding: 10,
});
var rect1 = new Konva.Rect({
width: text1.width(),
height: text1.height(),
fill: '#aaf',
});
then I added them to a group like this:
group1.add(rect1).add(text1);
I created an array and pushed these groups in:
var groups = [];
groups.push(group1, group2, group3);
I iterate groups and assign each 'dragstart' event in which I came across my problem when logging
for (let i = 0; i < groups.length; i++) {
groups[i].on('dragstart', () => {
console.log(groups[i].name());
})
Related
I am generating text fields dynamically and I am trying to get the contents of the text fields.
//I declared a list of string and generated it using the length of my product.
late final List<String> recovered;
//the length of the products is 3
recovered = List.generate(products.length, (index) => ""));
TextField(
onSubmitted: (value) {
recovered.insert(index, value);
log("the value is $value");
setState(() {});
},
controller: myControllers[index],
decoration: const InputDecoration(
enabledBorder:OutlineInputBorder(
borderSide: BorderSide(
width: 1,
color: Colors.grey)),
),
),
I inserted 1,2,4 into the textFields generated by my listView Builder and got the following values
[1, 2, 4, , , ] instead of [1, 2, 4].
Calling insert adds them to the list. I believe you want to replace them. For that, instead of
recovered.insert(index, value);
you need to do
recovered[index] = value;
on your Submit you need to check if the value is empty or not then add it to your list:
onSubmitted: (value) {
if(value.isNotEmpty){
recovered.insert(index, value);
log("the value is $value");
setState(() {});
}
},
I'm working on a project where I need to declare customsItem formatted in a particular way.
The format given is:
var customsItem = {
"description":"T-Shirt",
"quantity":20,
"net_weight":"1",
"mass_unit":"lb",
"value_amount":"200",
"value_currency":"USD",
"origin_country":"US",
};
In my project however, I have multiple descriptions, so I need to make customsItem an array containing both.
I have array itemInCart =
[
{
itemDescription: 't-shirt',
qty: 1,
pre_orderQty: 1,
price: 30,
weight: 8
},
{
itemDescription: 'pants',
qty: 0,
pre_orderQty: 1,
price: 40,
weight: 5
}
]
I need to get these items in the correct format and within an array called customsItem. I thought to do this using a for loop with push(). Currently, I'm not getting anything when I try to console.log(customsItem), so I'm not sure if this is the best way to achieve the results that I am trying to get. I would really appreciate any help or advice on how to correctly get the results that I need. Thank you!
const customsItem = [];
for (var item of itemInCart) {
const items = {
"description":item.itemDescription,
"quantity":item.qty + item.pre_orderQty,
"net_weight":item.weight,
"mass_unit":"oz",
"value_amount":item.price,
"value_currency":"USD",
"origin_country":"US",
}
customItem.push(
items
)
}
You are not pushing into the correct array:
const customsItem = [];
for (var item of itemInCart) {
const items = {
"description":item.itemDescription,
"quantity":item.qty + item.pre_orderQty,
"net_weight":item.weight,
"mass_unit":"oz",
"value_amount":item.price,
"value_currency":"USD",
"origin_country":"US",
}
customItem.push( <---- needs to be customsItem.push
items
)
}
Q : i wanted to manage images dynamically using pdfkit in nodejs. and also i want to addPage if images not fitted in current page.
Code :
const doc = new PDFDocument({
size: 'letter'
});
function photographs(doc) {
arr = [1, 2, 3, 4, 5, 6, 7]
doc
.fillColor('#1c5695')
.fontSize(10)
.font('Helvetica-Bold')
.text('PHOTOGRAPHS', 10, doc.y, {
width: 300,
align: 'left'
})
arr.forEach((element, i) => {
doc.image('images/pdflogo.png', {
align: 'center',
fit: [100, 100]
})
});
}
so my question is how to manage x and y position of image , so it'll manage space dynamically.
e.g first 6 img set into 1st row then rest will set on 2nd row and so on..
I have seen animated enemies in simple games that will chase you, attack you, or perform a sort of task.
In phaser 3, how do I give a sprite multiple tasks using tweens?
For now, I have only a tween that performs a really simple task
gameState.enemy.move = this.tweens.add({
targets: gameState.enemy,
x: 600,
ease: 'Linear',
duration: 1800,
repeat: -1,
yoyo: true
});
Also, what exactly is a tween? Can a sprite have multiple tweens? Can a tween help perform multiple tasks?
I found this website but did now understand..
https://rexrainbow.github.io/phaser3-rex-notes/docs/site/tween/
A Tween is just a "function", that changes properties (only numeric) values of an object (or multiple objects), from a start value to an end value, over a specific duration. (the object doesn't even need to be a phaser sprite or image or ..., as shown in the example below)
And Yes, you can change multiple values in one tween (check example below).
Here a very simple example, with a basic Javascript object:
var config = {
type: Phaser.AUTO,
width: 400,
height: 200,
backgroundColor: '#2d2d2d',
parent: 'phaser-example',
scene: {
create
}
};
var game = new Phaser.Game(config);
var simpleObject = {value: -1, value2: -2}
function create ()
{
console.info('Initial value', JSON.stringify(simpleObject))
this.tweens.add({
targets: simpleObject,
value: {from:0, to: 100},
value2: {from: 10, to: 200},
duration: 3000,
delay: 500,
onUpdate: _=> console.info('On Update', JSON.stringify(simpleObject)),
onComplete: _=> console.info('After Tween', JSON.stringify(simpleObject))
});
}
<script src="https://cdn.jsdelivr.net/npm/phaser#3.55.2/dist/phaser.js"></script>
This is my code:
var oTableRes = new sap.ui.table.Table({
// title: "Employee Details",
id: "resultsTable",
visibleRowCount: 10,
selectionMode: sap.ui.table.SelectionMode.Single,
navigationMode: sap.ui.table.NavigationMode.Paginator, //Paginator or Scrollbar
fixedColumnCount: 3, // Freezes the number of columns
enableColumnReordering: true, // Allows you to drag and drop the column and reorder the position of the column
width: "650px", // width of the table
height: "400px",
extension: [
new sap.ui.commons.Button({
text: "",
id: "addExamResult",
press: oController.addExam
}),
new sap.ui.commons.Button({
text: "Delete exam result",
id: "delExamResult",
press: oController.deleteExam
})
],
rowSelectionChange: oController.onRowSelectExam
});
This is my code. This produces two buttons as desired, in the extension area. However, each item added to the extension area goes to a new line. How to make them stay in one row? (I tried creating cells, then matrix layout, creating the row with two cells (one for each button), and adding layout into extension area but I got an error:
Uncaught Error: "Element sap.ui.commons.layout.MatrixLayoutRow#__row0" is not valid for aggregation "extension" of Element sap.ui.table.Table#resultsTable
Any help will be appreciated.
Since the extension section expects a control this should work
extension : [ new sap.ui.layout.HorizontalLayout({
busy : false, // boolean
busyIndicatorDelay : 1000, // int
visible : true, // boolean
allowWrapping : false, // boolean
tooltip : undefined, // sap.ui.core.TooltipBase
content : [ new sap.ui.commons.Button({
text : "Button1",
id : "addExamResult",
}), new sap.ui.commons.Button({
text : "Delete exam result",
id : "delExamResult",
}) ]
// sap.ui.core.Control
}) ]
Does this fit your requirement?
Adding JSBIN