Nagy méretű weblapok fotózása – Webpage Capture

Akinek kellett már dokumentálás vagy UI prototípus egyeztetés céljából weblapról képernyőképet készítenie, az tudja, hogy a feladat nem minden esetben egyszerű. Akkor nincs gond, ha az oldal kifér a képernyőre, de mi van akkor, ha függőlegesen csak három képernyőnyi scrollozás után lehet az oldal aljára érni? Ebben az esetben marad Nikhil Web Development Helpere vagy a print screenek egymás alá ragasztgatása. Mivel az előbbi elkezdett nem működni nálam, kénytelen voltam írni egy célalkalmazást.

Mivel évente kb. egy vastag kliens alkalmazást írok, úgy látszik ez lesz az idei termés, íme a Webpage Capture:

Webpage Capture

És íme a kimenet, egy fotó a Weblaborról 976 x 3565 pixel méretben:

WebpageCapture: Weblabor

Bár az alkalmazás egészen pofásra sikerült (a saját gyermek ugye🙂 ) és használhatóan is működik, azért van egy apró szépséghibája: mivel nem akartam P/Invoke-t használni, ezért inkább egy nem támogatott megoldást választottam a képernyőképek elkészítésére. A WebBrowser kontrollnak van egy DrawToBitmap metódusa, amely bár kiválóan működik, “supports the .NET Framework infrastructure and is not intended to be used directly from your code”.

A másik lényeges pont, hogy a DrawToBitmap azt rajzolja a bitmapbe, amit a WebBrowser kontroll éppen mutat, ezért a rajzolás előtt át kell méretezni a kontrollt akkorára, amekkora a weboldal. A dokumentum mérete pedig a WebBrowser.Document.Body.ScrollRectangle tulajdonságból derül ki.

Lényegében ennyi kódolás kellett a fenti alkalmazás elkészítéséhez, a többi sallang, ami viszont igazán kényelmesen használhatóvá tette, szinte összekattintgatható: a böngészőben korábban használt URL-ek felkínálása és automatikus kiegészítése, az utoljára használt mappa, URL és checkbox állapot felhasználónkénti elmentése, a mentési útvonal tallózása, a beágyazott erőforrásként tárolt ikonokkal ellátott gombok, progress bar és link a status barra, na és persze mindez egy kattintással admin jogok nélkül a webről települve és önmagát frissítve ClickOnce segítségével. Azt kell hogy mondjam, igazán jó dolgok vannak a Windows Formsban, amiket én fontosabbnak ítélek, mint a 3D-ben forgazható grafikonokat🙂

Aki szeretné kipróbálni az alkalmazást, ide kattintson:

http://www.msdnkk.hu/Storage/balassy/Enclosures/WebpageCapture

Known issue: bizonyos weblapok (pl. index) esetén többször készül el a kimeneti fájl, mert valamilyen okból az oldal letöltését jelző esemény többször sül el. Mindez persze csak akkor idegesítő, ha a View after capture be van kapcsolva. Megoldás: kapcsoljuk ki🙂

 

2 thoughts on “Nagy méretű weblapok fotózása – Webpage Capture

Vélemény, hozzászólás?

Adatok megadása vagy bejelentkezés valamelyik ikonnal:

WordPress.com Logo

Hozzászólhat a WordPress.com felhasználói fiók használatával. Kilépés / Módosítás )

Twitter kép

Hozzászólhat a Twitter felhasználói fiók használatával. Kilépés / Módosítás )

Facebook kép

Hozzászólhat a Facebook felhasználói fiók használatával. Kilépés / Módosítás )

Google+ kép

Hozzászólhat a Google+ felhasználói fiók használatával. Kilépés / Módosítás )

Kapcsolódás: %s