From n0r1sk software solutions
Revision as of 17:42, 18 March 2012 by Mario (talk | contribs)
Jump to: navigation, search


The n0r1sk battery app is an Android app you could install through Google Play.



Used tools

The icon problem

The battery app displays the current battery load in percentage from 0 to 100. Therefore we need 101 icons to display all levels. Android currently supports four type of screen resolutions (beside tablets) with different sizes. As we are using the status bar of Android it is useful to make to different color sets.

So you need:

  • 101 icons * 4 sizes * 2 colors = 808 icons

It would be possible to make a set of 101 per hand but doing 808 is more than boring. :)

Programming an icon drawing scrip

In this situation we decide to make a tool that should draw the icons with the correct number in it. This tool should save the icons per default as e.g. 24x24 SVG graphics because they could be easily re sized without the loss of details.

Perl and SVG

Perl and SVG are good friends if you only need to write SVG files. SVG files are XML formatted files. What you need is a kind of wrapper around the different types of XML data. PERL::SVG is what we used for and what is easily available on a lot of Linux distributions.

The script

<source lang=perl>

  1. !/usr/bin/perl

use SVG;

for (my $i = 0; $i <= 100; $i++){ #createSvg(BatteryFillColor, BatteryStrokeColor, TextFillColor, TextString, FolderName, FilePrefix) createSvg("#000000", "#000000", "#ffffff", $i, "black", "b"); createSvg("#ffffff", "#ffffff", "#000000", $i, "white", "w"); }

sub createSvg{

my $BatteryFillColor = shift; my $BatteryStrokeColor = shift; my $TextFillColor = shift; my $TextString = shift; my $FolderName = shift; my $FolderDensity = "raw"; my $FilePrefix = shift;

#print $BatteryFillColor; #print $BatteryStrokeColor; #print $TextFillColor; #print $TextString; #print $FolderName; #print $FilePrefix;

if ( !(-d './'.$FolderName)){ qx(mkdir -p ./$FolderName/$FolderDensity); }

my $svg= SVG->new(width=>24,height=>24);

my $b_xv = [3,5,5,22,22,5,5,3]; my $b_yv = [7,7,5,5,20,20,18,18];

$points = $svg->get_path( x => $b_xv, y => $b_yv, -type => 'path', -closed => 'true' );

if ( $TextString <= 9){ $tag = $svg->path( %$points, id => 'battery_1', style => { 'fill' => $BatteryFillColor, 'stroke' => $BatteryStrokeColor, 'stroke-width' => '2.0', 'stroke-miterlimit' => '4', 'stroke-opacity' => '1', 'stroke-dasharray' => 'none' } );

my $t_percent = $svg -> text( id=>'text_1', x=>10, y=>17, 'fill' => $TextFillColor, 'font-family'=>'monospace', 'font-weight'=>'bold' )->cdata($TextString); } elsif( $TextString >= 10 && $TextString <= 99 ) { $tag = $svg->path( %$points, id => 'battery_1', style => { 'fill' => $BatteryFillColor, 'stroke' => $BatteryStrokeColor, 'stroke-width' => '2.0', 'stroke-miterlimit' => '4', 'stroke-opacity' => '1', 'stroke-dasharray' => 'none' } ); my $t_percent = $svg -> text( id=>'text_1', x=>6, y=>17, 'fill'=>$TextFillColor, 'font-family'=>'monospace', 'font-weight'=>'bold' )->cdata($TextString); } elsif( $TextString == 100 ){ $tag = $svg->path(

                       id    => 'battery_1',
                       style => {
                       'fill' => $BatteryFillColor,
                       'stroke' => $BatteryStrokeColor,
                       'stroke-width' => '2.0',
                       'stroke-miterlimit' => '4',
                       'stroke-opacity' => '1',
                       'stroke-dasharray' => 'none',
               my $t_percent = $svg -> text(




my $out = $svg->xmlify; #print $out; open (MYFILE, '>./'.$FolderName.'/'.$FolderDensity.'/ic_stat_notify_'.$FilePrefix.$TextString.'.svg'); print MYFILE $out; close (MYFILE);



The string problem

If you need text (strings) in different languages (and this is a common task) the Android platform supports you by providing a helper calls ( It is very easy to add new translated strings because Android will pick it up automatically. But if you want to format these strings via HTML you have two problems.

The escape char problem

Android needs to have the all HTML tags correctly escaped or they will not get parsed from the SDK. On the following site you could convert HTML to escaped HTML.

Online HTML converter

The Java code to load these strings from resources

<source lang=java> Resources res = getResources(); String text = String.format(res.getString(R.string.>YOURSTRINGRESOURCE<)); CharSequence styledText = Html.fromHtml(text); </source>

After that operation inside the CharSequence is the correct formatted text.

Tested devices

Hardware type Status
LG P990 / Optimus / Speed 2x Working
Motorola DROID / MILESTONE Working