Diferencias

Muestra las diferencias entre dos versiones de la página.

--- wiki:2.-desarrollo-app:2.5.-controles-by-xone:p.-camara:start [2019/09/16 14:02]
ary
+++ — (actual)
@@ Línea 1: / Línea 1: @@
-{{indexmenu_n>1}}
-===== Cámara by XOne =====
-\\
-XOne entre sus bondades, ha implementado un módulo de cámara, brindando excelentes potencialidades para esta función.
-Esta queda embebida en la propia ventana desde la que es invocada .\\
-\\
-Las funciones que brinda este control Cámara se obtienen haciendo
-let control = getControl("MAP_CAMERA");
-donde "MAP_CAMERA" es la propiedad de la cámara.\\
-\\
-__Estas funciones son:__
-  * control.takePicture(params);  para hacer foto
-  * control.record(params);  para grabar vídeo
-  * control.stopRecording();  para detener la grabación
-  * control.setFlashMode(sFlashMode);   para decirle si el flash está activo, desactivado, automático, etc.
-  * control.setCamera("front");   para escoger entre la cámara trasera y la frontal.
-  * control.startPreview(), para iniciar la visualización de la cámara en tiempo real.
-  * control.stopPreview(), para tener la visualización de la cámara en tiempo real.
-  * control.isCameraOpened(), true o false, para saber si la visualización está activada.
-  * control.setAutoFocus, para decir si quieres que se active el auto enfoque o no.
-  * control.isAutoFocus(), true o false, para saber si está activado el auto enfoque.
-  * control.getSupportedAspectRatios(), devuelve un arreglo con las relaciones de aspecto permitidas por la cámara.
-  * control.getSupportedVideoProfiles(), devuelve un arreglo con los perfiles de vídeo permitidos por la cámara.
-  * control.getMaxZoom(), para obtener el mayor valor de zoom permitido.
-  * control.setZoom(nZoom), pone el zoom según el parámetro. (Son números que van desde 1 hasta el mayor valor permitido por la cámara).
-  * control.setOnCodeScanned, es para escanear (En este caso tiene un parámetro que es una función de callback, para lo que se quiera hacer con el código escaneado).
-\\
-Ejemplo:
-\\
-<code javascript>
-<coll name="CustomCamera" title="" notab="true" editmask="0" sql="SELECT * FROM GEN_USUARIOS">
-    <group name="HEADER" id="10" class="groupfixed_header">
-        <frame name="frmtitulo" class="frmsuperior">
-          <prop name="SALIR" type="B" class="btvolversuper" />
-          <prop name="MENU" type="TL" class="tlsuper" title="CAMARA" />
-          <prop name="MAP_COLORACTIVO" type="T" visible="0" />
-        </frame>
-    </group>
-    <group name="FOOTER" id="0" class="groupfixed_footer">
-        <prop name="MAP_GROUP" type="N" visible="0" />
-        <prop name="MAP_TOTAL_PAGES" type="N" visible="0" />
-        <frame name="FLOAT_FOOTER_FRAME" class="frmsuperior">
-          <prop name="MAP_LAST" type="B" img="last.png" title="Anterior" onclick="javascript:prev(self,'ir');" methodx="ExecuteNode(anterior)" forecolor="#FFFFFF" width="45%" height="80%" labelwidth="1" imgsel="last-sel.png" disablevisible="MAP_GROUP=1" />
-          <prop name="MAP_LAST_EMPTY" type="B" bgcolor="#00000000" width="45%" height="80%" labelwidth="1" newline="false" disablevisible="MAP_GROUP&gt;1" />
-          <prop name="MAP_NEXT" type="B" img="next.png" title="Siguiente " onclick="javascript:next(self,'ir');" methodx="ExecuteNode(siguiente)" forecolor="#FFFFFF" width="45%" height="80%" labelwidth="1" newline="false" lmargin="6%" imgsel="next-sel.png" disablevisible="MAP_GROUP=MAP_TOTAL_PAGES" />
-        </frame>
-    </group>
-    <group name="General" id="1">
-        <frame name="group1Frame" class="frmtodo" height="1040p" bgcolor="#FFFFFF" align="top|center">
-            <frame name="frmTop" tmargin="0" width="100%" height="28%" align="center|top" xbgcolor="#FF040E1A">
-                <prop name="MAP_TOGGLE_FLASH_MODE" title="Cambiar Flash"  type="B" visible="1" onclick="javascript:doToggleFlashMode();" class="btnButton" align="center" height="80p" />
-                <prop name="MAP_TOGGLE_CAMERA" title="Cambiar Cámara"  type="B" visible="1" onclick="javascript:doToggleCamera();" lmargin="5%" newline="false" class="btnButton" align="center" height="80p" />
-                <prop name="MAP_TOGGLE_AUTOFOCUS" title="Cambiar Auto Enfoque"  type="B" visible="1" onclick="javascript:doToggleAutoFocus();" class="btnButton" align="center" height="80p" />
-                <prop name="MAP_CAMERA_QUALITY" type="T" visible="1" labelwidth="9" width="700p" height="50p" tmargin="30p" img-height="55p" img-width="60p" linkedto="MAP_CAMERA_QUALITY" linkedfield="DATA" mapcol-values="high,qvga,low,480p,720p,1080p,2160p" title="Calidad de vídeo" showinline="true" text-border="true" />
-            </frame>
-            <prop name="MAP_CAMERA" type="VD" visible="1" width="80%" height="50%" viewmode="camerapreview" Xcode-type="ean13" />
-            <frame name="frmBottom" tmargin="0" width="100%" height="30%" align="center|top" xbgcolor="#FF040E1A">
-                <prop name="MAP_TAKE_PICTURE" title="Hacer Foto" type="B" visible="1"  onclick="javascript:takePicture();" class="btnButton" align="center" height="80p"/>
-                <prop name="MAP_START_RECORDING" title="Grabar Vídeo" type="B" visible="1" newline="false" lmargin="5%" onclick="javascript:record();" class="btnButton" align="center" disablevisible="MAP_RECORDING=1" height="80p" />
-                <prop name="MAP_STOP_RECORDING" title="Detener Vídeo" type="B" visible="1" newline="false" lmargin="5%" onclick="javascript:stopRecording();" class="btnButton" align="center" disablevisible="MAP_RECORDING=0" height="80p" />
-                <prop name="MAP_START_PREVIEW" title="Iniciar" type="B" visible="1" onclick="javascript:startPreview();" class="btnButton" align="center" disablevisible="MAP_RECORDING=1" height="80p" />
-                <prop name="MAP_STOP_PREVIEW" title="Detener" type="B" visible="1" newline="false" lmargin="5%" onclick="javascript:stopPreview();" class="btnButton" align="center" disablevisible="MAP_RECORDING=1" height="80p" />
-            </frame>
-        </frame>
-        <prop name="MAP_RECORDING" type="N" visible="0" />
-    </group>
-    </code>
-<code javascript>
-function takePicture() {
-    let control = getControl("MAP_CAMERA");
-    if (!control) {
-        return;
-    }
-    var params = {
-        filename     : "test.jpg",
-        saveToGallery: true,
-        width        : 360,
-        height       : 360,
-        onFinished   : function(sFileName) {
-            if (!sFileName) {
-                ui.showToast("Error de cámara");
-            } else {
-                ui.showToast("Abriendo nueva foto...");
-                ui.openFile(sFileName);
-            }
-        }
-    };
-    control.takePicture(params);
-}
-function record() {
-    let control = getControl("MAP_CAMERA");
-    if (!control) {
-        return;
-    }
-    var currentObj = self;
-    let params = {
-        quality     : self.MAP_CAMERA_QUALITY,
-        maxDuration : 10000,    // Milisegundos
-        //maxFileSize : 10485760, // Bytes
-        withMicAudio: true,
-        onFinished  : function(sFileName) {
-            self.MAP_RECORDING=0;
-            ui.refresh("MAP_START_RECORDING,MAP_STOP_RECORDING,MAP_START_PREVIEW,MAP_STOP_PREVIEW");
-            if (!sFileName) {
-                ui.showToast("Error de cámara");
-            } else {
-                ui.showToast("Nuevo vídeo...");
-                ui.openFile(sFileName);
-            }
-        }
-    };
-    control.record(params);
-    self.MAP_RECORDING=1;
-    ui.refresh("MAP_START_RECORDING,MAP_STOP_RECORDING,MAP_START_PREVIEW,MAP_STOP_PREVIEW");
-}
-function stopRecording() {
-    let control = getControl("MAP_CAMERA");
-    if (!control) {
-        return;
-    }
-    control.stopRecording();
-}
-function startPreview() {
-    let control = getControl("MAP_CAMERA");
-    if (!control) {
-        return;
-    }
-    control.startPreview();
-}
-function stopPreview() {
-    let control = getControl("MAP_CAMERA");
-    if (!control) {
-        return;
-    }
-    control.stopPreview();
-}
-function isOpened() {
-    let control = getControl("MAP_CAMERA");
-    if (!control) {
-        return;
-    }
-    let bOpened = control.isCameraOpened();
-    ui.showToast("Abierta: " + bOpened);
-}
-function isAutoFocus() {
-    let control = getControl("MAP_CAMERA");
-    if (!control) {
-        return;
-    }
-    let bAutoFocus = control.isAutoFocus();
-    ui.showToast("Autofoco: " + bAutoFocus);
-}
-function getSupportedAspectRatios() {
-    let control = getControl("MAP_CAMERA");
-    if (!control) {
-        return;
-    }
-    let allAspectRatios = control.getSupportedAspectRatios();
-    let sMessage = "Relaciones de aspecto soportadas: ";
-    for (let i = 0;i < allAspectRatios.length;i++) {
-        sMessage = sMessage + "\n" + allAspectRatios[i];
-    }
-    ui.msgBox(sMessage, "Mensaje", 0);
-}
-function doSetOnCodeScanned() {
-    let control = getControl("MAP_CAMERA");
-    if (!control) {
-        return;
-    }
-    control.setOnCodeScanned(function(evento) {
-        let nResult = ui.msgBox("Valor: " + evento.data + "\nTipo: " + evento.type, "¿Código OK?", 4);
-        if (nResult == 6) {
-            return true;
-        } else {
-            return false;
-        }
-    });
-}
-/**
- * Modifica el comportamiento de flash de la cámara.
- *
- * Valores posibles:
- * 1) on: Siempre encendido al tomar una foto
- * 2) off: Siempre apagado al tomar una foto
- * 3) torch: Siempre encendido
- * 4) auto: Encendido o apagado al tomar una foto dependiendo de lo que diga el
- * sensor de luz
- * 5) red_eye: Encendido o apagado al tomar una foto dependiendo de lo que diga
- * el sensor de luz, en un modo especial que reduce los ojos rojos
- */
-function doSetFlashMode(sFlashMode) {
-    let control = getControl("MAP_CAMERA");
-    if (!control) {
-        return;
-    }
-    control.setFlashMode(sFlashMode);
-}
-function doToggleFlashMode() {
-    let control = getControl("MAP_CAMERA");
-    if (!control) {
-        return;
-    }
-    let sFlashMode = control.getFlashMode();
-    if (sFlashMode == "on") {
-        control.setFlashMode("off");
-        self.setFieldPropertyValue("MAP_TOGGLE_FLASH_MODE", "img", "flash-off.png");
-    } else if (sFlashMode == "off") {
-        control.setFlashMode("auto");
-        self.setFieldPropertyValue("MAP_TOGGLE_FLASH_MODE", "img", "flash-auto.png");
-    } else if (sFlashMode == "auto") {
-        control.setFlashMode("torch");
-        self.setFieldPropertyValue("MAP_TOGGLE_FLASH_MODE", "img", "flash-torch.png");
-    } else if (sFlashMode == "torch") {
-        control.setFlashMode("on");
-        self.setFieldPropertyValue("MAP_TOGGLE_FLASH_MODE", "img", "flash-on.png");
-    }
-    ui.refresh("MAP_TOGGLE_FLASH_MODE");
-}
-function doToggleCamera() {
-    let control = getControl("MAP_CAMERA");
-    if (!control) {
-        return;
-    }
-    let sCamera = control.getCamera();
-    if (sCamera == "front") {
-        control.setCamera("back");
-    } else if (sCamera == "back") {
-        control.setCamera("front");
-    }
-}
-function doToggleAutoFocus() {
-    let control = getControl("MAP_CAMERA");
-    if (!control) {
-        return;
-    }
-    control.setAutoFocus(!control.isAutoFocus());
-}
-function getControl(sPropName) {
-    let window = ui.getView(self);
-    if (!window) {
-        return null;
-    }
-    let control = window[sPropName];
-    if (!control) {
-        return null;
-    }
-    return control;
-}
-</code>