Criando Método de extensão para incluir CSS dinamicamente

Continuando nossa serie de Post que venho falando da nossa classe útil aonde nos vamos criando métodos de extensão que são bem úteis no desenvolvimento da nossa aplicação hoje, Vou ensinar como criar método de extensão para incluir css ou alter

Continuando nossa serie de Post que venho falando da nossa classe útil aonde nos vamos criando métodos de extensão que são bem úteis no desenvolvimento da nossa aplicação hoje,

Vou ensinar como criar método de extensão para incluir css ou altera dinamicamente no Code Behind .

Crie  um projeto do tipo web, na linguagem cSharp e adicione uma classe com o nome útil e deixe nossa classe como static.

Após criar insira o seguinte código abaixo.

public static HtmlLink GetCssHtmlLink(string pCssPath)

    {

        HtmlLink link = new HtmlLink();

        link.Attributes.Add("href", pCssPath);

        link.Attributes.Add("type", "text/css");

        link.Attributes.Add("rel", "stylesheet");

        return link;

  }

 

Obs: todos os métodos da nossa classe útil e necessário ser estáticos.

Nesse primeiro método que nos vamos criar estamos montado nosso link que vai receber como path o endereço e nome do nosso css, precisamos importa a namespace

System.Web.UI.HtmlControls, ela e responsável pela criação e tratamento dos atributos necessários para a criação do link css dinamicamente, esse método no final retorna o nosso link dessa forma:

Exemplo : <link href="css/estilo.css" type="text/css" rel="stylesheet" /> .

Agora vamos criar nosso Segundo metodo e o mais importante desse artigo antes de criar vamos importa a namespace  System.Web.UI.WebControls responsável pelos controles do asp.net.

 

Public static void RegisterStyleSheet(this PlaceHolder pPlaceHolderCss, string pStyleSheetPath)

    {

        pPlaceHolderCss.Controls.Add(GetCssHtmlLink(pStyleSheetPath));

    }

Esse método é responsável por inserir no nosso controle placeholder os HtmlLink que vai ser nosso css, o método também é do tipo static e recebe como assinatura this placeholder quando nossa fazemos isso criamos uma extensão de método para nosso controle placeholder e não precisamos passar o id do controle apenas passamos o que é necessário para o nosso método que path o caminho do nosso css. 

Agora vamos na nossa página aspx e vamos inserir um controle placeholder da seguinte forma como mostra o exemplo abaixo.

<head runat="server">

    <title></title>

<asp:PlaceHolder runat="server" ID="PlaceHonderCSS" ></asp:PlaceHolder>

</head>

 

Agora vamos para cs(code behind) da nossa página Default.aspx

no método Page_Load vamos instanciar nosso controle e chamar o nosso método apenas colocando um "." como mostra abaixo.

PlaceHonderCSS.RegisterStyleSheet("~/css/estilo.css");

Agora e só rodar  o projeto e olhar o codigo fonte do browser que noss css vai estar lá dentro do <head> </head>.

Simples assim nos já conseguimos inserir nos css dinamicamente no code behind quando for preciso trocar com if e else manipular de uma maneira simplificada e sem muita regra de negocio.

Artigos relacionados