jump to navigation

Quick tip: Convert images from any format to XAML 8/3/10

 

Hey there!

For today’s quick tip I’ll show how to convert images from any 2D vector format (and I really mean ANY) to XAML. It’s pretty simple!

Note: if your image is in a bitmap format (e.g. JPEG, PNG, GIF, PSD, etc), you should simply convert it to PNG or JPEG using any image editor and use it directly as a bitmap image in your app. This method is only necessary for vector file formats.

Note 2: There are specialized converters for many formats that might yield better results. I’d recommend searching the web to see if there isn’t a converter for your format before trying this method.

Requirements:

Steps:

  1. Open your image in your favorite image viewer. In this example, I’ll open an SVG from Wikipedia with Firefox.

    SVG image in Firefox
  2. Print the image to PDF with PDFCreator.

    Printing image with PDFCreator
  3. Rename the PDF file to AI using Windows Explorer. (e.g. “image.pdf” becomes “image.ai”)

    Image is in PDF formatRename to AI format
  4. Open the AI file with Expression Design. You might now want to delete some parts of the image that you don’t want to be exported.

    AI file open in Expression Design
  5. Save it to XAML as usual using File > Export… in Expression Design.

    Exporting to XAML with Expression Design

Yes, it’s THAT simple! Enjoy!

See you next time,
Roberto

2 comments
Categories: Dicas, Expression, Silverlight, WPF  

Quick WPF/Silverlight tip: Generic Converter MarkupExtension 4/3/10

 

Hey there!

It’s been quite a while since the last English post – XAMLCast has been taking much of my blogging time :-)

Today’s tip is an expansion of a method originally developed by Dr. WPF in this post: http://www.drwpf.com/blog/Home/tabid/36/EntryID/48/Default.aspx .

Usually, when working with Converters in WPF/SL, we always follow the same steps:

  1. Create a class that derives from IValueConverter: 
    public MyConverter : IValueConverter {}
  2. Implement Convert (and sometimes ConvertBack) 
    public object Convert(object value, Type  targetType, object parameter,  System.Globalization.CultureInfo culture)
{
  // convert and return something
}
  3. Instantiate the converter as a resource and use it: 
    <ResourceDictionary ...>
    <local:MyConverter x:Key="TheConverter" />
</ResourceDictionary>
...
{Binding Converter={StaticResource TheConverter} ...}

Well, it works but it’s not a compact syntax. Following Dr. WPF’s idea, we can use a MarkupExtension to replace the StaticResource by a static instance of the Converter:

public class  MyConverter: MarkupExtension, IValueConverter
{
    private static MyConverter _converter;

    public object Convert(object  value, Type targetType, object  parameter, System.Globalization.CultureInfo culture)
    {
        // convert and return something
    }

    public object  ConvertBack(object value, Type  targetType, object parameter,  System.Globalization.CultureInfo culture)
    {
        // convert and return something (if needed)
    }

    public override object  ProvideValue(IServiceProvider serviceProvider)
    {
        if (_converter == null)
            _converter = new MyConverter();
        return _converter;
    }
}

Usage:

xmlns:conv="[Path to namespace that contains the converter]"
...
{Binding Converter={conv:MyConverter}}

Now that’s pretty!

The only problem is that with this method, you’d have to repeat the implementation of the ProvideValue for each converter you create, and we programmers hate repeating ourselves :-)

One solution I found is to create a generic abstract class that will contain that implementation, and derive each converter from that class. It’s cleaner and works the same:

using System;
using System.Windows.Data;
using System.Windows.Markup;

namespace VirtualDreams.Converters
{
    [MarkupExtensionReturnType(typeof(IValueConverter))]
    public abstract class ConverterMarkupExtension<T> : MarkupExtension where T : class, IValueConverter, new()
    {
        private static T _converter;

        public override object ProvideValue(IServiceProvider serviceProvider)
        {
            if (_converter == null)
            {
                _converter = new T();
            }
            return _converter;
        }
    }
}

Let’s apply it to MyConverter:

public class  MyConverter: ConverterMarkupExtension<MyConverter>, IValueConverter
{
    public object Convert(object  value, Type targetType, object  parameter, System.Globalization.CultureInfo culture)
    {
        // convert and return something
    }

    public object  ConvertBack(object value, Type  targetType, object parameter,  System.Globalization.CultureInfo culture)
    {
        // convert and return something (if needed)
    }
}

Usage:

xmlns:conv="[Path to namespace that contains the converter]"
...
{Binding Converter={conv:MyConverter}}

Simpler, less repetitive – that’s the way I like it!

Happy converting!

Roberto

Comment this post
Categories: .net, Dicas, Silverlight, WPF  

XAMLCast – 2a Temporada – Episódio 8 – MVPs do ano Silverlight, Windows Phone 7, MIX 10K e Silverlight 3D 24/2/10

 

Olá olá pessoal!

Já estamos na edição 8 e as novidades não param.
Já tem gente pedindo o XAMLCast duas vezes por semana (caramba).

No podcast desta semana falamos dos MVPs de Silverlight que foram destaque em 2009, falamos do Windows Phone e também discutimos um pouco sobre os projetos de 3D no Silverlight.
Ouça e mande sua opinião e comentário!

 
icon for podpress  XAMLCast - 2a Temporada - Episódio 8 [32:44m]: Play Now | Play in Popup | Download

Seguem os links relacionados ao podcast:

Para assinar:

O XAMLCast também está no Twitter!

- Twitter oficial: @xamlcast (e hashtag #xamlcast)

- Siga os XAMLCasters:

- Adicione o Twibbon do XAMLCast ao seu avatar!

Até o próximo!

Abraços,

Kelps, Roberto Sonnino e Rodrigo Kono

Comment this post
Categories: Microsoft, Novidades, Silverlight, WPF, XAMLCast  

XAMLCast – 2a Temporada – Episódio 7 – Silverlight Viewport, Visual Studio 2010 RC, MVVM 17/2/10

 

Caros ouvintes!

Continuando o papo técnico, este espisódio do XAMLCast traz o tema MVVM salpicado com novidades e boas dicas e referências para você estudar.

Ouça e tire suas conclusões:

 
icon for podpress  XAMLCast - 2a Temporada - Episódio 7 [32:08m]: Play Now | Play in Popup | Download

Seguem os links relacionados ao podcast:

Discutam, comentem e retwittem!

Para assinar:

O XAMLCast também está no Twitter!

- Twitter oficial: @xamlcast (e hashtag #xamlcast)

- Siga os XAMLCasters:

- Adicione o Twibbon do XAMLCast ao seu avatar!

Aguardamos seu feedback!

Abraços,

Kelps, Roberto Sonnino e Rodrigo Kono

2 comments
Categories: Dicas, Microsoft, Novidades, Silverlight, WPF, XAMLCast, XNA  

XAMLCast – 2a Temporada – Episódio 6 – MEF, Seesmic Look, Moonlight 3 3/2/10

 

Saudações!

O XAMLCast dessa semana está mais técnico. Falamos de MEF (Managed Extensibility Framework) e também de algumas boas novidades.
Se você sabe, não sabe ou quer saber o que é MEF, ouça, tire suas conclusões, mande dúvidas e participe enviando suas sugestões e complementos para o @xamlcast no twitter.

Ouça:

 
icon for podpress  XAMLCast - 2a Temporada - Episódio 6 [25:36m]: Play Now | Play in Popup | Download

Como de tradição, seguem abaixo os links para completar o seu entendimento e ajudar nos seus estudos:

Para fechar, parabéns ao ganhador do Expression Studio!
O ganhador foi Marcelo Paiva (@marcelo_paiva). Ele foi o primeiro a retwittar as 3 palavras na sequência certa pedida pelo @xamlcast! (link: http://twitter.com/marcelo_paiva/status/8288165428).

Obrigado pela participação Marcelo, o Expression irá chegar em sua casa!

Boa sorte e espero que gostem do podcast da semana!

Para assinar:

O XAMLCast também está no Twitter!

- Twitter oficial: @xamlcast (e hashtag #xamlcast)

- Siga os XAMLCasters:

- Adicione o Twibbon do XAMLCast ao seu avatar!

Aguardamos seu feedback!

Abraços,

Kelps, Roberto Sonnino e Rodrigo Kono

1 comment
Categories: Dicas, Novidades, Open Source, Silverlight, WPF, XAMLCast  

XAMLCast – 2a Temporada – Episódio 5 – Notícias, retrospectiva 2009, concursos e final da promoção 27/1/10

 

Palmas para o XAMLCast!

Após um impreviso técnico que causou um atraso de uma semana, o seu informativo semanal sobre XAML, Silverlight e WPF está no ar, com muitas notícias!
Ouça:

 
icon for podpress  XAMLCast - 2a Temporada - Episódio 5 [23:10m]: Play Now | Play in Popup | Download

Essa semana o XAMLCast traz as seguintes informações:

PROMOÇÃO!

Não esqueça que este episódio contém as palavras premiadas para você ganhar o Expression Studio novinho novinho!

Ouça, anote as palavras premiadas deste episódio e as palavras do episódio passado, siga o @xamlcast e fique atento no twitter!

Quando o @xamlcast perguntar as palavras premiadas informe todas as palavras na sequência correta!
O mais rápido irá levar!

Boa sorte e espero que gostem do podcast da semana!

Para assinar:

O XAMLCast também está no Twitter!

- Twitter oficial: @xamlcast (e hashtag #xamlcast)

- Siga os XAMLCasters:

- Adicione o Twibbon do XAMLCast ao seu avatar!

Aguardamos seu feedback!

Abraços,

Kelps, Roberto Sonnino e Rodrigo Kono

Comment this post
Categories: Dicas, Microsoft, Novidades, Silverlight, WPF, XAMLCast  

XAMLCast – 2a Temporada – Episódio 2 – Moonlight, AR com SL4, SL dentro do WPF, VS2010 RC 30/12/09

 

Fala pessoal!

XAMLCast is on fire!

Este episódio está muito bacana, falamos de Moonlight, AR com Silverlight 4, Silverlight renderizado no WPF e do VS2010 RC.

Ouça!

 
icon for podpress  XAMLCast - 2a Temporada - Episódio 2 [20:02m]: Play Now | Play in Popup | Download

Seguem abaixo as referências:

Para assinar:

O XAMLCast também está no Twitter!

- Twitter oficial: @xamlcast (e hashtag #xamlcast)

- Siga os XAMLCasters:

- Adicione o Twibbon do XAMLCast ao seu avatar!

Obrigado pelo feedback do 1o episódio! Esperamos que o XAMLCast fique cada vez mais do jeito que vocês querem. Aguardamos seus comentários!

Feliz ano novo! Esperamos você em 2010 para o próximo XAMLCast!

Abraços,

Kelps, Roberto Sonnino e Rodrigo Kono

1 comment
Categories: Novidades, Silverlight, WPF, XAMLCast  

XAMLCast – 2a Temporada – Episódio 1 – O XAMLCast está de volta! 23/12/09

 

Fala pessoal!

Depois de um longo período em OFF com o XAMLCast estamos de volta!

Agora com um terceiro apresentador: Kelps Leite. Kelps é desenvolvedor Web ha 10 anos e desenvolve com Silverlight há mais de dois anos, sendo hoje um Blend Insider. Ele já participou com a gente de um XAMLCast quando foi entrevistado no TechEd 2007. Bem vindo Kelps!

No primeiro episódio dessa segunda temporada falamos das novidades do PDC 2009, Surface, Bing, SL4 e mais.

 
icon for podpress  XAMLCast - 2a Temporada - Episódio 1 [19:57m]: Play Now | Play in Popup | Download

Seguem abaixo as referências:

Para assinar:

O XAMLCast também está no Twitter!

- Twitter oficial: @xamlcast (e hashtag #xamlcast)

- Siga os XAMLCasters:

- Adicione o Twibbon do XAMLCast ao seu avatar!

O que você achou da volta do XAMLCast? Aguardamos seus comentários!

A equipe do XAMLCast te deseja um Feliz Natal e um Ótimo Ano Novo com muito XAML! E até a próxima!

Abraços,

Kelps, Roberto Sonnino e Rodrigo Kono

Comment this post
Categories: Microsoft, Novidades, Silverlight, WPF, XAMLCast  

New article: Multi-touch development with WPF – A multi-touch RSS reader 1/11/09

 

Hey there!

TouchReader screenshot

I’ve just released a new article on CodeProject: this time it’s about multi-touch development with WPF 3.5 and Multi-Touch Vista. In the article you’ll learn how to set up your PC for multi-touch development and you’ll be able to see the making of a MT RSS reader application. If you’re interested in new interfaces and better user experiences, this article is a “must see” =D

Here’s the link:

http://www.codeproject.com/KB/WPF/MultiTouchRSS.aspx

If you like this article, please sign in and vote for this article (on the right corner, “Rate this article”). And please comment!

Also, if you like this kind of article, I’d recommend my other article on CodeProject, about 3D, speech and ink with WPF at http://www.codeproject.com/KB/WPF/3D-bookwriter.aspx .

Enjoy!

Thanks!
Roberto

4 comments
Categories: .net, Artigos, Novidades, Surface, Tecnologia, WPF  

WPF: dicas para começar com MVVM 3/3/09

 

Fala pessoal!

 mvvm

Voltando ao blog um pouco mais técnico, eu tenho recebido ultimamente algumas perguntas com relação ao design pattern MVVM (Model-View-ViewModel). Não sei porque esse pattern só caiu “na boca do povo” agora, sendo que ele já está em uso de diversas maneiras no WPF desde 2005.

De qualquer forma, vocês pedem, eu mando!

Então comecemos com o básico: o que é MVVM? E por quê eu preciso saber?

[Atenção: este post é mais voltado para desenvolvedores que já têm alguma experiência com WPF. Se você está começando, recomendo os artigos no MSDN sobre WPF básico que meu pai e eu publicamos.]

O padrão MVVM é hoje o mais usado em aplicações LOB com WPF (e Silverlight), porque ele permite criar de maneira fácil aplicações bem estruturadas usando os recursos do WPF como databinding e templates.

Nessas aplicações, o modelo (classes que representam objetos de negócio) está completamente separado da view (interface visível). A “cola” que liga os dois é o ViewModel (também chamado de Presentation Model), que nada mais é que uma abstração de uma view: ele expõe algumas propriedades do modelo (e calcula ou adiciona mais algumas, se for necessário) e é usado como DataContext para fazer o binding (two-way) com a view, que é montada a partir de templates. Ele também é usado para guardar o estado da view e fazer as atualizações no modelo. O tratamento de “ações” da interface é feito por meio de Commands no WPF, ligados ao ViewModel.

E qual a vantagem? Primeiro, o fato de usar ViewModels como abstração da view permite criar criar views que não conhecem o modelo, e vice-versa. Isso significa que o designer e o desenvolvedor podem trabalhar completamente separados durante todo o projeto, e só se encontrarem na hora de criar o ViewModel (claro, não sejamos tão drásticos…). Além disso, esse pattern permite fazer testes (unit tests, primariamente) da interface testando apenas o ViewModel, ou seja, sem usar UI Automation ou outros truques.

Finalmente, é bom saber que para esse padrão, há várias boas práticas para validação, acesso a dados, navegação, e outras funções do dia-a-dia, então é mais fácil encontrar soluções comprovadas para os nossos problemas comuns.

Então como começar?

Sigam a lista de links a seguir (em inglês) que certamente vocês vão encontrar rápido o caminho para o MVVM com os “gurus” do WPF – os WPF Disciples. Espero que seja útil!

1. Comece pelo vídeo com Karl Shifflett no Channel 9 com a explicação geral do pattern

2. Siga pelo vídeo detalhado “mão na massa” em WPF com Josh Smith (ou em Silverlight com Tim Heuer)

3. Continue com alguns artigos escolhidos a dedo:

4. Brinque um pouco com uma aplicação um pouco mais real. Algumas opções você encontra no CodeProject:

E boa sorte! Aguardo seus comentários!

Abraços!

Roberto

2 comments
Categories: Silverlight, WPF