androidphonegap-cli

Add file to /res/values?


Is it possible to specify a file to be added to the Android /res/values folder?

I am trying to add a custom theme to change the appearance of the native input pickers, such as <input type="date">. I found the cordova-custom-config plugin that lets me set the theme in AndroidManifest.xml, but that doesnt do anything for actually adding the file


Solution

  • Figured it out:

    I added a hook to the android platform in config.xml

    <hook type="before_prepare" src="scripts/020_copy_resources.js" />
    

    In the hook, I ran a script based on this answer, saved in <project>/scripts/020_copy_resources.js"

    #!/usr/bin/env node
    
    // Native resources to copy
    var androidNativePath = 'native/android/';
    
    // Android platform resource path
    var androidResPath = 'platforms/android/res/';
    
    // Copy native resources
    var rootdir = process.argv[2];
    
    var fs = require('fs');
    var path = require('path');
    
    function copyFileSync( source, target ) {
    
        var targetFile = target;
    
        //if target is a directory a new file with the same name will be created
        if ( fs.existsSync( target ) ) {
            if ( fs.lstatSync( target ).isDirectory() ) {
                targetFile = path.join( target, path.basename( source ) );
            }
        }
        process.stdout.write('Copying ' + source + ' to ' + targetFile);
        fs.writeFileSync(targetFile, fs.readFileSync(source));
    }
    
    function copyFolderRecursiveSync( source, target ) {
        var files = [];
    
        //check if folder needs to be created or integrated
        //var targetFolder = path.join( target, path.basename( source ) );
        var targetFolder = target;
        if ( !fs.existsSync( targetFolder ) ) {
            fs.mkdirSync( targetFolder );
            process.stdout.write('fs.mkdirSync( ' + targetFolder + ' )');
        }
    
        //copy
        if ( fs.lstatSync( source ).isDirectory() ) {
            files = fs.readdirSync( source );
            files.forEach( function ( file ) {
                var curSource = path.join( source, file );
                if ( fs.lstatSync( curSource ).isDirectory() ) {
                    var newTarget = path.join( targetFolder, path.basename( curSource ) );
                    copyFolderRecursiveSync( curSource, newTarget );
                    process.stdout.write('copyFolderRecursiveSync(' + curSource + ', ' + newTarget + ' )');
                } else {
                    copyFileSync( curSource, targetFolder );
                    process.stdout.write('copyFileSync(' + curSource + ', ' + targetFolder + ' )');
                }
            } );
        }
    }
    
    if (rootdir) {
        copyFolderRecursiveSync(androidNativePath, androidResPath);
        process.stdout.write('Copied android native resources');
    }
    

    This copies any files/folders in <project>/native/android to <project>/platforms/android/res

    I then followed this answer to build the theme for the date picker. For my purposes, I only needed to set the colorAccent and colorBackground in the main theme and the datePickerDialogTheme.