Undolog.com

CaptureView permette di clonare, sotto forma di immagine, una qualsiasi vista (UIView o UIImageView) in modo rapido. Quello che si ottiene è un oggetto CaptureView che può essere utilizzato come una normale UIView (quindi visualizzato). Catturare lo “schermo”, o una sua porzione, può essere utile in molti casi. Una volta ottenuta la nuova “immagine”, questa potrà essere manipolata senza preoccparsi del suo contenuto.
Spesso si hanno più view innestate ed effetuare effetti o trasformazioni sulla view madre che le contiene tutte non è sempre una soluzione ottimale.

Continua...

In questo tutorial voglio mostrarvi alcune effetti particolari che si possono applicare ad un semplice oggetto rettangolare giocando con le ombre. Ovviamente non mi riferisco all’effetto shadow applicabile su un layer, ma a vere e proprie ombre realizzate manualmente. Prima di tutto disegniamo su un layer un rettangolo tipo questo:

Continua...

A causa dei diversi rendering tra i vari browser, che vedono sicuramente Microsoft Internet Explorer in testa, bisogna sempre ricorrere ad artifizi particolari per applicare effetti che, ormai, dovrebbero rappresentare uno standard. I pluri-discussi bordi arrotondati sono un classico esempio del “disastro” prodotto dalla completa incapacità di realizzare uno standard serio sul rendering delle pagine HTML/CSS. Esistono in rete numerosissime soluzioni che permettono di ottenere “effetti” (effetti che esonerano dall’HTML attuale come bordi arrotondati, effetti ombra, riflessioni, etc…) con patch sui fogli di stili, particolari trucchi con l’uso di div innestati, librerie Javascript, uso delle canvas, etc…
A titolo puramente didattico vorrei illustrare un’ulteriore tecnica (cross-browser) per applicare dei bordi arrotondati a delle immagini:

Demo e sorgenti

• Progetto completo su Google Code
• demo
• jquery.roundborders.js
• immagine in formato Photoshop
• immagine in formato PNG

Continua...

Da Apple al Web 2.0 le immagini “riflesse” hanno inondato Intrenet. Spesso abusate sono tuttavia sempre di grande effetto. Saperle realizzare bene non è impresa complicata e, con un pizzoco di fantasia, si possono rendere meno “ovvie” e “scontate”… se proprio non ne potete fare a meno.

Le basi del Reflex

Prima di tutto vediamo come impostare una riflessione base. La tecnica per impostare una riflessione base, almeno quella che preferisco e che uso continuamente, è di semplice e rapida implementazione. Questo metodo permette la massima libertà di modifiche successive e mantiene la trasparenza nel caso vogliate salvare l’immagine in PNG 24 con trasparenza.

1. Come sempre apriamo Phosotoshop e carichiamo l’immagine che vogliamo riflettere su un layer apposito
2. Duplichiamo il nostro layer (trascinate il layer da duplicare sull’icona ) e nominiamolo “shadow” o “reflex”
3. Dal menu “Modifica” selezionate “Trasforma” / “Rifletti verticale”
4. Trascinate il nuovo layer “reflex” sotto al layer originale e spostiamolo alla base del layer originale
5. Selezioniamo il layer “reflex” e, tenendo premuto il tasto ALT, aggiungiamo una maschera cliccando sull’icona “mask” nella tool window dei layer; il layer “reflex” dovrebbe sparire
6. Selezioniamo la maschera nel layer “reflex” e cliccate sull’icona di riempimento
7. Impostiamo una sfumatura da nero o bianco a trasparente:
8. Tracciamo la sfumatura dal centro del layer originale al centro del layer “reflex”

Continua...