29 julho, 2011

ClickCountTrigger para Silverlight no Expression Gallery

double-click-icon

 

Acabei de publicar uma nova trigger no Expression Gallery, chamada ClickCountTrigger.

Esta trigger serve para simplificar nossa vida quando queremos implementar duplo click em Silverlight, já que a plataforma não fornece uma implementação nativa desse evento. Decidi fazer a trigger de forma genérica e por isso implementei como click count ao invés de double click. Sendo assim, tornei possível que essa trigger seja utilizada para adicionar cliques triplos, quaduplos ou até mais em aplicações Silverlight. Eu não consigo imaginar situações onde mais do que 3 cliques façam algum sentido, mas a minha imaginação não deve limitar a sua Winking smile.

Para configurar a trigger no Expression Blend, basta escolher um controle que deverá ter algum comportamento ao receber um duplo click, adicionar uma Action a ele e depois mudar a trigger padrão dessa Action para ClickCountTrigger e configurar quantos cliques disparam a ação. Abaixo temos alguns prints mostrando a trigger configurada em um botão, em conjunto com a Action ToggleFullScreenAction. Este exemplo é do código do live sample que está na página da trigger na galeria.

Action aplicada no botão

Action ToggleFullScreenAction configurada em um Button

Janela de propriedades da Action, mostrando sua configuração e a da trigger.

Propriedades da trigger ClickCountTrigger e da action de fullscreen

Configuração da trigger e action no xaml

<Button Content="Double-Click to Toggle Full Screen">
    <i:Interaction.Triggers>
        <cnzk:ClickCountTrigger ClickCount="2">
            <cnzk:ToggleFullScreenAction />
        </cnzk:ClickCountTrigger>
    </i:Interaction.Triggers>
</Button>

Declaração no xaml dos namespaces necessários para utilizar tanto a trigger quanto a action:

xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
xmlns:cnzk="http://schemas.cnzk.com.br/library"

Se você utilizar algumas das minhas behaviors, triggers ou actions publicadas no Expression Gallery e tiver algum tipo de feedback ou bug para reportar, pode postar um comentário aqui no blog ou na página do projeto no codeplex.


Espero que esta trigger seja útil para vocês, pois pra mim ela já está sendo.

Busca por controles na árvore visual de aplicações Silverlight e WPF

Ontem eu vi uma pergunta no fórum de Silverlight do MSDN sobre como achar todos os campos TextBox que existem dentro de uma ChildWindow. Já havia algumas respostas para a pergunta mas elas eram bem pontuais para aquele problema específico e necessitavam de várias suposições sobre a estrutura da aplicação para funcionar sem problemas (por exemplo, saber quais tipos de Panel estão sendo usados). Alguns anos atrás, quando eu comecei a fazer uma das minhas primeiras behaviors para publicar na galeria do Expression Blend, eu descobri uma classe do Silverlight (também existe no WPF) que serve justamente para permitir navergarmos na árvore visual de uma aplicação, tanto procurando controles filhos quanto pais de um determinado controle.

A behavior em questão é a que permitia que se fizesse scroll com a wheel do mouse (a rodinha) em controles que apresentassem scrollbar para aplicações feitas em Silverlight 3. Hoje essa behavior praticamente não é mais necessárias pois o Silverlight 4 já implementa esse comportamento nativamente, mas não era esse o caso na época. Para poder implementar essa função eu precisei criar um código que fosse capaz de ler toda a hierarquia visual do controle (vasculhando todos os componentes do qual o template do controle era composto), procurando por algum ScrollViewer. Se eu o encontrasse, a behavior assinava os eventos necessários do controle para que o scroll funcionasse como esperado.

Para navegar pela árvore visual, a classe que utilizei foi a VisualTreeHelper. Voltando à dúvida do fórum, eu decidi criar um método genérico que fosse capaz de encontrar todos os controles de um determinado tipo em uma hierárquia utilizando essa classe, assim estaria garantindo que não precisaria ficar colocando “if”s para cada tipo de painel diferente que aparecesse na minha frente. Sem mais delongas, segue abaixo o método que eu fiz.

public static T[] SearchUIElements<T>(UIElement root, int maxlevel = int.MaxValue, int level = 0) 
   
where T : UIElement
{

   
var result = new List
<T>();

   
if (root != null
) {
       
if (root is
T) {
            result.Add(root
as
T);
        }

       
if
(level < maxlevel) {
           
var childrencount = VisualTreeHelper
.GetChildrenCount(root);
           
DependencyObject
child;
           
for (var
i = 0; i < childrencount; i++) {
                child =
VisualTreeHelper
.GetChild(root, i);
               
if (child is UIElement
) {
                    result.AddRange(SearchUIElements<T>(child
as UIElement
, maxlevel, level + 1));
                }
            }
        }
    }

   
return result.ToArray();
}

Como vocês podem ver o método não é grande e é bem simples. Ele aceita 3 parâmetros:



  • root: controle raiz a partir de onde será iniciada a busca. Por exemplo: LayoutRoot.
  • maxlevel: número máximo de níveis que a busca irá “descer” nos descendentes. Este parâmetro é opcional e o seu valor padrão é int.MaxValue, garantindo que será lida a hierarquia inteira a partir do ponto inicial.
  • level: nível atual da busca. Esse parâmetro é utilizado apenas pela própria função para controlar quando a busca atingirá o nível máximo solicitado pelo usuário.

A função é genérica. O parâmetro T serve para indicar qual tipo de controle será procurado, assim como permitir que o retorno sejá tipado corretamente. A é executada de forma recursiva, chamando a si mesma para cada novo ítem na hierarquia.


O resultado da função é sempre um array do tipo de controle solicitado. Esta função sempre retorna uma array, mesmo que seja vazio (não será retornado null).


Abaixo temos um xaml de exemplo e algumas chamada à função com a descrição do que será encontrado em cada caso.

<Grid x:Name="LayoutRoot">
    <TextBox />
    <TextBox />
    <Grid>
        <TextBox />
        <TextBox />
        <Grid>
            <TextBox />
        </Grid>
    </Grid>
</Grid>
//acha TODOS os 5 campos TextBox 
var textboxes = SearchUIElements<TextBox
>(LayoutRoot);

//acha apenas os 2 campos TextBox de LayoutRoot
textboxes = SearchUIElements<TextBox
>(LayoutRoot, 1);

//acha 4. Os 2 acima e os 2 que estão no primeiro Grid filho
textboxes = SearchUIElements<TextBox
>(LayoutRoot, 2);

//acha TODOS os Grids a partir de LayoutRoot, inclusive ele mesmo
var grids = SearchUIElements<Grid>(LayoutRoot);        

Agora que eu já mostrei como faz, você acha que consegue fazer uma função semelhante que navegue ao contrário na hierárquia? (procurando nos pais de um controle até chegar na raíz da aplicação…). Fica o desafio. Winking smile

28 julho, 2011

Estratégia para lidar com callbacks assíncronos em Silverlight

Recentemente, conversando com alguns desenvolvedores no trabalho e verificando algumas perguntas publicadas nos fóruns do MSDN, eu notei que ainda há uma dificuldade muito grande tanto de compreensão quanto de implementação para trabalhar com métodos assincronos. Isso se torna um problema particularmente importante em aplicações Silverlight pois todas as chamadas a web services, RIA services, web requests, etc são obrigatoriamente feitos de forma assincrona, não havendo opções para executar essas mesmas operações da forma sincrona e linear à qual a maioria dos desenvolvedores está acostumada.

Acontece que desenvolvimento assincrono não é difícil e, depois que você aprende e se acostuma, você acaba percebendo que suas aplicações passam a funcionar muito melhor. Sim, não vou argumentar aqui contra o fato de que é necessário se acostumar e que começo seja realmente algo estranho, mas posso garantir que demora pouco tempo para se acostumar e os benefícios são muitos.

Há muitas abordagens e estratégias possíveis para desenvolvimento assíncrono e eu vou apresentar aqui uma delas que é bem simples e que eu usei em praticamente todos os projetos Silverlight em dos quais participei. Essa abordagem não envolve o uso de nenhum framework ou biblioteca externa e pode ser utilizada tranquilamente também em projetos que não sejam Silverlight.

Digamos que você precisa obter o html de uma página web por algum motivo. Uma forma de fazer isso seria criando uma nova instância de WebClient, assinando o evento DownloadStringCompleted e depois chamando o método DownloadString passando a url. Ok, não é difícil, mas é um código repetitivo que poderia facilmente ser reaproveitado ao invés de ser copiado por toda sua aplicação em todo lugar onde você precisar fazer download de uma página. O que eu costumo fazer para esse tipo de chamada é criar um método estático em uma classe utilitária e simplesmente chamar esse método passando, nesse caso, minha url e um ponteiro de callback. É mais fácil mostrar:

public static void HttpGet(string url, Action<string, Exception> callback) {
   
if (!string
.IsNullOrWhiteSpace(url)) {
       
var client = new WebClient
();
        client.DownloadStringCompleted += (sender, e) => {
           
if (callback != null
) {
                callback(e.Result, e.Error);
            }
        };
        client.DownloadStringAsync(
new Uri(url));
    }
}

Quais são as vantagens desse método:



  • para executá-lo não é necessário instanciar nenhuma classe
  • é facil de reutilizar
  • permite que a lógica da minha aplicação fique um pouco mais simples, já que não me obriga a assinar nenhum evento no meu código

Para executar esse método, eu posso usar 2 abordagens.


Abordagem 1 – Delegar o retorno para outro método. Nessa abordagem eu chamo o método HttpGet passando a url desejada e o ponteiro de um método que será executado quando o request for concluído.

private void LoadData() {
    HttpGet(
"http://kelps.net"
, DataLoaded);
}

private void DataLoaded(string data, Exception
error) {
   
if (error == null
) {
       
//utiliza os dados retornados na variável "data"
    }
}

Abordagem 2 – Utilizar uma expressão lambda para criar um método anônimo inline no meu código, ao invés de criar uma função separada apenas para processar os dados retornados.

HttpGet("http://twitter.com/kelps", (data, error) => {
   
if (error == null
) {
       
//utiliza os dados retornados na variável "data"
    }
});

A única diferença de funcionamento entre as 2 abordagens acima é que na segunda seria possível utilizar variáveis que estiverem no mesmo escopo da chamada que está sendo feita, ao passo que na primeira seria necessário que essas variáveis fossem globais da classe para que isso funcione. Nos projetos em que trabalho eu costumo utilizar ambas as abordagens, de acordo com o que faz mais sentido em cada situação. Expressões lambda são bem concisas e compactas, mas são claras para qualquer desenvolvedor.


Este foi apenas um pequeno exemplo de como trabalhar com chamadas assincronas sem ficar se perdendo com assinaturas e liberação de eventos. Há outras formas mais complexas e robustas de lidar com isso mas a minha intenção hoje era simplesmente mostrar como dá pra trabalhar de forma simples com código assíncrono, mesmo sem utilizar nenhuma biblioteca externa.

27 julho, 2011

Windows Phone SDK 7.1 Beta 2 Refresh disponível para desenvolvedores

Quem está participando do beta do Windows Phone Mango para desenvolvedores recebeu uma agradável notícia hoje: Foi disponibilizada uma atualização para os aparelhos com um build mais recente do sistema operacional.

O novo build é o 7712, não o 7720, que é a versão RTM. Foi necessário que usássemos essa versão anterior pois é a versão que é compativel com a atualização do SDK e do Zune que estão sendo disponibilizadas neste refresh.

Está previsto que até o final de agosto O Marketplace será aberto para começarmos a publicar aplicações que funcionarão apenas em aparelhos com Windows Phone 7.5, o que nos dará uma chance de testar bem nossas aplicações em vários aparelhos de desenvolvedores antes que esta versão do SO esteja disponível para o público geral. Isso é interessante pois significa que quando a nova versão do SO estiver disponível para o público já haverá várias aplicações no Marketplace tirando proveito das novas capacidades do sistema operacional. Esta atualização de agosto provavelmente virá junto com uma versão RC (Release Candidate) do SDK.

Se você é um desenvolvedor cadastrado no Marketplace, tem um aparelho com Windows Phone e está participando do Beta do Windows Phone Mango, vá agora mesmo ao Connect e instale este refresh, mas não se esqueça de fazer backup dos backups dos seus backups antes de fazer isso, para garantir que você conseguirá voltar o seu telefone para a versão normal quando a versão RTM estiver disponível pois não será possível ir da versão beta diretamente para a versão RTM do WP7.

PS.: Quando você instalar o novo SDK ele vai aparecer como sendo RC na janela de adicionar e remover programas do Windows, mas na verdade esta ainda não é a versão RC do SDK.

04 julho, 2011

Palestra sobre as novidades do Silverlight 5 no TDC2011/SP

Na próxima sexta-feira, dia 08/07 eu irei apresentar uma palestra sobre as novidades do Silverlight 5 no TDC 2011. Se você não se inscreveu ainda, ainda dá tempo. A inscrição no evento é feita por trilha, o que o torna bem mais barato. A palestra de Silverilght 5 será na trilha “.NET Client” que acontecerá no dia 08/07 e o preço do evento por trilha é R$ 60,00.

Para quem não sabe, o TDC (The Developer’s Conference) é uma conferencia de baixo custo sobre desenvolvimento que acontece todos os anos em várias e abrange várias tecnologias. Este ano a conferencia acontecerá em São Paulo (06/07 a 10/07), Florianópolis (20/08 e 21/08) e Goiânia (28/10 e 29/10).

Veja abaixo a lista de palestras da trilha .NET Client de São Paulo, que acontecerá no dia 08/07.

Programação da trilha .NET Client no TDC2011-SP

Espero vocês lá.