Difference between revisions of "QFunction"
From Digipool-Wiki
(→Check-Box Function) |
(→Beispiel Code) |
||
(13 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
− | == | + | == Einführung == |
− | Nutze diese Funktion um einen Text / eine Frage anzuzeigen. Der Text kann maximal aus drei Zeilen | + | Kopiere die beiden Funktionen qBox und cBox unten zu deinem Projekt hinzu (copy paste text) und verwend sie dann um Fragen und Antworten zu generieren. |
+ | |||
+ | <br> | ||
+ | |||
+ | == qBox Function == | ||
+ | |||
+ | Nutze diese Funktion um einen Text / eine Frage anzuzeigen. Der Text kann maximal aus drei Zeilen bestehen. | ||
<pre> | <pre> | ||
Line 30: | Line 36: | ||
text(qT2, qX - 145, qY + 42); | text(qT2, qX - 145, qY + 42); | ||
text(qT3, qX - 145, qY + 64); | text(qT3, qX - 145, qY + 64); | ||
+ | } | ||
+ | |||
+ | // Evaluation | ||
+ | qList[qN-1] = 0; | ||
+ | for(var f=0; f<=cList.length; f++){ | ||
+ | if(cList[qN-1][f] != undefined){ | ||
+ | qList[qN-1] = qList[qN-1] + cList[qN-1][f]; | ||
+ | } | ||
} | } | ||
Line 38: | Line 52: | ||
<br> | <br> | ||
− | == | + | == cBox Function == |
− | Nutze diese Funktion um eine Antwort Checkbox anzuzeigen. Der Text kann maximal aus zwei Zeilen bestehen. | + | Nutze diese Funktion um eine Antwort '''Checkbox''' anzuzeigen. Der Text kann maximal aus zwei Zeilen bestehen. |
<pre> | <pre> | ||
− | // x-Position, y-Position, Checkbox-Number, Text-1-Line, Text-3-Line | + | // x-Position, y-Position, Qusetion-Nr, Checkbox-Number, Answer-Value,Text-1-Line, Text-3-Line |
− | function cBox(cX, cY, cN, cT1, cT2){ | + | function cBox(cX, cY, qN, cN, cA, cT1, cT2){ |
if( (mouseIsPressed)&&(mouseUp == 0) ){ | if( (mouseIsPressed)&&(mouseUp == 0) ){ | ||
if( (mouseX>cX-150)&&(mouseX<cX+150)&&(mouseY>cY)&&(mouseY<cY+40) ){ | if( (mouseX>cX-150)&&(mouseX<cX+150)&&(mouseY>cY)&&(mouseY<cY+40) ){ | ||
mouseUp = 1; | mouseUp = 1; | ||
− | if(cList[cN] == | + | if(cList[qN-1][cN-1] == undefined){ |
− | cList[cN] = | + | cList[qN-1][cN-1] = cA; |
}else{ | }else{ | ||
− | cList[cN] = | + | cList[qN-1][cN-1] = undefined; |
} | } | ||
} | } | ||
} | } | ||
+ | if(mouseIsPressed == false){ | ||
+ | mouseUp = 0; | ||
+ | } | ||
+ | |||
+ | // Text | ||
+ | fill(250); | ||
+ | noStroke(); | ||
+ | rect(cX - 150, cY, 300, 40); | ||
+ | fill(10); | ||
+ | textAlign(LEFT); | ||
+ | textSize(18); | ||
+ | textStyle(NORMAL); | ||
+ | |||
+ | if(cT2 == ""){ | ||
+ | text(cT1, cX - 110, cY + 25); | ||
+ | }else{ | ||
+ | text(cT1, cX - 110, cY + 15); | ||
+ | text(cT2, cX - 110, cY + 34); | ||
+ | } | ||
+ | |||
+ | // Checkbox | ||
+ | ellipseMode(CENTER); | ||
+ | stroke(20); | ||
+ | strokeWeight(2); | ||
+ | noFill(); | ||
+ | ellipse(cX - 130, cY+20, 25, 25); | ||
+ | if(cList[qN-1][cN-1] != undefined){ | ||
+ | fill(20); | ||
+ | ellipse(cX - 130, cY+20, 15, 15); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | </pre> | ||
+ | |||
+ | <br> | ||
+ | |||
+ | == qButton Funktion == | ||
+ | |||
+ | <pre> | ||
+ | |||
+ | // Question-Number, Minimum-Selection | ||
+ | function qButton(qN, qType){ | ||
+ | if( (mouseIsPressed)&&(mouseUp == 0) ){ | ||
+ | mouseUp = 1; | ||
+ | if ((mouseY >= height - 150) && (frame > 0) && (frame <= 3)) { | ||
+ | var count = 0; | ||
+ | for(var f=0; f<=cList.length; f++){ | ||
+ | if(cList[qN-1][f] != undefined){ | ||
+ | count = count + 1; | ||
+ | } | ||
+ | } | ||
+ | if(count > qType - 1){ | ||
+ | frame = frame + 1; | ||
+ | frameSetup = 0; | ||
+ | } | ||
+ | } | ||
+ | } | ||
+ | |||
+ | fill(200); | ||
+ | rect(10, height - 150, width-20, 150-10, 20); | ||
+ | |||
+ | textAlign(CENTER); | ||
+ | textSize(40); | ||
+ | fill(200); | ||
+ | noStroke(); | ||
+ | fill(0); | ||
+ | text("NEXT", width / 2, height - 75); | ||
+ | |||
+ | } | ||
+ | |||
+ | </pre> | ||
+ | |||
+ | <br> | ||
+ | |||
+ | == Beispiel Code == | ||
+ | |||
+ | Hier eine Umfrage mit drei Fragen. MOMENTAN NOCH WORK IN PROGRESS | ||
+ | |||
+ | <pre> | ||
+ | |||
+ | var frame = 0; | ||
+ | var frameSetup = 0; | ||
+ | |||
+ | var bgc = 50; // backGroundColor | ||
+ | var mouseT = 0; // mouseTimeer | ||
+ | |||
+ | var cList = [ [undefined,undefined,undefined], [undefined,undefined,undefined,undefined], [undefined,undefined,undefined,undefined] ]; // Checkbox-List - one can pre select here | ||
+ | var qList = [0, 0, 0]; // Guestion-Vale-List | ||
+ | |||
+ | var mouseUp = 0; | ||
+ | |||
+ | function setup() { | ||
+ | pixelDensity(1); | ||
+ | |||
+ | createCanvas(384, 640); | ||
+ | } | ||
+ | |||
+ | function draw() { | ||
+ | if( fullscreen() ){ | ||
+ | if(frame == 0){ | ||
+ | frame = 1; | ||
+ | } | ||
+ | } | ||
+ | background(bgc); | ||
+ | |||
+ | // Frame Conter Display | ||
+ | textSize(18); | ||
+ | text(frame, 10, 20); | ||
+ | textAlign(RIGHT); | ||
+ | text(cList, width - 10, 20); | ||
+ | text(qList, 150, 20); | ||
+ | |||
+ | if (frame == 1) { | ||
+ | if (frameSetup == 0) { | ||
+ | frameSetup = 1; | ||
+ | bgc = 100; | ||
+ | } | ||
+ | qBox(width/2, 30, 1, "Hallo was ist deine ganz", "persoehnliche Lieblingsfarbe", "an diesem Tag?"); | ||
+ | cBox(width/2, 150, 1, 1, -2, "Wegen des Wetters mage ich ", "an heute ein tristes Grau."); | ||
+ | cBox(width/2, 200, 1, 2, 1, "Meine liblingsfabe ist Blau.", ""); | ||
+ | cBox(width/2, 250, 1, 3, 3, "Ich mage heute Rot!", ""); | ||
+ | qButton(1, 1); | ||
+ | } | ||
+ | |||
+ | if (frame == 2) { | ||
+ | if (frameSetup == 0) { | ||
+ | frameSetup = 1; | ||
+ | bgc = 120; | ||
+ | } | ||
+ | qBox(width/2, 30, 2, "Wie wuerdest Du deine Tages-", "Stimmung bezeichnen?", ""); | ||
+ | cBox(width/2, 150, 2, 1, 1, "Ganz ok", ""); | ||
+ | cBox(width/2, 200, 2, 2, 3, "Super!", ""); | ||
+ | cBox(width/2, 250, 2, 3, 0, "So mittel...", ""); | ||
+ | cBox(width/2, 300, 2, 4, -2, "Mir geht es heute nicht", "so gut."); | ||
+ | qButton(2, 1); | ||
+ | } | ||
+ | |||
+ | if (frame == 3) { | ||
+ | if (frameSetup == 0) { | ||
+ | frameSetup = 1; | ||
+ | bgc = 100; | ||
+ | } | ||
+ | qBox(width/2, 30, 3, "Hast Du gut geschlafen?", "", ""); | ||
+ | cBox(width/2, 150, 3, 1, 2, "Ja", ""); | ||
+ | cBox(width/2, 200, 3, 2, -2, "Nein", ""); | ||
+ | cBox(width/2, 250, 3, 3, -3, "Ich konnte nicht schlafen", ""); | ||
+ | cBox(width/2, 300, 3, 4, 3, "Ich habe mich gut ", "ausgeschlafen"); | ||
+ | qButton(3, 1); | ||
+ | } | ||
+ | |||
+ | if (frame == 4) { | ||
+ | if (frameSetup == 0) { | ||
+ | frameSetup = 1; | ||
+ | bgc = 100; | ||
+ | } | ||
+ | textAlign(CENTER); | ||
+ | text("Emotionswert Frabe: " + qList[0], width / 2, 150); | ||
+ | text("Emotionswert Tagesstimmung: " + qList[1], width / 2, 200); | ||
+ | text("Emotionswert Schlaf: " + qList[2], width / 2, 250); | ||
+ | } | ||
+ | |||
+ | if (frame == 0) { | ||
+ | background(bgc); | ||
+ | textAlign(CENTER); | ||
+ | textSize(40); | ||
+ | text("Start-Screen", width / 2, height / 2); | ||
+ | |||
+ | } else { | ||
+ | // qButton(1, 1); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | // x-Position, y-Position, Qusetion-Nr, Checkbox-Number, Answer-Value,Text-1-Line, Text-3-Line | ||
+ | function cBox(cX, cY, qN, cN, cA, cT1, cT2){ | ||
+ | if( (mouseIsPressed)&&(mouseUp == 0) ){ | ||
+ | if( (mouseX>cX-150)&&(mouseX<cX+150)&&(mouseY>cY)&&(mouseY<cY+40) ){ | ||
+ | mouseUp = 1; | ||
+ | if(cList[qN-1][cN-1] == undefined){ | ||
+ | cList[qN-1][cN-1] = cA; | ||
+ | }else{ | ||
+ | cList[qN-1][cN-1] = undefined; | ||
+ | } | ||
+ | } | ||
+ | } | ||
if(mouseIsPressed == false){ | if(mouseIsPressed == false){ | ||
Line 64: | Line 262: | ||
// Text | // Text | ||
fill(250); | fill(250); | ||
+ | noStroke(); | ||
rect(cX - 150, cY, 300, 40); | rect(cX - 150, cY, 300, 40); | ||
fill(10); | fill(10); | ||
textAlign(LEFT); | textAlign(LEFT); | ||
textSize(18); | textSize(18); | ||
+ | textStyle(NORMAL); | ||
if(cT2 == ""){ | if(cT2 == ""){ | ||
Line 82: | Line 282: | ||
noFill(); | noFill(); | ||
ellipse(cX - 130, cY+20, 25, 25); | ellipse(cX - 130, cY+20, 25, 25); | ||
− | if(cList[cN] = | + | if(cList[qN-1][cN-1] != undefined){ |
fill(20); | fill(20); | ||
ellipse(cX - 130, cY+20, 15, 15); | ellipse(cX - 130, cY+20, 15, 15); | ||
} | } | ||
+ | } | ||
+ | |||
+ | // x-Position, y-Position, Guestion-Number, Text-1-Line, Text-3-Line, Text-3-Line | ||
+ | function qBox(qX, qY, qN, qT1, qT2, qT3){ | ||
+ | |||
+ | // Text | ||
+ | fill(250); | ||
+ | rect(qX - 150, qY, 300, 70); | ||
+ | fill(10); | ||
+ | textAlign(LEFT); | ||
+ | textSize(20); | ||
+ | |||
+ | if( (qT2 == "")&&(qT3 == "") ){ | ||
+ | text(qT1, qX - 145, qY + 20); | ||
+ | } | ||
+ | |||
+ | if( (qT2 != "")&&(qT3 == "") ){ | ||
+ | text(qT1, qX - 145, qY + 20); | ||
+ | text(qT2, qX - 145, qY + 42); | ||
+ | } | ||
+ | |||
+ | if( (qT2 != "")&&(qT3 != "") ){ | ||
+ | text(qT1, qX - 145, qY + 20); | ||
+ | text(qT2, qX - 145, qY + 42); | ||
+ | text(qT3, qX - 145, qY + 64); | ||
+ | } | ||
+ | |||
+ | // Evaluation | ||
+ | qList[qN-1] = 0; | ||
+ | for(var f=0; f<=cList.length; f++){ | ||
+ | if(cList[qN-1][f] != undefined){ | ||
+ | qList[qN-1] = qList[qN-1] + cList[qN-1][f]; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | } | ||
+ | |||
+ | // Guestion-Number, Minimum-Selection | ||
+ | function qButton(qN, qType){ | ||
+ | if( (mouseIsPressed)&&(mouseUp == 0) ){ | ||
+ | mouseUp = 1; | ||
+ | if ((mouseY >= height - 150) && (frame > 0) && (frame <= 3)) { | ||
+ | var count = 0; | ||
+ | for(var f=0; f<=cList.length; f++){ | ||
+ | if(cList[qN-1][f] != undefined){ | ||
+ | count = count + 1; | ||
+ | } | ||
+ | } | ||
+ | if(count > qType - 1){ | ||
+ | frame = frame + 1; | ||
+ | frameSetup = 0; | ||
+ | } | ||
+ | } | ||
+ | } | ||
+ | |||
+ | fill(200); | ||
+ | rect(10, height - 150, width-20, 150-10, 20); | ||
+ | |||
+ | textAlign(CENTER); | ||
+ | textSize(40); | ||
+ | fill(200); | ||
+ | noStroke(); | ||
+ | fill(0); | ||
+ | text("NEXT", width / 2, height - 75); | ||
+ | |||
+ | } | ||
+ | |||
+ | function mousePressed() { | ||
+ | |||
+ | if (frame == 0) { | ||
+ | fullscreen(1); | ||
+ | } | ||
+ | |||
} | } | ||
Latest revision as of 11:19, 2 February 2018
Einführung
Kopiere die beiden Funktionen qBox und cBox unten zu deinem Projekt hinzu (copy paste text) und verwend sie dann um Fragen und Antworten zu generieren.
qBox Function
Nutze diese Funktion um einen Text / eine Frage anzuzeigen. Der Text kann maximal aus drei Zeilen bestehen.
// x-Position, y-Position, Guestion-Number, Text-1-Line, Text-3-Line, Text-3-Line function qBox(qX, qY, qN, qT1, qT2, qT3){ // Text fill(250); rect(qX - 150, qY, 300, 70); fill(10); textAlign(LEFT); textSize(20); if( (qT2 == "")&&(qT3 == "") ){ text(qT1, qX - 145, qY + 20); } if( (qT2 != "")&&(qT3 == "") ){ text(qT1, qX - 145, qY + 20); text(qT2, qX - 145, qY + 42); } if( (qT2 != "")&&(qT3 != "") ){ text(qT1, qX - 145, qY + 20); text(qT2, qX - 145, qY + 42); text(qT3, qX - 145, qY + 64); } // Evaluation qList[qN-1] = 0; for(var f=0; f<=cList.length; f++){ if(cList[qN-1][f] != undefined){ qList[qN-1] = qList[qN-1] + cList[qN-1][f]; } } }
cBox Function
Nutze diese Funktion um eine Antwort Checkbox anzuzeigen. Der Text kann maximal aus zwei Zeilen bestehen.
// x-Position, y-Position, Qusetion-Nr, Checkbox-Number, Answer-Value,Text-1-Line, Text-3-Line function cBox(cX, cY, qN, cN, cA, cT1, cT2){ if( (mouseIsPressed)&&(mouseUp == 0) ){ if( (mouseX>cX-150)&&(mouseX<cX+150)&&(mouseY>cY)&&(mouseY<cY+40) ){ mouseUp = 1; if(cList[qN-1][cN-1] == undefined){ cList[qN-1][cN-1] = cA; }else{ cList[qN-1][cN-1] = undefined; } } } if(mouseIsPressed == false){ mouseUp = 0; } // Text fill(250); noStroke(); rect(cX - 150, cY, 300, 40); fill(10); textAlign(LEFT); textSize(18); textStyle(NORMAL); if(cT2 == ""){ text(cT1, cX - 110, cY + 25); }else{ text(cT1, cX - 110, cY + 15); text(cT2, cX - 110, cY + 34); } // Checkbox ellipseMode(CENTER); stroke(20); strokeWeight(2); noFill(); ellipse(cX - 130, cY+20, 25, 25); if(cList[qN-1][cN-1] != undefined){ fill(20); ellipse(cX - 130, cY+20, 15, 15); } }
qButton Funktion
// Question-Number, Minimum-Selection function qButton(qN, qType){ if( (mouseIsPressed)&&(mouseUp == 0) ){ mouseUp = 1; if ((mouseY >= height - 150) && (frame > 0) && (frame <= 3)) { var count = 0; for(var f=0; f<=cList.length; f++){ if(cList[qN-1][f] != undefined){ count = count + 1; } } if(count > qType - 1){ frame = frame + 1; frameSetup = 0; } } } fill(200); rect(10, height - 150, width-20, 150-10, 20); textAlign(CENTER); textSize(40); fill(200); noStroke(); fill(0); text("NEXT", width / 2, height - 75); }
Beispiel Code
Hier eine Umfrage mit drei Fragen. MOMENTAN NOCH WORK IN PROGRESS
var frame = 0; var frameSetup = 0; var bgc = 50; // backGroundColor var mouseT = 0; // mouseTimeer var cList = [ [undefined,undefined,undefined], [undefined,undefined,undefined,undefined], [undefined,undefined,undefined,undefined] ]; // Checkbox-List - one can pre select here var qList = [0, 0, 0]; // Guestion-Vale-List var mouseUp = 0; function setup() { pixelDensity(1); createCanvas(384, 640); } function draw() { if( fullscreen() ){ if(frame == 0){ frame = 1; } } background(bgc); // Frame Conter Display textSize(18); text(frame, 10, 20); textAlign(RIGHT); text(cList, width - 10, 20); text(qList, 150, 20); if (frame == 1) { if (frameSetup == 0) { frameSetup = 1; bgc = 100; } qBox(width/2, 30, 1, "Hallo was ist deine ganz", "persoehnliche Lieblingsfarbe", "an diesem Tag?"); cBox(width/2, 150, 1, 1, -2, "Wegen des Wetters mage ich ", "an heute ein tristes Grau."); cBox(width/2, 200, 1, 2, 1, "Meine liblingsfabe ist Blau.", ""); cBox(width/2, 250, 1, 3, 3, "Ich mage heute Rot!", ""); qButton(1, 1); } if (frame == 2) { if (frameSetup == 0) { frameSetup = 1; bgc = 120; } qBox(width/2, 30, 2, "Wie wuerdest Du deine Tages-", "Stimmung bezeichnen?", ""); cBox(width/2, 150, 2, 1, 1, "Ganz ok", ""); cBox(width/2, 200, 2, 2, 3, "Super!", ""); cBox(width/2, 250, 2, 3, 0, "So mittel...", ""); cBox(width/2, 300, 2, 4, -2, "Mir geht es heute nicht", "so gut."); qButton(2, 1); } if (frame == 3) { if (frameSetup == 0) { frameSetup = 1; bgc = 100; } qBox(width/2, 30, 3, "Hast Du gut geschlafen?", "", ""); cBox(width/2, 150, 3, 1, 2, "Ja", ""); cBox(width/2, 200, 3, 2, -2, "Nein", ""); cBox(width/2, 250, 3, 3, -3, "Ich konnte nicht schlafen", ""); cBox(width/2, 300, 3, 4, 3, "Ich habe mich gut ", "ausgeschlafen"); qButton(3, 1); } if (frame == 4) { if (frameSetup == 0) { frameSetup = 1; bgc = 100; } textAlign(CENTER); text("Emotionswert Frabe: " + qList[0], width / 2, 150); text("Emotionswert Tagesstimmung: " + qList[1], width / 2, 200); text("Emotionswert Schlaf: " + qList[2], width / 2, 250); } if (frame == 0) { background(bgc); textAlign(CENTER); textSize(40); text("Start-Screen", width / 2, height / 2); } else { // qButton(1, 1); } } // x-Position, y-Position, Qusetion-Nr, Checkbox-Number, Answer-Value,Text-1-Line, Text-3-Line function cBox(cX, cY, qN, cN, cA, cT1, cT2){ if( (mouseIsPressed)&&(mouseUp == 0) ){ if( (mouseX>cX-150)&&(mouseX<cX+150)&&(mouseY>cY)&&(mouseY<cY+40) ){ mouseUp = 1; if(cList[qN-1][cN-1] == undefined){ cList[qN-1][cN-1] = cA; }else{ cList[qN-1][cN-1] = undefined; } } } if(mouseIsPressed == false){ mouseUp = 0; } // Text fill(250); noStroke(); rect(cX - 150, cY, 300, 40); fill(10); textAlign(LEFT); textSize(18); textStyle(NORMAL); if(cT2 == ""){ text(cT1, cX - 110, cY + 25); }else{ text(cT1, cX - 110, cY + 15); text(cT2, cX - 110, cY + 34); } // Checkbox ellipseMode(CENTER); stroke(20); strokeWeight(2); noFill(); ellipse(cX - 130, cY+20, 25, 25); if(cList[qN-1][cN-1] != undefined){ fill(20); ellipse(cX - 130, cY+20, 15, 15); } } // x-Position, y-Position, Guestion-Number, Text-1-Line, Text-3-Line, Text-3-Line function qBox(qX, qY, qN, qT1, qT2, qT3){ // Text fill(250); rect(qX - 150, qY, 300, 70); fill(10); textAlign(LEFT); textSize(20); if( (qT2 == "")&&(qT3 == "") ){ text(qT1, qX - 145, qY + 20); } if( (qT2 != "")&&(qT3 == "") ){ text(qT1, qX - 145, qY + 20); text(qT2, qX - 145, qY + 42); } if( (qT2 != "")&&(qT3 != "") ){ text(qT1, qX - 145, qY + 20); text(qT2, qX - 145, qY + 42); text(qT3, qX - 145, qY + 64); } // Evaluation qList[qN-1] = 0; for(var f=0; f<=cList.length; f++){ if(cList[qN-1][f] != undefined){ qList[qN-1] = qList[qN-1] + cList[qN-1][f]; } } } // Guestion-Number, Minimum-Selection function qButton(qN, qType){ if( (mouseIsPressed)&&(mouseUp == 0) ){ mouseUp = 1; if ((mouseY >= height - 150) && (frame > 0) && (frame <= 3)) { var count = 0; for(var f=0; f<=cList.length; f++){ if(cList[qN-1][f] != undefined){ count = count + 1; } } if(count > qType - 1){ frame = frame + 1; frameSetup = 0; } } } fill(200); rect(10, height - 150, width-20, 150-10, 20); textAlign(CENTER); textSize(40); fill(200); noStroke(); fill(0); text("NEXT", width / 2, height - 75); } function mousePressed() { if (frame == 0) { fullscreen(1); } }