VB .NET -  Implementando interfaces ao estilo Metro com MetroFramework


 No artigo de hoje vou mostrar como podemos criar interfaces ao estilo Modern UI ou Metro (Windows 8) usando o framework MetroFramework em aplicações Windows Forms.

A Modern UI ou Metro (também conhecida como interface de azulejos(tiles)) é o nome da interface de usuário (UI), desenvolvida pela Microsoft, principalmente para uso em Windows Phone.

De forma geral , é uma interface plana, com cores básicas e desenhos geométricos, com a mobilidade horizontal (no PC) ou vertical (no celular). É otimizada para uso em telas sensíveis ao toque, mas pode ser funcional quando você não tem essa propriedade.

Você pode usar os próprios recursos do Windows Forms para criar interface ao estilo Metro; com um pouco de esforço e trabalho, você pode simular o estilo sem ter que usar biblioteca de terceiros mas o você terá que avaliar se o esforço vale a pena.

A boa notícia é que se você deseja ou precisa usar o estilo Metro em aplicações Windows Forms você pode usar o framework MetroFramework que fornece os recursos para criar interfaces nesse estilo de forma relativamente simples e gratuita.

O projeto completo com seu código fonte pode ser obtido neste link : https://github.com/dennismagno/metroframework-modern-ui

Você pode adicionar a biblioteca ao seu projeto via Nuget , no Package Manager Console,  usando o comando : Install-Package MetroModernUI

Neste artigo vou mostrar como criar uma aplicação Windows Forms e usar o MetroFramework mostrando alguns dos seus recursos.

Recursos usados:

Nota: Baixe e use a versão Community 2015 do VS ela é grátis e é equivalente a versão Professional.

Criando a aplicação Windows Forms no VS 2015

Abra o VS 2015 Community  e clique em New Project;

Selecione a linguagem Visual Basic e o template Windows Forms Application e informe o nome : ModernUI_VBNET

Incluindo a referência à biblioteca MetroFramework no projeto via Nuget

No menu Tools clique em Nuget Package Manager e a seguir em Manage Nuget Packages for Solution;

A seguir informe metromodernui e clique em Browse;

Selecione o pacote encontrado, marque o projeto onde deseja instalar, e clique no botão Install;

Nota:  A versão atual no momento que escrevi este artigo era a v1.3.5

Ao final você deverá ter incluído em suas referências 3 arquivos :

  1. MetroFramework
  2. MetroFramework.Design
  3. MetroFramework.Fonts

Incluindo os controles do MetroFramework na ToolBox

Vamos incluir agora os controles disponíveis no MetroFramework na ToolBox.

Selecione o formulário form1.vb criado por padrão no projeto e abra a janela ToolBox.

Clique com o botão direito do mouse sobre a ToolBox e no menu suspenso clique em Add Tab e informe o nome MetroModernUI (ou outro a seu gosto);

Depois clique com o botão direito do mouse sobre a guia MetroModernUi e a seguir em Choose items...;

Na janela Choose ToolBox items, selecione a guia .NET Framework Components, e, clique em Browse;

A seguir localize e selecione o arquivo MetroFramework.dll (procure no seu projeto, em ..\packages\MetroModernUI.1.3.5.0\lib\net45) e clique no botão Abrir;

Ao final você verá os controles adicionados na aba criada conforme mostrado a seguir:

Usando os recursos do MetroFramework para criar interfaces ao estilo Metro

Agora vamos criar a nossa interface ao estilo Metro.

Selecione o formulário form1.vb no projeto e expanda os objetos clicando em InitializeComponent();

Substitua na palavra-chave Inherits System.Windows.Forms.Form por MetroFramework.Forms.MetroFrom. Salve e clique em Form1.vb para ver como ficou a interface:

Pronto ! já temos o nosso formulário ao estilo. Agora é só usar os controles disponíveis. Podemos iniciar alterando a propriedade Theme de Light para Dark incluir o controle Label e TextBox a partir da ToolBox:

A partir deste ponto basta explorar cada um dos controles e suas propriedades.

Abaixo um exemplo de formulário contendo os principais controles do MetroFramework:

 

Pegue o projeto completo aqui :  ModernUI_VBNET.zip

(Disse Jesus aos fariseus) Hipócritas, bem profetizou Isaías a vosso respeito, dizendo:
Este povo se aproxima de mim com a sua boca e me honra com os seus lábios, mas o seu coração está longe de mim.
Mas, em vão me adoram, ensinando doutrinas que são preceitos dos homens.

Mateus 15:7-9

Veja os Destaques e novidades do SUPER DVD Visual Basic (sempre atualizado) : clique e confira !

Quer migrar para o VB .NET ?

Quer aprender C# ??

Quer aprender os conceitos da Programação Orientada a objetos ?

Quer aprender o gerar relatórios com o ReportViewer no VS 2013 ?

Quer aprender a criar aplicações Web Dinâmicas usando a ASP .NET MVC 5 ?

 

  Gostou ?   Compartilhe no Facebook   Compartilhe no Twitter

 

Referências:


José Carlos Macoratti