- Azure DevOps
When you develop a mobile application you always have different versions and each one has a specific environment. During the entire life of your project you switch between each versions to try new features or to correct some bugs. To do that you often have different versions of your application in the same device and you have a different identifier for each versions. This will end up with this kind of problematics:
As you can see above you can’t easily know on your device which icon correspond to a version of your application. Another solution will be to differenciate the name for each version of your application but if it’s too long it will be cut off on display. So why not just add a banner above of your application icon?
To solve this problem I developed a new Azure DevOps task called
Launch Icon Badge, easy to use in your pipeline and free. This task provide you a way to add the environment version name and the version number directly on your application icon. This work only for png files.
Note that this task will work not only for a mobile application project but also for all projects that have a use of icons whatever the technology you use.
To use it in your
azure-pipelines.yml you just have to call it like this:
- task: LaunchIconBadge@1 inputs: bannerVersionNamePosition: 'bottomRight' bannerVersionNameText: 'Prerelease' bannerVersionNumberPosition: 'top' bannerVersionNumberText: '1.2.3'
By default all the png files in your projects will be edited, here is the result of the example code above:
Below you can find all options for this task:
- task: LaunchIconBadge@1 inputs: sourceFolder: '$(Build.SourcesDirectory)' # Optional. Default is: $(Build.SourcesDirectory) contents: '**/*.png' # Optional. Default is: '**/*.png' bannerVersionNamePosition: 'bottomRight' # Options: topLeft, topRight, bottomRight, bottomLeft. Default is: 'bottomRight' bannerVersionNameText: 'Prerelease' # Optional. Default is: '' bannerVersionNameColor: '#C5000D' # Optional. Default is: '#C5000D' bannerVersionNameTextColor: '#FFFFFF' # Optional. Default is: '#FFFFFF' bannerVersionNumberPosition: 'top' # Optional. top, bottom, center, none. Default is: 'none' bannerVersionNumberText: '1.2.3' # Optional. Default is: '' bannerVersionNumberColor: '#34424F' # Optional. Default is: '#34424F' bannerVersionNumberTextColor: '#FFFFFF' # Optional. Default is: '#FFFFFF'
sourceFolderwill be by default, the build directory of your Azure Pipeline.
contentswhich by default will modify all the png files of your project.
bannerVersionNamePositionwill specify the corner of your choice to draw the banner. Options:
bannerVersionNumberPositionwill specify the position of the version number banner. The banner can be simply hidden. Options:
Here you have some examples of what you can do:
In my previous tutorial I introduced another Azure DevOps task called
ExtractVersionFromTag to get the version of your application from your last Git tag. You can combine these two tasks and automatically define the
bannerVersionNumberText like this:
- task: ExtractVersionFromTag@1 - task: LaunchIconBadge@1 inputs: bannerVersionNamePosition: 'bottomRight' bannerVersionNameText: 'Prerelease' bannerVersionNumberPosition: 'top' bannerVersionNumberText: '$(MAJOR).$(MINOR).$(PATCH)-($(NUMBER_OF_COMMITS))'
You will find examples of use in the Github project repository. Feel free to contribute to this project if you want.