📜  p5.TableRow setString() 方法

📅  最后修改于: 2022-05-13 01:58:09.724000             🧑  作者: Mango

p5.TableRow setString() 方法

p5.js 中 p5.TableRow 的setString() 方法用于将给定的 String 值存储到表格行的给定列中。列可以由其列 ID 或列名指定。

句法:

setString( column, value )

参数:此方法接受上面提到的两个参数,如下所述:

  • column:它是一个字符串或数字,表示列的名称或列的 ID。
  • value:它是一个字符串,指定必须存储的值。

下面的示例说明了 p5.js 中的setString() 方法
示例 1:

javascript
function setup() {
  createCanvas(500, 300);
  textSize(18);
  
  text("Click the button to modify the table",
       20, 20);
  
  setBtn =
    createButton("Change Status");
  setBtn.position(30, 60);
  setBtn.mouseClicked(modifyTableData);
  
  // Create the table
  table = new p5.Table();
  
  // Add the columns and rows
  table.addColumn("destination");
  table.addColumn("visited");
  
  // Add information to each column
  // using the setString() method
  let row = table.addRow();
  row.setString("destination",
                "Japan");
  row.setString("visited", "Yes");
  
  row = table.addRow();
  row.setString("destination",
                "Malaysia");
  row.setString("visited", "No");
  
  row = table.addRow();
  row.setString("destination",
                "Switzerland");
  row.setString("visited", "No");
  
  row = table.addRow();
  row.setString("destination",
                "Venice");
  row.setString("visited", "No");
  
  showTable();
}
  
function modifyTableData() {
  // Loop through all the rows
  // in the table
  for (let r = 0; r < table.getRowCount(); r++) {
  
    // Get a row from the table
    let tableRow = table.rows[r];
  
    // Change the string of the visited
    // column of the table row
    if (tableRow.getString("visited") == "No")
      tableRow.setString("visited", "Yes");
  }
  
  showTable();
}
  
function showTable() {
  clear();
  text("The value is modified using the " +
       "setString() method", 20, 20);
  
  // Show all the columns present
  for (let c = 0; c < 2; c++) {
    text(table.columns, 20 + 160 * c, 110);
  }
  
  // Show all the rows currently
  // present in the table
  for (let r = 0; r < table.getRowCount(); r++) {
    for (let c = 0; c < 2; c++) {
      text(table.getString(r, c),
           20 + 160 * c, 140 + 20 * r);
    }
  }
}


javascript
function setup() {
  createCanvas(500, 300);
  textSize(18);
  
  setBtn = createButton("Toggle Strings");
  setBtn.position(30, 40);
  setBtn.mouseClicked(modifyTableData);
  
  // Create the table
  table = new p5.Table();
  
  for (let i = 0; i < 10; i++) {
    table.addColumn();
    table.addRow();
  }
  
  createTable();
}
  
function createTable() {
  
  // Loop through all the rows and columns
  // in the table and set their initial values
  for (let r = 0; r < table.getRowCount(); r++) {
    for (let c = 0; c < table.getColumnCount(); c++) {
  
      // Get a row from the table
      let tableRow = table.rows[r];
  
      if ((r + c) % 3 == 0)
  
        // Set the column to the given value 
        tableRow.setString(c, "*");
      else
  
        // Set the column to the given value 
        tableRow.setString(c, "~");
    }
  }
  
  showTable();
}
  
function modifyTableData() {
  // Loop through all the rows and columns
  // in the table and change their values
  // depending on the previous string
  for (let r = 0; r < table.getRowCount(); r++) {
    for (let c = 0; c < table.getColumnCount(); c++) {
  
      // Get a row from the table
      let tableRow = table.rows[r];
  
      if (tableRow.getString(c) == "~")
  
        // Set the column to the given value 
        tableRow.setString(c, "*");
      else
  
        // Set the column to the given value 
        tableRow.setString(c, "~");
    }
  }
  
  showTable();
}
  
function showTable() {
  clear();
  text("The value is modified using the " +
       "setString() method", 20, 20);
  
  // Show all the rows currently
  // present in the table
  for (let r = 0; r < table.getRowCount(); r++) {
    for (let c = 0; c < table.getColumnCount(); c++) {
      text(table.getString(r, c),
           20 + 40 * c, 80 + 20 * r);
    }
  }
}


输出:

示例 2:

javascript

function setup() {
  createCanvas(500, 300);
  textSize(18);
  
  setBtn = createButton("Toggle Strings");
  setBtn.position(30, 40);
  setBtn.mouseClicked(modifyTableData);
  
  // Create the table
  table = new p5.Table();
  
  for (let i = 0; i < 10; i++) {
    table.addColumn();
    table.addRow();
  }
  
  createTable();
}
  
function createTable() {
  
  // Loop through all the rows and columns
  // in the table and set their initial values
  for (let r = 0; r < table.getRowCount(); r++) {
    for (let c = 0; c < table.getColumnCount(); c++) {
  
      // Get a row from the table
      let tableRow = table.rows[r];
  
      if ((r + c) % 3 == 0)
  
        // Set the column to the given value 
        tableRow.setString(c, "*");
      else
  
        // Set the column to the given value 
        tableRow.setString(c, "~");
    }
  }
  
  showTable();
}
  
function modifyTableData() {
  // Loop through all the rows and columns
  // in the table and change their values
  // depending on the previous string
  for (let r = 0; r < table.getRowCount(); r++) {
    for (let c = 0; c < table.getColumnCount(); c++) {
  
      // Get a row from the table
      let tableRow = table.rows[r];
  
      if (tableRow.getString(c) == "~")
  
        // Set the column to the given value 
        tableRow.setString(c, "*");
      else
  
        // Set the column to the given value 
        tableRow.setString(c, "~");
    }
  }
  
  showTable();
}
  
function showTable() {
  clear();
  text("The value is modified using the " +
       "setString() method", 20, 20);
  
  // Show all the rows currently
  // present in the table
  for (let r = 0; r < table.getRowCount(); r++) {
    for (let c = 0; c < table.getColumnCount(); c++) {
      text(table.getString(r, c),
           20 + 40 * c, 80 + 20 * r);
    }
  }
}

输出:

在线编辑器: https://editor.p5js.org/
环境设置: https://www.geeksforgeeks.org/p5-js-soundfile-object-installation-and-methods/
参考: https://p5js.org/reference/#/p5.TableRow/setString