Audio objects

ArcGIS AppStudio provides a high-level recording component for handling audio, including functions to control and monitor the recording. This can be used to create powerful tools for collecting data in qualities and sizes configurable for your app's needs.

Recorder controls

The AudioRecorder component provides functions to control the audio recording process. The record, pause, and stop methods provide base-level tools that can be supplemented further by other methods.

This code sample provides a general control panel to manage the process of audio recording:

Use dark colors for code blocksCopy
//Creates both audio recorder and audio playback objects
AudioRecorder {
    id: audioRecorder

    onStatusChanged: {
        console.log("audioRecorder status:", status);
    }

    onErrorChanged: {
        console.log("audioRecorder error:", error, "errorString:", errorString);
    }
}

Audio {
    id: audio

    onStatusChanged: {
        console.log("audio status:", status);
    }

    onError: {
        console.log("audio error:", error, "errorString:", errorString);
    }
}

Flow {

    //Button to start recording, disabled if recording is unavailable or already underway
    Button {
        text: "Record"
        enabled: audioRecorder.available

        onClicked: audioRecorder.record();
    }

    //Stops recording currently underway or paused, disabled if neither is true
    Button {
        text: "Stop"
        enabled: audioRecorder.state == AudioRecorder.RecordingState || audioRecorder.state == AudioRecorder.PausedState

        onClicked: audioRecorder.stop();
    }

    //Opens file dialog to select where to create the audio file
    Button {
        text: "Location"
        enabled: audioRecorder.state == AudioRecorder.StoppedState

        onClicked: outputDialog.open();
    }

    FileDialog {
        id: outputDialog

        title: "Output Location"
        selectExisting: false
        selectMultiple: false
        nameFilters: [ "All files (*)" ]
        folder: AppFramework.standardPaths.standardLocations(StandardPaths.MusicLocation)[0]

        onAccepted: {
            audioRecorder.outputLocation = fileUrl;
        }
    }

    //Plays back recorded audio file
    Button {
        text: "Play"
        enabled: audioRecorder.state == AudioRecorder.StoppedState && audioRecorder.actualLocation > "" && audioRecorder.duration > 0

        onClicked: {
            audio.source = audioRecorder.actualLocation;
            audio.play();
        }
    }
}

Recording properties

While the AudioRecorder methods provide the tools to record audio, the component provides a number of properties that inform the process, allowing for a more informed experience that you can configure for your needs. The following code samples provide some means to control potentially useful properties.

The input property describes the device that will be capturing audio. This will start as the system default but can be changed to any available input device.

Use dark colors for code blocksCopy
        RowLayout {
            Layout.fillWidth: true

            Text {
                text: "Default input"
                color: "black"
            }

            Text {
                text: audioRecorder.defaultInput
                color: "blue"
                font.bold: true
                wrapMode: Text.WrapAtWordBoundaryOrAnywhere
            }
        }

        RowLayout {
            Layout.fillWidth: true
            Text {
                text: "Input device"
                color: "black"
            }

            Text {
                text: audioRecorder.input
                color: "blue"
                font.bold: true
                wrapMode: Text.WrapAtWordBoundaryOrAnywhere
            }

            ComboBox {
                model: audioRecorder.availableInputs
                textRole: "description"
                Layout.fillWidth: true
                onActivated: {
                    audioRecorder.input = model[index].name;
                }
            }
        }

The containerFormat property describes the file type that the AudioRecorder component will output into.

Use dark colors for code blocksCopy
        RowLayout {
            Layout.fillWidth: true
            Text {
                text: "Container format"
                color: "black"
            }

            Text {
                text: audioRecorder.containerFormat
                color: "blue"
                font.bold: true
                wrapMode: Text.WrapAtWordBoundaryOrAnywhere
            }

            ComboBox {
                model: audioRecorder.availableContainerFormats
                textRole: "description"
                Layout.fillWidth: true
                onActivated: {
                    audioRecorder.containerFormat = model[index].name;
                }
            }
        }

Not to be confused with the containerFormat property, the codec property defines the method the audio recording will be encoded and processed into. Codec, rather than filetype, usually controls how large or compressed a file will be. The codec property can be manipulated in the same way as the containerFormat property above.

The volume at which the audio will be recorded is controlled by the volume property in the form of an integer. The volume at which your device would normally record is defined as 1, so, for example, 0.5 will record at half volume. This code sample controls this property with a slider from 0 to 1, incrementing at every tenth.

Use dark colors for code blocksCopy
        RowLayout {
            Layout.fillWidth: true
            Text {
                text: "Volume"
                color: "black"
            }

            Text {
                text: audioRecorder.volume
                color: "blue"
                font.bold: true
                wrapMode: Text.WrapAtWordBoundaryOrAnywhere
            }

            Slider {
                Layout.fillWidth: true

                minimumValue: 0
                maximumValue: 1
                stepSize: 0.1
                value: audioRecorder.volume

                onValueChanged: {
                    audioRecorder.volume = value;
                }
            }
        }

The outputLocation property, set through the file dialog in the control panel code sample at the top of this page, defines the intended location to save the file. Once recording has started, the actualLocation property is set based on this, describing the path of the file that was actually made. In most cases, these two properties will be the same, but there are exceptions.