Poznámka: články jsou již mnoho let staré, doba se posunula, mnoho věcí v nich doporučovaných je již dnes překonané - berte s rezervou!


Control Adapters - filtrování výstupu ovládacích prvků ASP.NET

Článek původně vyšel na serveru www.netstudent.cz, ale protože vyhledávače tento server prakticky ignorují, rozhodl jsem se ho uveřejnit také na Trupíkově weBlogu. Pokud se zajímáte o programování v C#, najdete na onom serveru jistě mnoho užitečných článků a návodů.

Poté, co vyšly první verze .NET frameworku, často se jim vytýkalo, že kód, který jednotlivé komponenty generují, není validní. Byla to pravda a byla to ostuda, takže od verze 2.0 komponenty generují validní XHTML kód. Do té doby ale naplno vypukla css mánie a s ní spojené pohrdání tabulkami. Prakticky všechny složitější standardní komponenty ale používají tabulkový layout pro svůj výstup. Je pravda, že každý má možnost psát vlastní css-friendly komponenty, ale proč psát celou komponentu znova, když jedinné, co chci, je upravit styl výstupu. Proto jsou od verze 2.0 k dispozici také Control Adapters, které umožní napsat vlastní výstup pro jednotlivé komponenty

Základní filosofie Control Adapterů

Pokud chcete upravit kód generovaný nějakou komponentou, musíte vytvořit novou třídu - potomka třídy WebControlAdapter (popř. DataBoundControlAdapter) a předefinovat některé její metody. Tuto třídu potom registrujete v konfiguračním souboru pro danou komponentu. V předefinovávaných metodách máte k dispozici HtmlTextWriter, který se používá pro vlastní generování výstupu.

Existující Adaptery

Napsat vlastní adaptér pro složitější komponentu není úplně jednoduché - resp. je to spousta rutinní práce. Lze stáhnout ale sadu oficiálních adaptérů pro nejdůležitější controly (zároveň pro ty, u kterých je základní generovaný výstup opravdu ošklivý) - Menu, TreeView, DetailsView, FormView, GridView, DataList a Membership componenty. Tyto adaptéry jsou napsané opravdu šikovně - každý přichází se dvěma CSS styly. V prvním najdete pravidla přímo se týkající layoutu (a je doporučeno je neměnit) a druhý můžete použít pro nastavení vzhledu (fonty, barvy, obrázky na pozadí apod.). Tento druhý stylesheet je navíc velmi dobře okomentován.

Sadu existujících adaptérů můžete stahovat na adrese:

Download Microsoft CSS Friendly Control Adapters 1.0

Ukázku použití v praxi (včetně popisu použití a zobrazení rozdílů mezi standartním výstupem a výstupem přes adaptér) najdete na:

ASP.NET 2.0 CSS Friendly Control Adapters 1.0

Příklad DataList

Balík oficiálních adaptéru ve většině případů stačí, ale myslím si, že je dobré vědět, jak to vlastně funguje (resp. ukázat to na malém příkladu). Vybral jsem si jednoduchou komponentu DataList, pro kterou napíšu adaptér.

Komponenta má standardně dvě možnosti výstupu - RepeatLayout Table a Flow. Table generuje tabulku, flow jednotlivé prvky uzavírá pouze do tagů . Můj adaptér bude vypisovat DataList jako neuspořádaný seznam (UL)

Třída adptéru vypadá takto:

using System; using System.Web; using System.Web.UI.WebControls; using System.Web.UI.WebControls.Adapters; using System.Web.UI; public class DataListAdapter : WebControlAdapter { public DataListAdapter() { } protected override void RenderBeginTag (HtmlTextWriter writer) { DataList dataList = base.Control as DataList; if (dataList.HeaderTemplate != null) { PlaceHolder container = new PlaceHolder(); dataList.HeaderTemplate.InstantiateIn(container); container.DataBind(); container.RenderControl(writer); } writer.RenderBeginTag(HtmlTextWriterTag.Ul); } protected override void RenderContents (HtmlTextWriter writer) { DataList dataList = base.Control as DataList; foreach (Control datalistitem in dataList.Items) { writer.RenderBeginTag(HtmlTextWriterTag.Li); foreach (Control itemCtrl in datalistitem.Controls) { itemCtrl.RenderControl(writer); } writer.RenderEndTag(); writer.WriteLine(); } } protected override void RenderEndTag (HtmlTextWriter writer) { writer.RenderEndTag(); } }

Přetížené metody RenderBeginTag, RenderContents a RenderEndTag jsou definovány ve stejném pořadí v jakém jsou volány při rendrování na stránce. V metodě RenderBeginTag se vypíše základní tag <ul> a kromě toho se také obsluhuje případný obsah (to můžete provést i v RenderContents, mě se to ale hodilo tady). V RenderContents se vypíše vlastní obsah DataListu - přístupný přes kolekci Items. RenderEndTag vypíše jen koncový tag </ul>.

Soubory .browsers a zapojení adaptéru

Zatím se ještě nic neděje, protože aplikace neví, že má pro DataList použít vytvořený adaptér. To je potřeba nastavit v souboru konfiguračním souboru App_browser/browsers.browser (jméno souboru může být libovolné, měl by být ale ve složce App_browser a koncovku mít .browser). V něm lze nastavit adaptéry pro jednotlivé controly a také pro jaké prohlížeče se mají jaké adaptéry použít. Lze tedy například vytvořit různé adaptéry (a tedy generovat různý výstup) pro různé prohlížeče. To se hodí, třeba když chcete použít css-friendly layout jen tam, kde jste si jistý, že ho prohlížeč správně zobrazí (a třeba pro IE 5 a starší generovat defaultní tabulkový layout) - přesně to dělá ukázková stránka. Můj .browser vypádá takhle: (pro IE5 a starší a nevyjmenované prohlížeče se použije defaultní výstup)

<browsers> <browser refID="IE6to9"> <controlAdapters> <adapter controlType="System.Web.UI.WebControls.DataList" adapterType="DataListAdapter" /> </controlAdapters> </browser> <browser refID="MozillaFirefox"> <controlAdapters> <adapter controlType="System.Web.UI.WebControls.DataList" adapterType="DataListAdapter" /> </controlAdapters> </browser> <browser refID="Opera8to9"> <controlAdapters> <adapter controlType="System.Web.UI.WebControls.DataList" adapterType="DataListAdapter" /> </controlAdapters> </browser> <browser refID="Safari"> <controlAdapters> <adapter controlType="System.Web.UI.WebControls.DataList" adapterType="DataListAdapter" /> </controlAdapters> </browser> <browser id="W3C_Validator" parentID="default"> <identification> <userAgent match="^W3C_Validator" /> </identification> <controlAdapters> <adapter controlType="System.Web.UI.WebControls.Menu" adapterType="DataListAdapter" /> </controlAdapters> </browser> </browsers>

Podrobnosti o syntaxi souborů .browser najdete zde:

Další odkazy:

Ohodnoťte prosím užitečnost článku




5
 
18
 
10
 
8
 
0
 
 
Vložit komentář:
 

 



 

 

Nepoužívejte žádné html ani texy značky, odřádkování se zachová. Pokud uvádíte zdrojový kód, můžete ho vložit mezi značky
<syntax jazyk="PHP">...</syntax>,
bude potom zformátován. Jako atribut můžete uvést PHP, C#, HTML, CSS a mnoho dalších.


opiste cislo Opište číslo: