Skip to content

Commit

Permalink
fix: Only support tinted/dark icons if using Xcode 16+
Browse files Browse the repository at this point in the history
Xcode 15 doesn't understand the appearance variants, and if variants are
specified then it thinks there are 3 images assigned to the same slot
and ends up picking one at random and we don't want that.
  • Loading branch information
dpogue committed Aug 21, 2024
1 parent 28cee54 commit f29f35c
Show file tree
Hide file tree
Showing 2 changed files with 192 additions and 133 deletions.
110 changes: 64 additions & 46 deletions lib/prepare.js
Original file line number Diff line number Diff line change
Expand Up @@ -33,11 +33,21 @@ const projectFile = require('./projectFile');
const Podfile = require('./Podfile').Podfile;
const check_reqs = require('./check_reqs');
const PlatformConfigParser = require('./PlatformConfigParser');
const versions = require('./versions');

// launch storyboard and related constants
const IMAGESET_COMPACT_SIZE_CLASS = 'compact';
const CDV_ANY_SIZE_CLASS = 'any';

const ASSUMED_XCODE_VERSION = '15.0.0';
function checkOrAssumeXcodeVersion () {
if (process.platform === 'darwin') {
return versions.get_apple_xcode_version();
} else {
return Promise.resolve(ASSUMED_XCODE_VERSION);
}
}

module.exports.prepare = function (cordovaProject, options) {
const platformJson = PlatformJson.load(this.locations.root, 'ios');
const munger = new PlatformMunger('ios', this.locations.root, platformJson, new PluginInfoProvider());
Expand All @@ -55,15 +65,11 @@ module.exports.prepare = function (cordovaProject, options) {
return updateWww(cordovaProject, this.locations)
// update project according to config.xml changes.
.then(() => updateProject(this._config, this.locations))
.then(() => {
updateIcons(cordovaProject, this.locations);
updateLaunchStoryboardImages(cordovaProject, this.locations);
updateBackgroundColor(cordovaProject, this.locations);
updateFileResources(cordovaProject, this.locations);
})
.then(() => {
alertDeprecatedPreference(this._config);
})
.then(() => updateIcons(cordovaProject, this.locations))
.then(() => updateLaunchStoryboardImages(cordovaProject, this.locations))
.then(() => updateBackgroundColor(cordovaProject, this.locations))
.then(() => updateFileResources(cordovaProject, this.locations))
.then(() => alertDeprecatedPreference(this._config))
.then(() => {
events.emit('verbose', 'Prepared iOS project successfully');
});
Expand All @@ -83,13 +89,12 @@ module.exports.clean = function (options) {

const projectConfig = new ConfigParser(this.locations.configXml);

return Promise.resolve().then(() => {
cleanWww(projectRoot, this.locations);
cleanIcons(projectRoot, projectConfig, this.locations);
cleanLaunchStoryboardImages(projectRoot, projectConfig, this.locations);
cleanBackgroundColor(projectRoot, projectConfig, this.locations);
cleanFileResources(projectRoot, projectConfig, this.locations);
});
return Promise.resolve()
.then(() => cleanWww(projectRoot, this.locations))
.then(() => cleanIcons(projectRoot, projectConfig, this.locations))
.then(() => cleanLaunchStoryboardImages(projectRoot, projectConfig, this.locations))
.then(() => cleanBackgroundColor(projectRoot, projectConfig, this.locations))
.then(() => cleanFileResources(projectRoot, projectConfig, this.locations));
};

/**
Expand Down Expand Up @@ -362,7 +367,7 @@ function handleBuildSettings (platformConfig, locations, infoPlist) {
return Promise.resolve();
}

function mapIconResources (icons, iconsDir) {
function mapIconResources (icons, iconsDir, xcodeversion) {
// Ref: https://developer.apple.com/design/human-interface-guidelines/app-icons
// These are ordered according to how Xcode puts them in the Contents.json file
const platformIcons = [
Expand Down Expand Up @@ -426,6 +431,9 @@ function mapIconResources (icons, iconsDir) {

const pathMap = {};

// We can only support dark mode and tinted icons with Xcode 16
const isAtLeastXcode16 = versions.compareVersions(xcodeversion, '16.0.0') >= 0;

function getDefaultIconForTarget (target) {
const def = icons.filter(res => !res.width && !res.height && !res.target).pop();

Expand Down Expand Up @@ -475,7 +483,7 @@ function mapIconResources (icons, iconsDir) {
}

// Only iOS has dark/tinted icon variants
if (!item.target || item.target === 'spotlight') {
if (isAtLeastXcode16 && (!item.target || item.target === 'spotlight')) {
if (icon.foreground) {
pathMap[dest.replace('.png', '-dark.png')] = icon.foreground;
}
Expand Down Expand Up @@ -533,48 +541,58 @@ function updateIcons (cordovaProject, locations) {

if (icons.length === 0) {
events.emit('verbose', 'This app does not have icons defined');
return;
return Promise.resolve();
}

const platformProjDir = path.relative(cordovaProject.root, locations.xcodeCordovaProj);
const iconsDir = path.join(platformProjDir, 'Assets.xcassets', 'AppIcon.appiconset');
const resourceMap = mapIconResources(icons, iconsDir);
events.emit('verbose', `Updating icons at ${iconsDir}`);
FileUpdater.updatePaths(
resourceMap, { rootDir: cordovaProject.root }, logFileOp);

// Now we need to update the AppIcon.appiconset/Contents.json file
const contentsJSON = generateAppIconContentsJson(resourceMap);
return checkOrAssumeXcodeVersion()
.then((xcodeversion) => {
const resourceMap = mapIconResources(icons, iconsDir, xcodeversion);
events.emit('verbose', `Updating icons at ${iconsDir}`);
FileUpdater.updatePaths(
resourceMap, { rootDir: cordovaProject.root }, logFileOp);

// Now we need to update the AppIcon.appiconset/Contents.json file
const contentsJSON = generateAppIconContentsJson(resourceMap);

events.emit('verbose', 'Updating App Icon image set contents.json');
fs.writeFileSync(path.join(cordovaProject.root, iconsDir, 'Contents.json'), JSON.stringify(contentsJSON, null, 2));
events.emit('verbose', 'Updating App Icon image set contents.json');
fs.writeFileSync(path.join(cordovaProject.root, iconsDir, 'Contents.json'), JSON.stringify(contentsJSON, null, 2));
});
}

function cleanIcons (projectRoot, projectConfig, locations) {
const icons = projectConfig.getIcons('ios');
if (icons.length > 0) {
const platformProjDir = path.relative(projectRoot, locations.xcodeCordovaProj);
const iconsDir = path.join(platformProjDir, 'Assets.xcassets', 'AppIcon.appiconset');
const resourceMap = mapIconResources(icons, iconsDir);
Object.keys(resourceMap).forEach(targetIconPath => {
resourceMap[targetIconPath] = null;
});
events.emit('verbose', `Cleaning icons at ${iconsDir}`);
if (icons.length === 0) {
return Promise.resolve();
}

// Source paths are removed from the map, so updatePaths() will delete the target files.
FileUpdater.updatePaths(
resourceMap, { rootDir: projectRoot, all: true }, logFileOp);
const platformProjDir = path.relative(projectRoot, locations.xcodeCordovaProj);
const iconsDir = path.join(platformProjDir, 'Assets.xcassets', 'AppIcon.appiconset');

const contentsJSON = generateAppIconContentsJson(resourceMap);
return checkOrAssumeXcodeVersion()
.then((xcodeversion) => {
const resourceMap = mapIconResources(icons, iconsDir, xcodeversion);
Object.keys(resourceMap).forEach(targetIconPath => {
resourceMap[targetIconPath] = null;
});
events.emit('verbose', `Cleaning icons at ${iconsDir}`);

// delete filename from contents.json
contentsJSON.images.forEach(image => {
image.filename = undefined;
});
// Source paths are removed from the map, so updatePaths() will delete the target files.
FileUpdater.updatePaths(
resourceMap, { rootDir: projectRoot, all: true }, logFileOp);

events.emit('verbose', 'Updating App Icon image set contents.json');
fs.writeFileSync(path.join(projectRoot, iconsDir, 'Contents.json'), JSON.stringify(contentsJSON, null, 2));
}
const contentsJSON = generateAppIconContentsJson(resourceMap);

// delete filename from contents.json
contentsJSON.images.forEach(image => {
image.filename = undefined;
});

events.emit('verbose', 'Updating App Icon image set contents.json');
fs.writeFileSync(path.join(projectRoot, iconsDir, 'Contents.json'), JSON.stringify(contentsJSON, null, 2));
});
}

/**
Expand Down
Loading

0 comments on commit f29f35c

Please sign in to comment.