App inventor 2 en español
Cómo programar los teléfonos móviles con Android
mediante App inventor 2 - Juan Antonio Villalpando
-- Tutorial de iniciación de App Inventor 2 en español --
Volver al índice del tutorial
____________________________
8N.- FirebaseDB. Realtime. Formulario.
p8N_firebaseDB_GoogleSheets.aia
- Este tutorial es la continuación del anterior 8M_firebaseDB_Googlesheets.htm
- Se trata de crear un Formulario para introducir los datos en la Hoja de Cálculo y enviarla la información a Firebase.
- Seguirmos este vídeo tutorial:
https://www.youtube.com/watch?v=v2X-fArILPA&t=381s
- Se trata de crear dos Hojas, una llamada Form y otra Data.
- En la Hoja Form, creamos el formulario.
- Esta sería la Hoja Form, observamos la creación de varios botones. (mediante: Insertar / Dibujo / Forma)
- Mediante Extensiones / App Script entramos en el Editor de Scripts.
- Creamos un nuevo archivo llamado Formulario.gs con el siguiente contenido.
Formulario.gs |
// Clear cell
function ClearCell() {
var ss = SpreadsheetApp.getActiveSpreadsheet();
var formS = ss.getSheetByName("Form"); // Form Sheet
var rangesToClear = ["B3","B6","B8","B10","D6","D8","D10"];
for (var i=0; i<rangesToClear.length; i++){
formS.getRange(rangesToClear[i]).clearContent();
}
}
// Input Value
function SubmitData(){
var ss = SpreadsheetApp.getActiveSpreadsheet();
var formS = ss.getSheetByName('Form'); // Data entry Sheet
var dataS = ss.getSheetByName("Data"); // Data Sheet
var values =[[formS.getRange("B6").getValue(),
formS.getRange("B8").getValue(),
formS.getRange("B10").getValue(),
formS.getRange("D6").getValue(),
formS.getRange("D8").getValue(),
formS.getRange("D10").getValue()]];
dataS.getRange(dataS.getLastRow()+1, 1, 1, 6).setValues(values);
ClearCell();
}
// Search
var SEARCH_COL_IDX = 0;
function Search(){
var ss = SpreadsheetApp.getActiveSpreadsheet();
var formS = ss.getSheetByName("Form"); // Form Sheet
var str = formS.getRange("B3").getValue();
var values = ss.getSheetByName("Data").getDataRange().getValues();
for (var i=0; i < values.length;i++){
var row = values[i];
if (row[SEARCH_COL_IDX] == str){
formS.getRange("B6").setValue(row[0]);
formS.getRange("B8").setValue(row[1]);
formS.getRange("B10").setValue(row[2]);
formS.getRange("D6").setValue(row[3]);
formS.getRange("D8").setValue(row[4]);
formS.getRange("D10").setValue(row[5]);
}
}
}
// Update
function Update(){
var ss = SpreadsheetApp.getActiveSpreadsheet();
var formS = ss.getSheetByName('Form'); // Form Sheet
var dataS = ss.getSheetByName("Data"); // Data Sheet
var str = formS.getRange("B3").getValue();
var values = ss.getSheetByName("Data").getDataRange().getValues();
for (var i =0; i < values.length;i++){
var row = values[i];
if(row[SEARCH_COL_IDX] == str) {
var INT_R = i+1
var values1 = [[
formS.getRange("B6").getValue(),
formS.getRange("B8").getValue(),
formS.getRange("B10").getValue(),
formS.getRange("D6").getValue(),
formS.getRange("D8").getValue(),
formS.getRange("D10").getValue()]];
dataS.getRange(INT_R, 1, 1, 6).setValues(values1);
SpreadsheetApp.getUi().alert(' "Data Updated " ');
}
}
}
// Delete
function Delete(){
var ss = SpreadsheetApp.getActiveSpreadsheet();
var formS = ss.getSheetByName('Form'); // Form Sheet
var dataS = ss.getSheetByName("Data"); // Data Sheet
var ui = SpreadsheetApp.getUi();
var response = ui.alert('Delete ?', ui.ButtonSet.YES_NO);
// Process the user's response.
if (response == ui.Button.YES) {
var str = formS.getRange("B3").getValue();
var values = ss.getSheetByName("Data").getDataRange().getValues();
for (var i =0; i < values.length;i++){
var row = values[i];
if(row[SEARCH_COL_IDX] == str) {
var INT_R = i+1
dataS.deleteRow[INT_R];
ClearCell();
}
}
}
}
// To Firebase
function ToFirebase() {
var ss = SpreadsheetApp.getActiveSpreadsheet();
var formS = ss.getSheetByName('Form'); // Form Sheet
var values =[[formS.getRange("B6").getValue(),
formS.getRange("B8").getValue(),
formS.getRange("B10").getValue(),
formS.getRange("D6").getValue(),
formS.getRange("D8").getValue(),
formS.getRange("D10").getValue()]];
var firebaseUrl= "https://kio4b-60980.firebaseio.com/";
var base = FirebaseApp.getDatabaseByUrl(firebaseUrl);
base.setData("ToApp", values);
}
|
- Esta es la Hoja correspondiente al Formulario anterior, se llama Data.
- Al ejemplo del autor del vídeo, le he añadido el botón "To Firebase" y el código que puedes observar al final del Formulario.gs.
- Si escribimos información en el Formulario y pulsamos los botones, Guardar, Borrar,... se actualizará en la Hoja Data.
- Si pulsamos el botón "To Firebase", los datos del Formulario se enviarán a Firebase (no se guardarán en Data).
_______________
- Firebase.
- App Inventor
_______________
- Diseño.
FirebaseURL:
https://kio4b-60980.firebaseio.com/
ProjectBucket:
ToApp
_______________
- Bloques.
__________________________________
|