Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Speaker Deck
PRO
Sign in
Sign up for free
Smashing Pixels with Imanee
Erika Heidi
June 24, 2015
Programming
1
440
Smashing Pixels with Imanee
Presenting Imanee, a simple PHP library for image manipulation
Erika Heidi
June 24, 2015
Tweet
Share
More Decks by Erika Heidi
See All by Erika Heidi
Building GitHub Actions in PHP with Minicli
erikaheidi
0
51
10 Code Search Tricks for Open Source
erikaheidi
2
31
The Art of Programming - Laracon Online Winter 22
erikaheidi
0
140
A Arte de Programar
erikaheidi
4
73
The Art of Programming - Codeland 2020
erikaheidi
32
11k
How to Create PHP Development Environments with Docker Compose
erikaheidi
3
140
Automation Made Simple with Ansible
erikaheidi
2
130
DRIVE with Vagrant and Ansible
erikaheidi
4
440
DRIVE with Vagrant and Ansible
erikaheidi
1
510
Other Decks in Programming
See All in Programming
1時間半で克服するJavaScriptの非同期処理/async_javascript_kokufuku
marchin1989
2
620
git on intellij
hiroto_kitamura
0
170
iOS 16からのロック画面Widget争奪戦に備える
tsuzuki817
0
230
Node.jsデザインパターンを読んで
mmmommm
0
2.6k
無限スクロールビューライブラリ 二つの設計思想比較
harumak
0
240
Android スキルセットをフル活用して始めるスマートテレビアプリ開発
satsukies
1
200
Get Ready for Jakarta EE 10
ivargrimstad
0
500
Improving Developer Experience Through Tools and Techniques 2022
krzysztofzablocki
0
530
短納期でローンチした新サービスをJavaで開発した話/launched new service using Java
eichisanden
6
1.9k
A Philosophy of Software Design 後半
yosuke_furukawa
PRO
10
2.8k
Licences open source : entre guerre de clochers et radicalité
pylapp
2
500
Reactive Java Microservices on Kubernetes with Spring and JHipster
deepu105
1
170
Featured
See All Featured
Clear Off the Table
cherdarchuk
79
280k
What’s in a name? Adding method to the madness
productmarketing
11
1.6k
Thoughts on Productivity
jonyablonski
43
2.3k
Intergalactic Javascript Robots from Outer Space
tanoku
261
25k
Web Components: a chance to create the future
zenorocha
303
40k
The World Runs on Bad Software
bkeepers
PRO
57
5.3k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
29
4.3k
GitHub's CSS Performance
jonrohan
1020
420k
Pencils Down: Stop Designing & Start Developing
hursman
112
9.8k
Done Done
chrislema
174
14k
Producing Creativity
orderedlist
PRO
334
37k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
224
49k
Transcript
None
whoami
Image manipulation • Important in any programming language • Essential
operations – Resizing – Creating Thumbnails – Cropping • More fun stuf – Filters and collages – Animated gifs
Image manipulation in PHP • GD • Imagick (Imagemagick) •
Wrappers
Resize Example: GD <?php header("Content-type: image/jpg"); $image = imagecreatefromjpeg('img01.jpg'); $width
= 200; $height = 200; $finalWidth = $width; $finalHeight = ($finalWidth * imagesy($image)) / imagesx($image); if ($finalHeight > $height) { $finalHeight = $height; $finalWidth = ($finalHeight * imagesx($image)) / imagesy($image); } $newimage = imagecreatetruecolor($finalWidth, $finalHeight); imagecopyresampled($newimage, $image, 0, 0, 0, 0, $finalWidth, $finalHeight, imagesx($image), imagesy($image)); echo imagejpeg($newimage);
Resize Example: Imagick <?php header("Content-type: image/jpg"); $image = new Imagick('img01.jpg');
$width = 200; $height = 200; $image->resizeImage($width, $height, IMAGICK::FILTER_LANCZOS, 1, true); echo $image->getImageBlob();
Resize Example: Imanee <?php include __DIR__ . '/vendor/autoload.php'; header("Content-type: image/jpg");
$imanee = new Imanee\Imanee('img01.jpg'); echo $imanee ->resize(300, 300) ->output();
Introducing: Imanee • Image manipulation for fun projects • Requirements
– PHP >= 5.4 – Imagick (php5-imagick) OR – GD (php5-gd)* • Installation – $ composer require imanee/imanee * the GD extension doesn't support animated gifs
Getting Started <?php include __DIR__ . '/vendor/autoload.php'; use Imanee\Imanee; header("Content-type:
image/jpg"); $imanee = new Imanee('img01.jpg'); echo $imanee ->resize(300, 300) ->output();
Basic operations: Thumbnail header("Content-type: image/jpg"); $imanee = new Imanee('img01.jpg'); echo
$imanee->thumbnail(300, 300) ->output();
Basic operations: Thumbnail w/ crop header("Content-type: image/jpg"); $imanee = new
Imanee('img01.jpg'); echo $imanee->thumbnail(300, 300, true) ->output();
Basic operations: Crop header("Content-type: image/jpg"); $imanee = new Imanee('img01.jpg'); echo
$imanee->crop(300, 300, 260, 0) ->output();
WRITING TEXT
Writing Text header("Content-type: image/jpg"); $imanee = new Imanee('img01.jpg'); echo $imanee->placeText('testing
imanee', Imanee::IM_POS_MID_CENTER) ->output();
Writing Text with custom Drawer header("Content-type: image/jpg"); $imanee = new
Imanee('img01.jpg'); $imanee->getDrawer() ->setFont('almonte_wood.ttf') ->setFontColor('yellow') ->setFontSize(100); echo $imanee->placeText('testing imanee!', Imanee::IM_POS_MID_CENTER) ->output();
FILTERS AND COLLAGES
Filters header("Content-type: image/jpg"); $imanee = new Imanee('img01.jpg'); echo $imanee->applyFilter('filter_bw') ->output();
Collages header("Content-type: image/jpg"); $imanee = new Imanee('img01.jpg'); echo $imanee ->placeImage('cat01.png',
Imanee::IM_POS_TOP_LEFT) ->placeImage('cat02.png', Imanee::IM_POS_TOP_RIGHT) ->output();
Animated Gifs header("Content-type: image/gif"); $frames = ['cat01.png', 'cat02.png', 'cat03.png', 'cat04.png'];
$imanee = new Imanee(); $imanee->addFrames($frames); echo $imanee->animate(30); $frames = ['cat01.png', 'cat02.png', 'cat03.png', 'cat04.png']; echo Imanee::arrayAnimate($frames, 30); echo Imanee::globAnimate(__DIR__ . '/*.png', 30);
RESOURCES
Resources • Getting Started – Documentation: http://docs.imanee.io – Simple demos:
http://imanee.io • Built with Imanee – Placephant: http://placephant.com • Try: http://placephant.com/{width}/{height} – Gifagram: [demo]
erika@digitalocean.com @erikaheidi