Skip to content

fix: generated App Store icon has alpha channel #4632

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
May 22, 2019
Merged

fix: generated App Store icon has alpha channel #4632

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions lib/definitions/project.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -212,6 +212,7 @@ interface IAssetItem {
idiom: string;
resizeOperation?: string;
overlayImageScale?: number;
rgba?: boolean;
}

interface IAssetSubGroup {
Expand Down
22 changes: 14 additions & 8 deletions lib/services/assets-generation/assets-generation-service.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -71,24 +71,30 @@ export class AssetsGenerationService implements IAssetsGenerationService {
const outputPath = assetItem.path;
const width = assetItem.width * scale;
const height = assetItem.height * scale;

let image: Jimp;
switch (operation) {
case Operations.OverlayWith:
const overlayImageScale = assetItem.overlayImageScale || AssetConstants.defaultOverlayImageScale;
const imageResize = Math.round(Math.min(width, height) * overlayImageScale);
const image = await this.resize(generationData.imagePath, imageResize, imageResize);
await this.generateImage(generationData.background, width, height, outputPath, image);
image = await this.resize(generationData.imagePath, imageResize, imageResize);
image = this.generateImage(generationData.background, width, height, outputPath, image);
break;
case Operations.Blank:
await this.generateImage(generationData.background, width, height, outputPath);
image = this.generateImage(generationData.background, width, height, outputPath);
break;
case Operations.Resize:
const resizedImage = await this.resize(generationData.imagePath, width, height);
resizedImage.write(outputPath);
image = await this.resize(generationData.imagePath, width, height);
break;
default:
throw new Error(`Invalid image generation operation: ${operation}`);
}

// This code disables the alpha chanel, as some images for the Apple App Store must not have transparency.
if (assetItem.rgba === false) {
image = image.rgba(false);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this whole if looks strange, can you please add a comment what's the idea of it

}

image.write(outputPath);
}
}

Expand All @@ -97,7 +103,7 @@ export class AssetsGenerationService implements IAssetsGenerationService {
return image.scaleToFit(width, height);
}

private generateImage(background: string, width: number, height: number, outputPath: string, overlayImage?: Jimp): void {
private generateImage(background: string, width: number, height: number, outputPath: string, overlayImage?: Jimp): Jimp {
// Typescript declarations for Jimp are not updated to define the constructor with backgroundColor so we workaround it by casting it to <any> for this case only.
const J = <any>Jimp;
const backgroundColor = this.getRgbaNumber(background);
Expand All @@ -109,7 +115,7 @@ export class AssetsGenerationService implements IAssetsGenerationService {
image = image.composite(overlayImage, centeredWidth, centeredHeight);
}

image.write(outputPath);
return image;
}

private getRgbaNumber(colorString: string): number {
Expand Down
1 change: 1 addition & 0 deletions lib/services/project-data-service.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -252,6 +252,7 @@ export class ProjectDataService implements IProjectDataService {
image.resizeOperation = image.resizeOperation || assetItem.resizeOperation;
image.overlayImageScale = image.overlayImageScale || assetItem.overlayImageScale;
image.scale = image.scale || assetItem.scale;
image.rgba = assetItem.rgba;
// break each
return false;
}
Expand Down
3 changes: 2 additions & 1 deletion resources/assets/image-definitions.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -139,7 +139,8 @@
"height": 1024,
"directory": "Assets.xcassets/AppIcon.appiconset",
"filename": "icon-1024.png",
"scale": "1x"
"scale": "1x",
"rgba": false
}
],
"splashBackgrounds": [
Expand Down