QFunction

From Digipool-Wiki
Revision as of 10:10, 2 February 2018 by WikiSysop (Talk | contribs)

Jump to: navigation, search


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.


Question Box 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);
  noStroke();
  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);
  }

}


Check-Box Function

Nutze diese Funktion um eine Antwort Checkbox anzuzeigen. Der Text kann maximal aus zwei Zeilen bestehen.


// x-Position, y-Position, Checkbox-Number, Text-1-Line, Text-3-Line
function cBox(cX, cY, cN, cT1, cT2){
  if( (mouseIsPressed)&&(mouseUp == 0) ){
    if( (mouseX>cX-150)&&(mouseX<cX+150)&&(mouseY>cY)&&(mouseY<cY+40) ){ 
      mouseUp = 1;
      if(cList[cN] == 0){
        cList[cN] = 1;
      }else{
        cList[cN] = 0;
      }
    }
  }


  if(mouseIsPressed == false){
    mouseUp = 0;
  }

  // Text
  fill(250);
  noStroke();
  rect(cX - 150, cY, 300, 40);
  fill(10);
  textAlign(LEFT);
  textSize(18);

  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[cN] == 1){
    fill(20);
    ellipse(cX - 130, cY+20, 15, 15);
  }
}



Beispiel Code

Hier eine Umfrage mit drei Fragen. MOMENTAN NOCH WORK IN PROGRESS


var frame = 0;
var frameSetup = 0;

var bgc = 50;
var mouseT = 0;
var w = 384;
var h = 640;

var cList = [0,0,0, 0,0,0,0, 0,0,0,0];
var mouseUp = 0;

function setup() {
  pixelDensity(1);

  createCanvas(384, 640);

}

// x-Position, y-Position, Checkbox-Number, Text-1-Line, Text-3-Line
function cBox(cX, cY, cN, cT1, cT2){
  if( (mouseIsPressed)&&(mouseUp == 0) ){
    if( (mouseX>cX-150)&&(mouseX<cX+150)&&(mouseY>cY)&&(mouseY<cY+40) ){ 
      mouseUp = 1;
      if(cList[cN] == 0){
        cList[cN] = 1;
      }else{
        cList[cN] = 0;
      }
    }
  }


  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[cN] == 1){
    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);
  }

}


function draw() {
  if( fullscreen() ){
    if(frame == 0){
      frame = 1;
    }
  }
  background(bgc);

  // Frame Conter Display
  textSize(18);
  text(frame, 10, 20);
  
  fill(200);
  rect(0, height - 150, width, 150);

  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, "Wegen des Wetters mage ich ", "an heute ein tristes Grau.");
    cBox(width/2, 200, 2, "Meine liblingsfabe ist Blau.", "");
    cBox(width/2, 250, 3, "Ich mage heute Rot!", "");
  }

  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, 4, "Ganz ok", "");
    cBox(width/2, 200, 5, "Super!", "");
    cBox(width/2, 250, 6, "So mittel...", "");
    cBox(width/2, 300, 7, "Mir geht es heute nicht", "so gut.");
  }

  if (frame == 3) {
    if (frameSetup == 0) {
      frameSetup = 1;
      bgc = 100;
    }
    qBox(width/2, 30, 3, "Hast Du gut geschlafen?", "", "");
    cBox(width/2, 150, 8, "Ja", "");
    cBox(width/2, 200, 9, "Nein", "");
    cBox(width/2, 250, 10, "Ich konnte nicht schlafen", "");
    cBox(width/2, 300, 11, "Ich habe mich gut ", "ausgeschlafen");
  }

  if (frame == 4) {
    if (frameSetup == 0) {
      frameSetup = 1;
      bgc = 100;
    }
    text("Answer_A_1: " + Answer_A_1, w / 2, h / 2);
  }

  if (frame == 0) {
    background(bgc);
    textAlign(CENTER);
    textSize(40);
    text("Start-Screen", w / 2, h / 2);

  } else {
    nextButton();
  }
}

function nextButton() {
  textAlign(CENTER);
  textSize(40);
  fill(200);
  noStroke();
  // rect(0, height - 150, width, 150);
  fill(0);
  text("NEXT", w / 2, h - 75);
}

function mousePressed() {

  if (millis() > mouseT + 1000) {
    mouseT = millis();
    if ((mouseY >= height - 150) && (frame > 0) && (frame <= 3)) {
      mouseT = millis();
      frame = frame + 1;
      frameSetup = 0;
    }
  
  }
    if (frame == 0) {
      fullscreen(true);
    }
    
}