Twitter!

Olá pessoal, tudo bom?

Primeiro que estou contente por esse ser meu primeiro post no blog da DClick.
Segundo que este é o meu primeiro screencast da carreira. Ainda preciso melhorar muito, mas espero que gostem.

Pensem em um back-end Java que independa de front-end. Em uma arquitetura de serviços: RestFull.
Até então, nada de novidade, já que RestFull é algo ‘antigo’ quando se usa outputs em XML ou JSON. Mas e outputs em AMF??? Isso sim é novidade, e é isso que estarei demonstrando para vocês:

E então, alguém sabe os dois grandes problemas em usar/manter isso em um projeto “pra valer”?
Não percam a continuidade aqui!

Código fonte do projeto Java/Flex:
https://github.com/mariojunior/amf-restfull

Abraços galera!

Veja também:

• Flash Mobile 10 – Para Outubro de 2009
• [Canvas vs. Flash] Butterfly 3D (Canvas + JavaScript)
• Flash Player 10.1 : entrevistas e demos
• Adobe Flash suporte completo para dispositívos móveis a caminho : agora vai
• HTC Hero: primeiro dispositivo com Android e Flash

Twitter!

Como todos devem ter percebido, nos últimos meses o CSS3 e o HTML5 tem ganho um grande destaque no desenvolvimento web. Grandes empresas como o Google, Microsoft, Adobe e Apple estão apoiando fortemente o desenvolvimento web utilizando WebStandards. Caso você já conheça algo sobre CSS, provavelmente deve saber como é complicado a organização desses documentos em um projeto de médio ou grande porte. Dado esses problemas conhecidos, foram surgindo os chamados pré-processadores de CSS, que viabilizam a criação de documentos de estilo, adicionando novas funcionalidades.

Hoje vamos conhecer o LESS, The Dynamic Stylesheet Language. O objetivo dessa biblioteca em javascript é prover uma série de funcionalidades para as, usualmente criadas a mão, folhas de estilos. Recursos tais como, variáveis, mixins (Multiple Inheritance, Traits), mixins parametrizáveis, funções, namespaces, importação, etc. Vamos aprender como utilizar os principais recursos dessa biblioteca em um projeto e como aproveitar o melhor dessa biblioteca para organizar corretamente nossas folhas de estilo.

Variables

As variáveis ajudam-nos a definir valores que podem ser utilizados em diversas regras do nosso CSS. Elas possuem escopo assim como em uma linguagem de programação orientada a objetos, trocando em miúdos:

O que é interessante no uso de variáveis é a reutilização e organização. Imagine uma design guideline onde existem RGBs específicos a serem seguidos, essas cores poderiam ser definidas em um documento chamado color_variables.less e adicionados ao nosso arquivo principal utilizando a clausula @import.

@Import – Importando outros arquivos

Quando um arquivo LESS é importado, todas as suas variáveis e mixins são adicionados ao arquivo principal. Os escopos serão mantidos e a extensão .less é opcional.

@import “lib.less”
@import “lib”

É possível utilizar pastas nas clausulas de @import:

@import “where/is/my/stylesheet.less”
@import “where/is/my/stylesheet”

Mixins

No LESS, mixis são como uma espécie de classe CSS que pode ser reutilizada em diversas outras regras. Quando utilizadas, todas as propriedades definidas no mixin são adicionadas a regra onde a mesma foi adicionada, caso um mixin mude, todas as regras que o referenciam serão também modificadas.

Imagine o conceito de mixin como classes CSS orientadas a objeto, o que é interessante do mixin é que temos aqui algo como uma herança múltipla, caso uma mesma instrução seja declarada em mixins diferentes, e esses mixins adicionados a uma regra, o mixin declarado por último terá vantagem na construção final do CSS da regra onde foi adicionado.

Quando modificarmos o mixin .bordered, todos os elementos que o estão utilizando serão modificados. Reutilização!
Vamos para um exemplo mais usável para exemplificar como é um mixin parametrizável.

É importante destacar que um mixin pode conter diversos parâmetros. Isso pode ser feito da seguinte forma:

Nested Rules

Com o LESS você pode criar suas regras de CSS utilizando uma espécie de hierarquia. Vamos ver como isso funciona na prática.

Com o LESS, o mesmo CSS acima poderia ser escrito da seguinte forma:

Depois de processado, o CSS será exatamente igual. Você não precisa utilizar esse esquema de hierarquia caso não queira, é importante lembrar que o LESS é apenas uma extensão do CSS, se for de desejo do desenvolvedor, podemos escrever um código LESS sem usar nenhum recurso especial, como se fosse um CSS tradicional.

Operations

Com o LESS o seu CSS sabe fazer contas. Qualquer número, cor ou variável pode ser utilizada em uma operação aritmética.
Ele sabe identificar quando estamos utilizando uma cor ou um número, por exemplo:

Assim como no javascript, é possível também utilizar parênteses nas suas operações:

Color Functions

Na minha opinião um dos recursos mais úteis durante o desenvolvimento de uma aplicação. Podemos efetuar operações em cima de RGBs, por exemplo, imagine que o layout do seu website foi criado baseado-se em apenas uma cor, utilizando diversos tons dessa cor. Com o LESS é possível utilizar métodos pré-definidos como lighten, saturate, darken, fadein, fadeout e spin. Esses métodos retornam sempre um RGB que pode ser utilizado em seu LESS. Vejamos alguns exemplos:

É possível também extrair informações de uma determinada cor para ser utilizada em outra.
Isso é feito a partir dos métodos hue, saturation e lightness.

Namespaces

Em dado momento necessitamos organizar uma série de mixins e variáveis. Para isto podemos utilizar um conceito presente no LESS chamado Namespaces. Assim como em linguagens de programação orientadas a objetos, que possuem o conceito de pacotes, os namespaces fornecem encapsulação para nossas folhas de estilo. Isso pode ser implementado facilmente utilizando a mesma notação de ID do CSS tradicional. Vejamos.

Verifique que acima, criamos um mixin chamado button dentro do namespace bundle. Para o utilizarmos devemos fazer da seguinte forma:

Uma utilização muito comum dos namespaces é na criação de pequenas bibliotecas de utilidades. Imagine que sua empresa pode possuir uma série de arquivos LESS, e em um determinado projeto você necessita de acesso a esses mixins, variáveis, etc. Organizar seus documentos com namespaces fácilita a visualização e localização de uma determinada instrução no seu documento LESS, como por exemplo, um mixin customizado que pode ser facilmente encontrado a partir da sua indicação de namespace.

Conclusão

Como podemos ver, o LESS facilita uma série de tarefas que são praticamente impossíveis de serem efetuadas pelo CSS tradicional.
Aconselho a todos que tenham interesse em se aprofundar mais na biblioteca a conhecer o website (http://lesscss.org/). Lá você poderá encontrar a documentação com maior riqueza de informações também poderá ver alguns exemplos de código que não foram abordados nesse post.

Qualquer dúvida, sinta-se a vontade e envie-nos um comentário!
Abraço!

Twitter!

Profiles e Environments no novo Spring 3.1

A SrpingSource adotou a estratégia de soltar mais versões do Spring com mais velocidade e escopos de funcionalidades menores.
Seguindo tal estratégia acabou de sair do forno o primeiro release candidate da versão 3.1 do framework.
Para uma estratégia de escopos menores, até que tiveram bastante trabalho e adicionaram várias novidades. Vamos cobrir as novidades aos poucos, começando com uma muito interessante: Profiles e Environments.

Especificando Profiles nos Beans

A idéia de um profile é simples. Um profile define um escopo, envirnmente como é chamado no framework, em que certos beans estarão disponíveis e outros não.
Imagine que você precisa de uma conexão com o banco de dados de testes, que é diferente do banco de dados de desenvolvimento. Com profiles podemos definir um data source do profile de desenvolvimento, e outro do profile de testes, instanciando o correto de acordo com o ambiente que a aplicação irá rodar.

Anotações

Para especificar um profile no seu bean, basta adicionar a anotação @Profile com o nome do profile correspondente. Lembrando que este é o caso em que seus Beans estão sendo criados pelo component-scan usando package scan. Vamos criar um exemplo pra ficar mais claro o que acontece.
Vamos criar uma interface comum para nossos beans:

Agora vamos criar dois profiles e dois beans diferentes para a mesma interface. Um é o bean de desenvolvimento (dev) e o outro de testes (qa).

Repare que já anotei os beans com @Profile respeitando os profiles específicos de cada bean.
Agora criamos o arquivo de beans do spring, dei o nome de spring31-test-beans.xml:

Feito isso, vamos criar um teste para verificar a lógica de criação dos beans. estou usando JUnit 4.8.1.

Algumas coisas diferentes estão acontecendo nesse teste.
Estou instanciando um GenericXmlApplicationContext para carregar meus arquivos de beans, isso porque esse application context me disponibiliza um método que é importante para nosso teste: getEnvironment(). Com isso conseguimos acessar o environment do application context, e mais do que isso, conseguimos setar os profiles que estão ativos usando setActiveProfiles. Repare que é possível de setar mais de um profile como ativo, e que os beans podem precisar de mais de um profile para serem instanciados.
Outro fato importante, é que este environment que está disponível, é uma instância de ConfigurableEnvironment. Se você tentar acessar o profile diretamtente em ApplicationContext, você estará acessando um Environment o qual não permite ativar e desativar profiles. Fica a dica.


Após ativar o profile que queremos, basta chamar o load no contexto seguido do refresh para que os beans sejam criados.
Uma vez que o bean foi criado, basta recuperá-lo e executar o teste para se certificaro que se trata do bean que estamos esperando. Note que o nome dos dois beans é o mesmo, e que apenas um deles existe no application context, pois o outro profile não está ativo.

Nested Beans

Outra maneira de definir profiles nos beans é diretamente no XML do spring. Para que isso seja possível foi necessário permitir nested beans nos arquivos de beans, ou seja, definições de beans dentro de outra definição.
Além de possibilitar a definição de diferentes profiles, essa nova funcionalidade permite que sejam definidos alguns padrões de comportamento para os beans que só se apliquem no conjunto de beans que está nested. Mas isto veremos em um próximo post.
Para testar a definição de profiles direto no XML, vamos criar um outro XML chamado spring31-test-nested-beans.xml:

Feito isso, vamos criar um novo teste que é idêntico ao primeiro, com exceção do arquivo de beans especificado, afinal o comportamento deve ser o mesmo em ambos os casos:

Sua barra do JUnit vai ficar verde e você vai ficar feliz com essa brincadeira rápida com profiles.

Ativando Profiles de outras maneiras

Ativa os profiles no código funciona muito bem no caso dos testes, mas o que realmente se aplica a vida real é poder ativar tais profiles de maneira independente da aplicação e do código propriamente dito. Por isso podemos ativar os profiles setando uma variável global chamada spring.profiles.active.
Podemos ativar tal variável de diversas maneiras, dentre elas no próprio web.xml como um parâmetro da sua Servlet do Spring:

Podemos usar também JNDI, ou até mesmo uma variável de ambiente da VM Java. Se você preferir também pode ativar profiles diretamente no maven:

Fazendo Download

Se você usa o maven, basta adicionar o seguinte no seu pom:

Caso você queira baixar diretamente do site, acesse o site do spring.

Espero ter sido útil, qualquer pergunta basta enviar nos comentários.

Por @Gust4v0_H4xx0r

Na versão Mango do Windows Phone, você pode manipular uma base de dados localmente, chamada de local database na documentação oficial, o recurso permite que o desenvolvedor crie aplicativos com registros de dados em tabelas, além de manipular seus registros utilizando o LINQ to SQL.

Uma base de dados local no WP7 fica localizada no Isolated Storage, um local acessível somente pela aplicação corrente, a arquitetura fica conforme a figura abaixo, onde temos a aplicação que contém um DataContext e através de LINQ to SQL, fazemos o acesso a base de dados local no Isolated Storage

Arquitetura Local Database

Para saber mais sobre Isolated Storage acessem os links:

http://msdn.microsoft.com/en-us/library/ff402541(v=vs.92).aspx

http://www.windowsphonebrasil.net/windowsphonebrasil/post/2010/10/08/Salvando-e-restaurando-o-Application-State-no-Windows-Phone-7.aspx

No WP7 as aplicações ficam eram áreas isoladas uma das outras, ou seja, uma aplicação não tem acesso ao Isolated Storage de outra aplicação, portanto até o momento não é possível compartilhar uma base de dados local com diversas aplicações. Diferente de uma base de dados SQL Server, um local database não pode rodar como um serviço continuo, visto que ele é executado somente durante o processo da aplicação.

Você pode criar um local database para manipular uma quantidade de dados razoável utilizando as facilidades de consultas do LINQ to SQL juntamente com o relacionamento de tabelas, similar a uma base de dados comum, o local database é uma implementação do SQL CE para o WP7, permitindo realizar facilmente tarefas com incluir, alterar , excluir e realizar consultas com LINQ.

Até o momento não existe uma ferramenta de designer visual e oficial para criar as tabelas, relacionamentos, etc, com a base de dados local, o que poderia facilitar muito, neste artigo faremos um exemplo simples, somente com uma tabela, porém, em um projeto mais complexo, essa tarefa poderia ser um pouco trabalhosa, uma forma não oficial de criar o modelo seria utilizar o SQL Metal, para mais informação, acessem o Centro de Treinamento Oficial do Windows Phone no MSDN ou através do link : http://windowsphonegeek.com/articles/Using-SqlMetal-to-generate-Windows-Phone-Mango-Local-Database-classes .

Com o SQL Metal podemos criar o Data Context através de um comando e com poucas modificações deixá-lo compatível com o Mango e poupar a codificação manual da criação de tabelas e relacionamentos.

Exemplo de comando do SQL Metal:

%ProgramFiles(x86)%Microsoft SDKsWindowsv7.0ABin>SqlMetal.exe
/code:”C:CaminhoClienteDC.cs” “C:CaminhoClienteDB.sdf”

Outras formas:

http://claudiufarcas.blogspot.com/2011/10/windows-phone-mango-sql-ce-tips-and.html

http://blogs.ugidotnet.org/corrado/archive/2011/06/05/using-local-database-in-wp7-mango.aspx

Nesta primeira parte do artigo vou criar uma base de dados muito simples, com uma tabela somente e um único campo, dessa forma podemos focar em como criar e entender os conceitos envolvidos Vou criar uma base de dados Cliente.sdf, com uma tabela chamada Cliente e um campo chamado Nome.

A primeira classe que vamos criar é a entidade Cliente e decorar com alguns atributos utilizados para a manipulação da base de dados, a classe servirá de apoio para a criação da tabela cliente. Para que você possa inserir os atributos nas propriedades da classe, é necessário adicionar o using System.Data.Linq.Mapping, em seguida adicione o atributo [Table] logo acima da criação da classe e adicione o atributo [Column()] em cada propriedade, na primary key da tabela, personalize com :

[Column(IsPrimaryKey = true, IsDbGenerated = true, DbType = "INT NOT NULL Identity", CanBeNull = false, AutoSync = AutoSync.OnInsert)]

Dessa forma a coluna será criada na tabela como sendo Primary Key, não permitindo registros duplicados e gerando automaticamente um número a cada inclusão. Com a adição do atributo Column() nas outras propriedades, cada coluna correspondente será criado na tabela.

Com os atributos de colunas você pode definir uma série de recursos, para saber quais são os atributos de colunas que você pode utilizar no LINQ to SQL para WP7 acesse o link http://msdn.microsoft.com/en-us/library/system.data.linq.mapping.columnattribute(VS.95).aspx

Um atributo em especial que adiciona uma coluna de versão pode auxiliar no desempenho de grandes atualizações de dados, apresentando uma significativa melhoria na aplicação, é o IsVersion=true, essa otimização é exclusiva para o LINQ to SQL do WP7 e usado internamente para identificar a versão da coluna modificada:

[Column (IsVersion = true)]
_VERSION Binary privado;

Igualmente importantes são os atributos de associações, que permitem realizar o relacionamento entre as tabelas, para mais informações acesse:

http://msdn.microsoft.com/en-us/library/system.data.linq.mapping.associationattribute(v=VS.95).aspx

Exemplo de Associação:

[Association(Storage = "_cliente", ThisKey = "_clienteId", OtherKey = "Id", IsForeignKey = true)]

Código da Classe Cliente:

? ? ?  [Table]

? ? ?  public class Cliente : INotifyPropertyChanged, INotifyPropertyChanging

? ? ?  

? 

? ? ? ? ? ? ?  #region INotifyPropertyChanged Members

? 

? ? ? ? ? ? ?  public event PropertyChangedEventHandler PropertyChanged;

? 

? ? ? ? ? ? ?  private void NotifyPropertyChanged(string propertyName)

? ? ? ? ? ? ?  

? ? ? ? ? ? ? ? ? ? ?  if (PropertyChanged != null)

? ? ? ? ? ? ? ? ? ? ?  

? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  PropertyChanged(this, new PropertyChangedEventArgs(propertyName));

? ? ? ? ? ? ? ? ? ? ?  

? ? ? ? ? ? ?  }

? 

? ? ? ? ? ? ?  #endregion

? 

? ? ? ? ? ? ?  #region INotifyPropertyChanging Members

? 

? ? ? ? ? ? ?  public event PropertyChangingEventHandler PropertyChanging;

? 

? ? ? ? ? ? ? 

? ? ? ? ? ? ?  private void NotifyPropertyChanging(string propertyName)

? ? ? ? ? ? ?  

? ? ? ? ? ? ? ? ? ? ?  if (PropertyChanging != null)

? ? ? ? ? ? ? ? ? ? ?  

? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  PropertyChanging(this, new PropertyChangingEventArgs(propertyName));

? ? ? ? ? ? ? ? ? ? ?  

? ? ? ? ? ? ?  }

? 

? ? ? ? ? ? ?  #endregion

? 

? 

? ? ? ? ? ? ?  [Column(IsPrimaryKey = true, IsDbGenerated = true, DbType = "INT NOT NULL Identity", CanBeNull = false, AutoSync = AutoSync.OnInsert)]

? ? ? ? ? ? ?  private string id;

? ? ? ? ? ? ?  public string Id

? ? ? ? ? ? ?  

? ? ? ? ? ? ? ? ? ? ?  get

? ? ? ? ? ? ? ? ? ? ?  

? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  return id;

? ? ? ? ? ? ? ? ? ? ?  

? ? ? ? ? ? ? ? ? ? ?  set

? ? ? ? ? ? ? ? ? ? ?  

? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  if (id != value)

? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  NotifyPropertyChanging("Id");

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  id = value;

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  NotifyPropertyChanged("Id");

? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  

? ? ? ? ? ? ? ? ? ? ?  }

? 

? ? ? ? ? ? ?  }

? ? ? ? ? ? ? 

? ? ? ? ? ? ?  [Column()]

? ? ? ? ? ? ?  private string nome;

? ? ? ? ? ? ?  public string Nome

? ? ? ? ? ? ?  

? ? ? ? ? ? ? ? ? ? ?  get

? ? ? ? ? ? ? ? ? ? ?  

? ? ? ? ? ? ?  ? ? ? ? ? ? ? ? return nome;

? ? ? ? ? ? ? ? ? ? ?  

? ? ? ? ? ? ? ? ? ? ?  set

? ? ? ? ? ? ? ? ? ? ?  

? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  if (nome != value)

? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  NotifyPropertyChanging("Nome");

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  nome = value;

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  NotifyPropertyChanged("Nome");

? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  

? ? ? ? ? ? ? ? ? ? ?  }

? 

? ? ? ? ? ? ?  }

? ? ? ? ? ? ? 

? 

? ? ?  }

Em aplicações Silverlight é comum implementar a interface INotifyPropertyChanged para monitorar mudanças nas propriedades da classe , e tirar um melhor proveito do recursos de databinding da tecnologia, para auxiliar o LINQ to SQL, também vamos implementar a interface INotifyPropertyChanging, com ela é possível monitorar quando uma propriedade será modificada e com isso o DataContext é informado e pode identificar as mudanças e melhorar a performance da aplicação.

O Data Context é o local onde definimos o contexto dos dados que servirão para criar a base de dados local, o LINQ to SQL depende do mapeamento entre o modelo de objetos e o esquema da base de dados. Dependendo da complexidade do modelo, esse arquivo pode ser trabalhoso de ser criado manualmente, mas existem formas de utilizar alguma ferramenta para cria-lo, o SQL Metal é uma delas conforme comentado acima no artigo.

Crie uma classe chamada ClienteDataContext , ela vai herdar de DataContext, o DataContext contém diversas propriedades e métodos que auxiliam na manipulação de base de dados, como por exemplo, verificar se uma base de dados existe, criar e excluir uma base de dados, entre outros, mais adiante vamos utilizar o método CreateDatabase() para criar fisicamente a base de dados local no Windows Phone.

A próxima etapa é criar a string de conexão com a base de dados, utilizaremos a palavra chave “isostore” para informar que o arquivo ficará no Isolated Storage, após isso informaremos o nome da base de dados como Cliente.sdf. É na string de conexão que você pode inserir um senha de acesso a base de dados, informar uma cultura específica ou até mesmo criar uma base de dados somente leitura, para mais informações sobre string de conexões para o WP7 acesse http://msdn.microsoft.com/en-us/library/hh202861(v=vs.92).aspx

Por último vamos definir uma tabela Cliente de acesso público e única no DataContext através de public Table Cliente.

No App.xaml.cs da aplicação , localize o construtor da classe e no final adicione o código abaixo, neste momento vamos criar uma base de dados usando o DataContext criado anteriormente, o código verifica se existe uma base de dados e caso não exista ele já cria uma nova base de dados.

using (ClienteDataContext ctx = new ClienteDataContext(ClienteDataContext.DBConnectionString))

? ? ?  if (ctx.DatabaseExists() == false)

? ? ? ? ? ? ?  

? ? ? ? ? ? ? ? ? ?  ctx.CreateDatabase();

? ? ? ? ? ? ?  

? 

}

Para finalizar o artigo vou criar uma tela simples em Silverlight, sem se preocupar com o layout, a tela tem um botão chamado “add” que vai adicionar um registro na base de dados e logo abaixo um ListBox chamado “lst”, que está ligado através de databinding a propriedade ItemSource com uma ObservableCollection chamada Items, na propriedade Text vamos mostrar o nome do cliente também ligando através de databinding.

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  ? Grid.Row="1" Margin="12,0,12,0">
? ? ? ? ? ? ? ? ? ? ?  ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 
? ? ? ? ? ? ? ? ? ? ?  
? ? ? ? ? ? ? ? ? ? ?  
? ? ? ? ? ? ? ? ? ? ?  
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  ? Click="add_Click">
? ? ? ? ? ? ? ? ? ? ? 
? ? ? ? ? ? ? ? ? ? ?  
? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  
? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  
? ? ? ? ? ? ? ? ? ? ?  
? ? ? ? ? ? ? ? ? ? ? 

No constructor do MainPage vamos criar uma instância do DataContext chamado clienteDB :
clienteDB = new ClienteDataContext(ClienteDataContext.DBConnectionString);
No evento ? Loaded da MainPage, realizamos um consulta LINQ to SQL e já adicionamos o resultado em uma ObservableCollections chamada Items, que está ligado ao ItemSource da ListBox, veja como é prático ligar as informações na tela, neste exemplo como o foco é o conceito de local database, o projeto foi criado todo no code-behind da MainPage, mas você poderia criar usando o ViewModel e ligando o ObservableCollection com a View.
var result = from Cliente r in clienteDB.Cliente
select r;
Items = new ObservableCollection(result);
Para mais informações sobre LINQ:
http://msdn.microsoft.com/en-us/library/bb397897.aspx
http://msdn.microsoft.com/en-us/library/bb386976.aspx
http://msdn.microsoft.com/en-us/library/bb386913.aspx
Vamos agora para o código do botão “add” que vai adicionar os registros na base de dados, através do InsertOnSubmit() adicionamos o objeto ao DataContext e através do SubmitChanges(), o objeto é registrado na base de dados, por último, inserimos o objeto na coleção para que seja apresentado na tela.
Cliente c = new Cliente();
c.Nome = txtNome.Text;
clienteDB.Cliente.InsertOnSubmit(c);
clienteDB.SubmitChanges();
Items.Add(c);
? 
Código completo da MainPage:
? ?  public partial class MainPage : PhoneApplicationPage, INotifyPropertyChanged
? ? ?  
? ? ? ? ? ? ? ?  ClienteDataContext clienteDB;
? ? ? ? ? ? ? ?  #region INotifyPropertyChanged Members
? ? ? ? ? ? ? ?  public event PropertyChangedEventHandler PropertyChanged;
? ? ? ? ? ? ? ?  private void NotifyPropertyChanged(string propertyName)
? ? ? ? ? ? ?  
? ? ? ? ? ? ? ? ? ? ?  if (PropertyChanged != null)
? ? ? ? ? ? ? ? ? ? ?  
? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
? ? ? ? ? ? ? ? ? ? ?  
? ? ? ? ? ? ?  }
? ? ? ? ? ? ? ?  #endregion
? ? ? 
? ? ? ? ? ? ?  private ObservableCollection _items;
? ? ? ? ? ? ?  public ObservableCollection Items
? ? ? ? ? ? ?  
? ? ? ? ? ? ? ? ? ? ?  get
? ? ? ? ? ? ? ? ? ? ?  
? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  return _items;
? ? ? ? ? ? ? ? ? ? ?  
? ? ? ? ? ? ? ? ? ? ?  set
? ? ? ? ? ? ? ? ? ? ?  
? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  if (_items != value)
? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  _items = value;
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  NotifyPropertyChanged("Items");
? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  
? ? ? ? ? ? ? ? ? ? ?  }
? ? ? ? ? ? ?  }
? ? ? ? ? ? ? 
? ? ? ? ? ? ?  // Constructor
? ? ? ? ? ? ?  public MainPage()
? ? ? ? ? ? ?  
? ? ? ? ? ? ? ? ? ? ?  InitializeComponent();
? ? ? ? ? ? ? ? ? ? ?  clienteDB = new ClienteDataContext(ClienteDataContext.DBConnectionString);
? ? ? ? ? ? ? ? ? ? ?  this.DataContext = this;
? ? ? ? ? ? ? ? ? ? ?  Loaded += new RoutedEventHandler(MainPage_Loaded);
? ? ? ? ? ? ?  
? ? ? ? ? ? ?  void MainPage_Loaded(object sender, RoutedEventArgs e)
? ? ? ? ? ? ?  
? ? ? ? ? ? ? ? ? ? ?  var result = from Cliente r in clienteDB.Cliente
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?  select r;
? ? ? ? ? ? ? ? ? ? ?  Items = new ObservableCollection(result);
? ? ? ? ? ? ?  
? ? ? ? ? ? ?  private void add_Click(object sender, RoutedEventArgs e)
? ? ? ? ? ? ?  
? ? ? ? ? ? ? ? ? ? ?  Cliente c = new Cliente();
? ? ? ? ? ? ? ? ? ? ?  c.Nome = txtNome.Text;
? ? ? ? ? ? ? ? ? ? ?  clienteDB.Cliente.InsertOnSubmit(c);
? ? ? ? ? ? ? ? ? ? ?  clienteDB.SubmitChanges();
? ? ? ? ? ? ? ? ? ? ?  Items.Add(c);
? ? ? ? ? ? ?  
? ? ?  }
Links:
Boas Práticas:
http://msdn.microsoft.com/en-us/library/hh286406(v=vs.92).aspx
Mais informações sobre local database no Windows Phone :
http://msdn.microsoft.com/en-us/library/hh202860(v=vs.92).aspx
http://msdn.microsoft.com/en-us/library/hh202876(v=VS.92).aspx
Alterações do esquema da base de dados:
http://msdn.microsoft.com/en-us/library/hh394018(v=VS.92).aspx

Twitter!

A algum tempo venho me aventurando no estudo de Design para apps, tanto Android quanto iOS. No entando, depois de vastas pesquisas e claro, da prática, nada melhor que ela para nos dar experiência sobre o assunto, resolvi corrigir meu último post sobre o tema.

Nele eu comento sobre a melhor técnica para criar a skin, indicando a resolução de 320 x 480px como a melhor forma. Recordemos:
“Portanto a melhor técnica é criar, obviamente tudo em vetor, na resolução de 320 x 480px, ver se está tudo harmonico, e então só depois redimensionar para o dobro, 640 x 960px. Confie, ficará muito melhor que desenhar diretamente para 640 x 960px, já tive algumas experiências ruins criando diretamente nessa resolução. Deixe para aplicar texturas caso queira faze-lo na resolução de 640, já as bases tem que ser vetorial.”

Acontece que apesar de ser uma técnica boa, utilizada muito lá fora, nada melhor que desenvolvermos o nosso próprio método, que melhor se adapta a nossa realidade.

Um dos grandes problemas que encontrei na criação de interfaces para iOS é a diferença de cores vista no meu Macbook em relação ao meu iPhone4. (o tal retina).
As cores realmente mudam, e o verde ou azul que eu estava vendo no meu Macbook e que achei que estava agradável, misteriosamente mudava de maneira drástica ao abrir a app no iPhone. Confesso que aquilo me irritava a tal ponto que ? a solução empregada por mim era senão exportar imagens de teste para então abri-las no meu iPhone a fim de comparar as cores.

Ok Eduardo, mas não estavamos tratando de resolução? Sim, mas foi procurando a solução de um problema que cheguei na solução de dois…

Pensei naqueles aplicativos para controlar o Mac remotando através do iPhone, mas que fosse por tela compartilhada, fato, iria resolver a questão das cores, mas nada a ver com a questão da resolução.
Porém depois de testar alguns aplicativos cheguei ao Live View, ele não só resolvia esse meu problema pois compartilha a tela, como sua função é exclusivamente ajudar Designers no desenvolvimento das apps, e nem acreditei quando vi que era FREE, e acreditem, pagaria facilmente 5 dólares por ele hoje devido a sua utilidade.

E porque ele resolveu meu problema de resolução? Porque me senti mais tranquilo em desenvolver já no tamanho do retina a fim de poder ver diretamente no iPhone as proporções dos elementos no meu stage.

Resultado, muito mais praticidade e com isso muito mais qualidade no visual da app…

Logo, inverti o processo para o desenvolvimento diretamente em Retina Display, e quando vou exportar no Photoshop eu simplesmente exporto para @2x com 100% de resolução e então exporto sem o @2x, ou seja, 1x, mas com o nome puro da imagem com 50% do seu tamanho.

Ah sim, e a app funciona também para iPad.

Você precisa instalar uma app no seu Mac, que irá liberar o acesso da app que está no seu iPhone ou iPad para ter a visualização no Mac.

http://www.zambetti.com/projects/liveview/

Antes de mais nada você precisa de uma rede wifi onde seu Mac e seu iPhone ou iPad estejam conectados, uma vez com a app baixada no iPhone e iPad, abra primeiro a app que está no seu Mac, do contrário vai aparecer essa imagem:

Agora que aprendeu, e abriu primeiro o Live View no seu Mac, irá aparecer a seguinte mensagem:

Basta selecionar o seu Mac e a imagem que está dentro do retângulo optado (iPhone ou iPad, portrait ou landscape) irá aparecer no iPhone ou iPad da forma como escolheu.

O Live View também permite você colocar uma senha de acesso por questões de segurança.

Ele possui várias configurações, mas são bem simples, você pode rotacionar a tela (portrait ou landscape), optar pelo Retina, inclusive escolher a performance dependendo da sua rede Wifi.

Essa app foi de grande valia para mim, espero que ajude também você que está desenvolvendo ou pensando em desenvolver para iOS.

Twitter!

Como todos já devem saber, o Canvas é um elemento muito poderoso do HTML5, com ele podemos desenvolver diversos tipos de componentes e aplicações. Tenho certeza que ainda não descobri 5% de seu potencial, ainda mais que meu estudo hoje está limitado a javascript/html puro, sem a introdução de frameworks auxiliares.

Para o exemplo abaixo, utilizei como base um outro exemplo que encontrei na internet, pois ele tinha as funções de desenho das linhas dos gráficos. Com ele em mãos resolvi desenvolver algo mais próximo do que fazemos em dashboards no Flex, como um range de datas para filtro no gráfico, e não é que ficou legal?

Your browser does not support iframes.

Como todos já devem saber, o Canvas é um elemento muito poderoso do HTML5, com ele podemos desenvolver diversos tipos de componentes e aplicações. Tenho certeza que ainda não descobri 5% de seu potencial, ainda mais que meu estudo hoje está limitado a javascript/html puro, sem a introdução de frameworks auxiliares. Para o exemplo abaixo,…

Twitter!

Antes de mais nada, meu enorme agradecimento a diretoria da DClick, Rafael Martinelli, Rogério Martinelli, e Eduardo Melendez, os quais estavam comigo nesse evento da MAX de 2011.

Como alguns aqui já sabem, fui para a MAX porque ganhei a primeira Season do Agon, nossa rede social interna na DClick.

E claro, estou aqui para trazer as minhas primeiras impressões sobre o evento.
Começo dizendo que de infraestrutura não deixa nada a desejar, é um evento de grande porte, muito bacana, e com uma produção de dar inveja. A abertura do evento possui toda a pirotecnia possível, mas vamos deixar essa parte de lado (que você pode conferir facilmente no youtube) para comentar sobre o conteúdo do evento, que é o mais importante.

Sempre reforço que Design é uma matéria que pertence a UX, e não o inverso, tal como outras demais matérias fazem parte do resultado final que é a Experiência do Usuário, e reforçando o que Rafael Martinelli comentou no seu post, a tecnologia é o meio, e ? no Design não é diferente… ? você pode desenvolver uma User Interface com qualquer ferramenta, e para qualquer estrutura, ou seja, qualquer linguagem, Flex, HMTL5, Android, iOS, etc etc… e claro, a ferramenta gráfica mais poderosa do mercado continua sendo o imbatível Photoshop, na minha humilde opinião… Eu sinceramente estava bastante curioso para ver o que a MAX iria trazer nesse sentido, na área de Interfaces, portanto me escrevi nas diversas Sessions de Photoshop, também na de ROX (Return of Experience, ROI pensando no Usuário) e claro, em uma palestra de Flash Catalyst….

Vou começar falando minha impressão sobre as palestras sobre Photoshop, o que vi foi que não se falou muito, ou quase nada de User Interface, e sim foi mostrado técnicas para fotógrafos e outros designers que visam o tratamento de imagem, ou ainda, a produção de imagens detalhadas com 3D e outros efeitos. Confesso que como AppDesigner que sou, me senti meio orfão, mas não é de se admirar, não há profissionais muito empenhados nesse segmento, nem mesmo lá fora, certamente a Adobe fez uma pesquisa do que seria mais atrativo aos participantes da MAX, e acertou em cheio nas palestras voltadas a tratamento de imagens, pois acaba agradando a todos, mesmo AppDesigners como eu se interessam também pelo assunto, pois também utilizamos tais recursos.

Sobre UI não vi nada de novo, nada que eu já não conheça, mas sobre tratamento de imagens, não exatamente no Photoshop, mas por exemplo no Camera Raw e Adobe Bridge, vi recursos que podem ajudar-nos no dia a dia a sermos mais produtivos, sim, muito mais produtivos.. ? e vou abordar as técnicas que vi em posts futuros. Resta dizer ainda, meio que reforçando os comentários do Rafael, que me surpreendi um tempo e vi um pouco de descaso ao Flash, ao Flex nem se fala, praticamente só ouvi falar do mesmo na Session de Catalyst, mas sobre o Flash, depois seu logo apareceu estampado no telão da general session… ? mas o foco era outro, percebi o que não é novidade para ninguém o quanto a plataforma está voltada para games. E claro, o quanto os games estão voltados para o social.

Mas se teve algo que foi comentado em grande escala em todos os eventos, quer seja a general session ou os eventos segmentados, foi sem dúvida o tão badalado nome do momento: HTML5. Acho que você tanto quanto eu sabe as implicações dessa tecnologia, do que ela depende, etc… mas não cabe aqui discutir isso, e sim que o mercado está aceitando o nome, como uma grife, como algo que as pessoas querem estampar. Eu me lembro do termo Web2.0, baladíssimo, as pessoas citam os termos mas não sabem do que se trata realmente.

Agora chega de blá blá blá e vamos a um resumo da situação.

Photoshop:

A MAX trouxe profissionais que falaram de muitas novidades, não dentro do software, mas extensões, aquele tipo de ferramenta que te ajuda no dia a dia. Se teve algo de novo para mim no Photoshop foi sobre uma palestra de compactação de arquivo JPG, confesso que ouvi coisas que me surpreenderam, e é de uma utilidade absurda. Futuro Post

UX:

Nada de novo, mas o óbvio, que avaliar as possibilidades do estudo centrado no usuário pode trazer um retorno muito maior ao investimento feito nos projetos. Não é novo, mas a maioria das empresas não aplica essa estratégia… ? UX também é um termo que está já meio que saturado, todo mundo fala, ninguém sabe o que é, mas é bonito de se citar… ? Não é bem assim que deveria ser, mas ao que parece, a Adobe também está fazendo o seu papel em educar os seus profissionais e evangelistas sobre esse termo, o que é, e o quanto é importante nos projetos. Logo, foi positivo ver esse posicionamento da empresa sobre o assunto. ROX, Futuro post

Design:

A MAX não é o que podemos dizer de um evento propriamente voltado a esse segmento, para isso existe um evento só sobre Photoshop, onde além de se tratar do software em si, se fala sobre os diversos aspectos do Design. Mas resta dizer que estava impecável o tratamento e cuidado com a matéria, quer seja nos games que vi, aplicações, ou citações nas palestras.

Novidade:

A Adobe trouxe alguns tipos de apps para mobile (Tablet mesmo), que pasmem (até parece.. rs) são para Androids primeiramente, e em breve vão sair para iOS.
Você pode encontrá-las aqui: http://www.adobe.com/products/touchapps.html

Aos poucos estarei trazendo as novidades referente aos temas que abordei em posts ou screencasts. Acompanhem o Blog!!!

Twitter!

Impressões sobre o Evento do Google para Desenvolvedores

São Paulo foi escolhida como a primeira cidade para cediar o Google Developer Day, e não foi por acaso. O Google deixou bem claro em seu KeyNote que está acreditando muito no mercado brasileiro no que diz respeito a desenvolvimento de software, e não é uma mera crença, mas sim um argumento baseado em dados que o CTO do Google faz questão de mostrar pra todo mundo em sua palestra. Dentre tais números está a marca impressionante de 500.000 (quinhentas mil) ativações de dispositivos Android no mundo por dia e crescendo, sendo que um dos maiores mercados é o Brasil.






Para participar do GDD era preciso se inscrever no site, e resolver uma provinha com um problema simples de programação. Acertando as questões da provinha, suas chances de ser convidado aumentavam consideravelmente. E foi assim que eu fui convidado.
Trata-se de um evento voltado principalmente para desenvolvedores, com brindes, comida e Wi-Fi de graça, ou seja, o paraíso para muito Nerd entusiasta Google. Com direito a tendinhas e logos do Google espalhados por todo Hall de eventos do Hotel Sheraton.
Fiquei espantado com a quantidade de pessoas, e principalmente com a quantidade de pessoas usando algum smartphone top de linha (com Android claro) no mesmo ambiente. Ambiente esse que tocava música 8 bits dos video games antigos (bons tempos… =) ). E para começar o evento e dar início a maratona de palestras, o CTO do Google pessoalmente ministrou o KeyNote.
O KeyNote deixou todo mundo bem curioso sobre o que estava por vir ao longo do dia nas palestras separadas por tracks como Android, Google AppEngine, Google Chrome e talvez o mais esperado Html 5.

Android

Nada de muito novo com as palestras sobre Android. O pessoal do Google fez questão de manter o suspense sobre qual seria a versão do novo Android (Ice Cream Sandwich), mas que agora já foi revelado que será a 4.0.
Foram feitas algumas palestrar sobre usabilidade de Apps para Android, e passado bem por cima as features novas da plataforma, dentre elas o que acredito fosse o mais esperado é a integração total entre celulares e tablets, ou seja, o mesmo apk para ambos os dispositivos.
Para tornar fácil tal integração, foi adicionado o conceito de Fragment, que nada mais é do que uma porção específica da interface do dispositivo, que varia de acordo com o tamanho da tela. Por exemplo um tablet, pode possuir 3 Fragments padrão, sendo um uma barra de tarefas, outro uma listagem e um uma área de trabalho todos mostrados ao mesmo tempo, mas a mesma aplicação em um celular iria do Fragment de listagem para o Fragment com a área de trabalho por meio de uma transição, pois não cabem os 3 fragments na tela ao mesmo tempo.
Falou-se muito de In App Billing, ou seja, compra de artefatos dentro das próprias aplicações e não diretamente no market. Foram mostrados números bem convincentes, como por exemplo: do top 10 de aplicações mais rentáveis na AppMarket, 9 usam In App Billing. Números no mínimo tentadores para arriscar com a tecnologia.
Acredito que o Google tem muito mais novidade guardada para o Android, mas não falaram nada no GDD, porque o foco do evento foi outro, como veremos.

Google AppEngine

A procura pelas palestras sobre AppEngine foi muito grande, tanto que não consegui entrar em uma delas pois a sala lotou logo depois do anúncio do começo do evento.
O Google definitivamente acredita que seu Cloud é o futuro no que diz respeito a hospedagem de serviços para as Apps Mobile. O foco principal no GDD foi mostrar como que é fácil desenvolver para a AppEngine todos os tipos de aplicativos, incluindo jogos (foi reservada uma palestra apenas para falar de jogos usando a AppEngine).
Acredito que a intenção do Google é difundir mais o uso da AppEngine aqui no Brasil. Acredito que apesar do crescimento que foi obtido, eles percebem que o crescimento pode ser muito maior. Não acompanhei muito o track sobre AppEngine, então não consigo entrar muito em detalhes sobre o que mais foi abordado.

Google Chrome

Eu não esperava que fosse ser dada tanta atenção ao Google Chrome como foi dada no GDD.
Em todas as palestras o Google Chrome era referenciado como principal porta de entrada para a Web e as novas tecnologias. Foram apresentadas ferramentas de produtividade e desenvolvimento para criar aplicativos específicos do Google Chrome.
Acredito que o Google está preparando terreno, e já quer ter em mãos muitos aplicativos compatíveis com o Google Chrome quando chegar a hora de lançar o Chrome OS. E o discurso deles é muito convincente para os desenvolvedores. Eu ouvi muita gente impressionada com as possibilidades e facilidades de desenvolver aplicativos Chrome.

Html 5

Html 5 foi a estrela do evento. Não tinha uma pessoa que os olhos não brilhavam ao ver o trailer de Era do Gelo em 3D no Youtube, ou alguns avatares dançando conforme a música que tocava no ambiente de maneira dinâmica. E todo mundo ficou impressionado quando descobriu que todos os slides de todas as palestras estavam sendo passados no Chrome, e foram feitos em Html 5.
Foram mostradas muita features de Html 5 que ainda estão em teste, e que não necessariamente irão dar certo, mas a idéia não era conseguir algum tipo de vantagem, e sim mostrar o potencial do que está por vir.
Foi apresentado um framework muito interessante em Java: PlayN!. Uma biblioteca para construir jogos que podem ser jogados em Html 5, Android ou até mesmo Java nativo.
Muitas melhorias com tratamento de áudio e vídeo foram mostradas, e do jeito com que os palestrantes demonstraram, é difícil não acreditar que Html 5 ditará o ritmo das aplicações Web em um futuro próximo.





Espero que eu tenha despertado a curiosidade de alguns sobre as tecnologias do Google e da Comunidade que estão por vir. E de uma coisa eu estou convencido, preciso conhecer mais Html 5 .

Por @Gust4v0_H4xx0r