Skip to content

Commit 5fd1162

Browse files
authored
Merge pull request #205 from picqer/background-colors
Add support for background colors
2 parents fb4480b + 110b2ce commit 5fd1162

11 files changed

+176
-13
lines changed

Readme.md

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,8 @@ Each renderer has their own options. Only the barcode is required, the rest is o
6767
A vector based SVG image. Gives the best quality to print.
6868
```php
6969
$renderer = new Picqer\Barcode\Renderers\SvgRenderer();
70-
$renderer->setForegroundColor('red'); // Give a color for the bars, the background is always white
70+
$renderer->setForegroundColor('red'); // Give a color for the bars, default is black
71+
$renderer->setBackgroundColor('blue'); // Give a color for the background, default is transparent
7172
$renderer->setSvgType($renderer::TYPE_SVG_INLINE); // Changes the output to be used inline inside HTML documents, instead of a standalone SVG image (default)
7273
$renderer->setSvgType($renderer::TYPE_SVG_STANDALONE); // If you want to force the default, create a stand alone SVG image
7374

@@ -78,7 +79,8 @@ $renderer->render($barcode, 450.20, 75); // Width and height support floats
7879
All options for PNG and JPG are the same.
7980
```php
8081
$renderer = new Picqer\Barcode\Renderers\PngRenderer();
81-
$renderer->setForegroundColor([255, 0, 0]); // Give a color for the bars, the background is always white. Give it as 3 times 0-255 values for red, green and blue.
82+
$renderer->setForegroundColor([255, 0, 0]); // Give a color for the bars, default is black. Give it as 3 times 0-255 values for red, green and blue.
83+
$renderer->setBackgroundColor([0, 255, 255]); // Give a color for the background, default is transparent (in PNG) or white (in JPG). Give it as 3 times 0-255 values for red, green and blue.
8284
$renderer->useGd(); // If you have Imagick and GD installed, but want to use GD
8385
$renderer->useImagick(); // If you have Imagick and GD installed, but want to use Imagick
8486

@@ -89,7 +91,8 @@ $renderer->render($barcode, 5, 40); // Width factor (how many pixel wide every b
8991
Gives HTML to use inline in a full HTML document.
9092
```php
9193
$renderer = new Picqer\Barcode\Renderers\HtmlRenderer();
92-
$renderer->setForegroundColor('red'); // Give a color for the bars, the background is always white
94+
$renderer->setForegroundColor('red'); // Give a color for the bars, default is black
95+
$renderer->setBackgroundColor('blue'); // Give a color for the background, default is transparent
9396

9497
$renderer->render($barcode, 450.20, 75); // Width and height support floats
9598
````
@@ -98,7 +101,8 @@ $renderer->render($barcode, 450.20, 75); // Width and height support floats
98101
Give HTML here the barcode is using the full width and height, to put inside a container/div that has a fixed size.
99102
```php
100103
$renderer = new Picqer\Barcode\Renderers\DynamicHtmlRenderer();
101-
$renderer->setForegroundColor('red'); // Give a color for the bars, the background is always white
104+
$renderer->setForegroundColor('red'); // Give a color for the bars, default is black
105+
$renderer->setBackgroundColor('blue'); // Give a color for the background, default is transparent
102106

103107
$renderer->render($barcode);
104108
````

generate-verified-files.php

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,8 +14,15 @@
1414
file_put_contents('tests/verified-files/081231723897-ean13.svg', $svgRenderer->render($barcode, $barcode->getWidth() * 2));
1515
file_put_contents('tests/verified-files/081231723897-ean13-fractional-width.svg', $svgRenderer->render($barcode, $barcode->getWidth() * 0.25, 25.75));
1616

17+
$svgRendererRed = new Picqer\Barcode\Renderers\SvgRenderer();
18+
$svgRendererRed->setBackgroundColor('red');
19+
file_put_contents('tests/verified-files/081231723897-ean13-red-background.svg', $svgRendererRed->render($barcode, $barcode->getWidth() * 2));
20+
1721
$barcode = $typeEncoderCode128->getBarcode('081231723897');
1822
file_put_contents('tests/verified-files/081231723897-code128.html', $htmlRenderer->render($barcode, $barcode->getWidth() * 2));
23+
$htmlRendererRed = new Picqer\Barcode\Renderers\HtmlRenderer();
24+
$htmlRendererRed->setBackgroundColor('red');
25+
file_put_contents('tests/verified-files/081231723897-code128-red-background.html', $htmlRendererRed->render($barcode, $barcode->getWidth() * 2));
1926

2027
$barcode = $typeEncoderIMB->getBarcode('12345678903');
2128
file_put_contents('tests/verified-files/12345678903-imb.html', $htmlRenderer->render($barcode, $barcode->getWidth() * 2));

src/Renderers/DynamicHtmlRenderer.php

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,10 +10,11 @@ class DynamicHtmlRenderer
1010
protected const WIDTH_PRECISION = 6;
1111

1212
protected string $foregroundColor = 'black';
13+
protected ?string $backgroundColor = null;
1314

1415
public function render(Barcode $barcode): string
1516
{
16-
$html = '<div style="font-size:0;position:relative;width:100%;height:100%">' . PHP_EOL;
17+
$html = '<div style="font-size:0;position:relative;width:100%;height:100%' . ($this->backgroundColor ? ';background-color:' . $this->backgroundColor : '') . '">' . PHP_EOL;
1718

1819
$positionHorizontal = 0;
1920
/** @var BarcodeBar $bar */
@@ -36,10 +37,17 @@ public function render(Barcode $barcode): string
3637
return $html;
3738
}
3839

40+
// Use HTML color definitions, like 'red' or '#ff0000'
3941
public function setForegroundColor(string $color): self
4042
{
4143
$this->foregroundColor = $color;
44+
return $this;
45+
}
4246

47+
// Use HTML color definitions, like 'red' or '#ff0000'
48+
public function setBackgroundColor(?string $color): self
49+
{
50+
$this->backgroundColor = $color;
4351
return $this;
4452
}
4553
}

src/Renderers/HtmlRenderer.php

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,12 +8,13 @@
88
class HtmlRenderer
99
{
1010
protected string $foregroundColor = 'black';
11+
protected ?string $backgroundColor = null;
1112

1213
public function render(Barcode $barcode, float $width = 200, float $height = 30): string
1314
{
1415
$widthFactor = $width / $barcode->getWidth();
1516

16-
$html = '<div style="font-size:0;position:relative;width:' . $width . 'px;height:' . ($height) . 'px;">' . PHP_EOL;
17+
$html = '<div style="font-size:0;position:relative;width:' . $width . 'px;height:' . ($height) . 'px;' . ($this->backgroundColor ? 'background-color:' . $this->backgroundColor . ';' : '') . '">' . PHP_EOL;
1718

1819
$positionHorizontal = 0;
1920
/** @var BarcodeBar $bar */
@@ -36,10 +37,17 @@ public function render(Barcode $barcode, float $width = 200, float $height = 30)
3637
return $html;
3738
}
3839

40+
// Use HTML color definitions, like 'red' or '#ff0000'
3941
public function setForegroundColor(string $color): self
4042
{
4143
$this->foregroundColor = $color;
42-
44+
return $this;
45+
}
46+
47+
// Use HTML color definitions, like 'red' or '#ff0000'
48+
public function setBackgroundColor(?string $color): self
49+
{
50+
$this->backgroundColor = $color;
4351
return $this;
4452
}
4553
}

src/Renderers/JpgRenderer.php

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,21 @@
33
namespace Picqer\Barcode\Renderers;
44

55
use Imagick;
6+
use ImagickPixel;
67

78
class JpgRenderer extends PngRenderer
89
{
910
protected function createImagickImageObject(int $width, int $height): Imagick
1011
{
1112
$image = new Imagick();
12-
$image->newImage($width, $height, 'none', 'JPG');
13+
if ($this->backgroundColor !== null) {
14+
// Colored background
15+
$backgroundColor = new ImagickPixel('rgb(' . implode(',', $this->backgroundColor) . ')');
16+
} else {
17+
// Use transparent background
18+
$backgroundColor = new ImagickPixel('none');
19+
}
20+
$image->newImage($width, $height, $backgroundColor, 'JPG');
1321

1422
return $image;
1523
}

src/Renderers/PngRenderer.php

Lines changed: 30 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,8 @@
1212
class PngRenderer
1313
{
1414
protected array $foregroundColor = [0, 0, 0];
15+
protected ?array $backgroundColor = null;
16+
1517
protected bool $useImagick;
1618

1719
/**
@@ -52,6 +54,7 @@ public function render(Barcode $barcode, int $widthFactor = 2, int $height = 30)
5254
$width = (int)round($barcode->getWidth() * $widthFactor);
5355

5456
if ($this->useImagick) {
57+
$image = $this->createImagickImageObject($width, $height);
5558
$imagickBarsShape = new ImagickDraw();
5659
$imagickBarsShape->setFillColor(new ImagickPixel('rgb(' . implode(',', $this->foregroundColor) .')'));
5760
} else {
@@ -80,7 +83,6 @@ public function render(Barcode $barcode, int $widthFactor = 2, int $height = 30)
8083
}
8184

8285
if ($this->useImagick) {
83-
$image = $this->createImagickImageObject($width, $height);
8486
$image->drawImage($imagickBarsShape);
8587
return $image->getImageBlob();
8688
} else {
@@ -90,26 +92,49 @@ public function render(Barcode $barcode, int $widthFactor = 2, int $height = 30)
9092
}
9193
}
9294

95+
// Use RGB color definitions, like [0, 0, 0] or [255, 255, 255]
9396
public function setForegroundColor(array $color): self
9497
{
9598
$this->foregroundColor = $color;
96-
99+
return $this;
100+
}
101+
102+
// Use RGB color definitions, like [0, 0, 0] or [255, 255, 255]
103+
// If no color is set, the background will be transparent
104+
public function setBackgroundColor(?array $color): self
105+
{
106+
$this->backgroundColor = $color;
97107
return $this;
98108
}
99109

100110
protected function createGdImageObject(int $width, int $height)
101111
{
102112
$image = \imagecreate($width, $height);
103-
$colorBackground = \imagecolorallocate($image, 255, 255, 255);
104-
\imagecolortransparent($image, $colorBackground);
113+
114+
if ($this->backgroundColor !== null) {
115+
// Colored background
116+
$backgroundColor = \imagecolorallocate($image, $this->backgroundColor[0], $this->backgroundColor[1], $this->backgroundColor[2]);
117+
\imagefill($image, 0, 0, $backgroundColor);
118+
} else {
119+
// Use transparent background
120+
$backgroundColor = \imagecolorallocate($image, 255, 255, 255);
121+
\imagecolortransparent($image, $backgroundColor);
122+
}
105123

106124
return $image;
107125
}
108126

109127
protected function createImagickImageObject(int $width, int $height): Imagick
110128
{
111129
$image = new Imagick();
112-
$image->newImage($width, $height, 'none', 'PNG');
130+
if ($this->backgroundColor !== null) {
131+
// Colored background
132+
$backgroundColor = new ImagickPixel('rgb(' . implode(',', $this->backgroundColor) . ')');
133+
} else {
134+
// Use transparent background
135+
$backgroundColor = new ImagickPixel('none');
136+
}
137+
$image->newImage($width, $height, $backgroundColor, 'PNG');
113138

114139
return $image;
115140
}

src/Renderers/SvgRenderer.php

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@
99
class SvgRenderer
1010
{
1111
protected string $foregroundColor = 'black';
12+
protected ?string $backgroundColor = null;
1213
protected string $svgType = self::TYPE_SVG_STANDALONE;
1314

1415
public const TYPE_SVG_STANDALONE = 'standalone';
@@ -25,6 +26,12 @@ public function render(Barcode $barcode, float $width = 200, float $height = 30)
2526
}
2627
$svg .= '<svg width="' . $width . '" height="' . $height . '" viewBox="0 0 ' . $width . ' ' . $height . '" version="1.1" xmlns="http://www.w3.org/2000/svg">' . PHP_EOL;
2728
$svg .= "\t" . '<desc>' . htmlspecialchars($barcode->getBarcode()) . '</desc>' . PHP_EOL;
29+
30+
// Add background rectangle if backgroundColor is set
31+
if ($this->backgroundColor !== null) {
32+
$svg .= "\t" . '<rect id="background" width="100%" height="100%" fill="' . $this->backgroundColor . '"/>' . PHP_EOL;
33+
}
34+
2835
$svg .= "\t" . '<g id="bars" fill="' . $this->foregroundColor . '" stroke="none">' . PHP_EOL;
2936

3037
// print bars
@@ -55,6 +62,12 @@ public function setForegroundColor(string $color): self
5562
return $this;
5663
}
5764

65+
public function setBackgroundColor(?string $color): self
66+
{
67+
$this->backgroundColor = $color;
68+
return $this;
69+
}
70+
5871
public function setSvgType(string $svgType): self
5972
{
6073
if (! in_array($svgType, [self::TYPE_SVG_INLINE, self::TYPE_SVG_STANDALONE])) {

tests/HtmlRendererTest.php

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,4 +23,15 @@ public function test_html_barcode_generator_can_generate_imb_barcode_to_test_hei
2323

2424
$this->assertStringEqualsFile('tests/verified-files/12345678903-imb.html', $generated);
2525
}
26+
27+
public function test_html_barcode_generator_with_background()
28+
{
29+
$barcode = (new Picqer\Barcode\Types\TypeCode128())->getBarcode('081231723897');
30+
31+
$renderer = new Picqer\Barcode\Renderers\HtmlRenderer();
32+
$renderer->setBackgroundColor('red');
33+
$generated = $renderer->render($barcode, $barcode->getWidth() * 2);
34+
35+
$this->assertStringEqualsFile('tests/verified-files/081231723897-code128-red-background.html', $generated);
36+
}
2637
}

tests/SvgRendererTest.php

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -56,4 +56,15 @@ public function test_svg_renderer_throws_exception_wrong_type()
5656
$renderer = new Picqer\Barcode\Renderers\SvgRenderer();
5757
$renderer->setSvgType('other');
5858
}
59+
60+
public function test_svg_barcode_generator_can_use_background_color()
61+
{
62+
$barcode = (new Picqer\Barcode\Types\TypeEan13())->getBarcode('081231723897');
63+
64+
$renderer = new Picqer\Barcode\Renderers\SvgRenderer();
65+
$renderer->setBackgroundColor('red');
66+
$generated = $renderer->render($barcode, 190);
67+
68+
$this->assertStringEqualsFile('tests/verified-files/081231723897-ean13-red-background.svg', $generated);
69+
}
5970
}
Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
<div style="font-size:0;position:relative;width:202px;height:30px;background-color:red;">
2+
<div style="background-color:black;width:4px;height:30px;position:absolute;left:0px;top:0">&nbsp;</div>
3+
<div style="background-color:black;width:2px;height:30px;position:absolute;left:6px;top:0">&nbsp;</div>
4+
<div style="background-color:black;width:6px;height:30px;position:absolute;left:12px;top:0">&nbsp;</div>
5+
<div style="background-color:black;width:2px;height:30px;position:absolute;left:22px;top:0">&nbsp;</div>
6+
<div style="background-color:black;width:4px;height:30px;position:absolute;left:30px;top:0">&nbsp;</div>
7+
<div style="background-color:black;width:2px;height:30px;position:absolute;left:38px;top:0">&nbsp;</div>
8+
<div style="background-color:black;width:2px;height:30px;position:absolute;left:44px;top:0">&nbsp;</div>
9+
<div style="background-color:black;width:4px;height:30px;position:absolute;left:48px;top:0">&nbsp;</div>
10+
<div style="background-color:black;width:6px;height:30px;position:absolute;left:56px;top:0">&nbsp;</div>
11+
<div style="background-color:black;width:4px;height:30px;position:absolute;left:66px;top:0">&nbsp;</div>
12+
<div style="background-color:black;width:4px;height:30px;position:absolute;left:72px;top:0">&nbsp;</div>
13+
<div style="background-color:black;width:4px;height:30px;position:absolute;left:82px;top:0">&nbsp;</div>
14+
<div style="background-color:black;width:2px;height:30px;position:absolute;left:88px;top:0">&nbsp;</div>
15+
<div style="background-color:black;width:4px;height:30px;position:absolute;left:94px;top:0">&nbsp;</div>
16+
<div style="background-color:black;width:2px;height:30px;position:absolute;left:106px;top:0">&nbsp;</div>
17+
<div style="background-color:black;width:2px;height:30px;position:absolute;left:110px;top:0">&nbsp;</div>
18+
<div style="background-color:black;width:4px;height:30px;position:absolute;left:118px;top:0">&nbsp;</div>
19+
<div style="background-color:black;width:2px;height:30px;position:absolute;left:128px;top:0">&nbsp;</div>
20+
<div style="background-color:black;width:8px;height:30px;position:absolute;left:132px;top:0">&nbsp;</div>
21+
<div style="background-color:black;width:2px;height:30px;position:absolute;left:142px;top:0">&nbsp;</div>
22+
<div style="background-color:black;width:2px;height:30px;position:absolute;left:146px;top:0">&nbsp;</div>
23+
<div style="background-color:black;width:6px;height:30px;position:absolute;left:154px;top:0">&nbsp;</div>
24+
<div style="background-color:black;width:2px;height:30px;position:absolute;left:162px;top:0">&nbsp;</div>
25+
<div style="background-color:black;width:4px;height:30px;position:absolute;left:166px;top:0">&nbsp;</div>
26+
<div style="background-color:black;width:4px;height:30px;position:absolute;left:176px;top:0">&nbsp;</div>
27+
<div style="background-color:black;width:6px;height:30px;position:absolute;left:186px;top:0">&nbsp;</div>
28+
<div style="background-color:black;width:2px;height:30px;position:absolute;left:194px;top:0">&nbsp;</div>
29+
<div style="background-color:black;width:4px;height:30px;position:absolute;left:198px;top:0">&nbsp;</div>
30+
</div>

0 commit comments

Comments
 (0)