Partilhar via


Getting Started with Ink

Incorporar tinta digital em seus aplicativos é mais fácil do que nunca. A tinta deixou de ser um corolário nos métodos de programação COM e Windows Forms, e alcançou a integração completa no WPF. Você não precisará instalar SDKs separadas ou bibliotecas de tempo de execução.

Pré-requisitos

Para usar os exemplos a seguir, você deve primeiro instalar Microsoft Visual Studio 2005 e o Windows SDK. Você também deve compreender como escrever aplicativos para o WPF. Para obter mais informações sobre como começar a usar o WPF, consulte Getting Started with Windows Presentation Foundation.

Guia de início rápido

Esta seção ajuda você a escrever um aplicativo simples WPF que coleta tinta.

Se ainda não o fez, instale o Microsoft Visual Studio 2005 e o Windows Software Development Kit (SDK). WPF aplicativos normalmente devem ser compilados antes você pode visualizá-las, mesmo se eles consistem inteiramente de Extensible Application Markup Language (XAML). No entanto, o Windows Software Development Kit (SDK) inclui um aplicativo, XamlPad, projetado para acelerar o processo de implementação um interface do usuário baseada em XAML. Você pode usar esse aplicativo para visualizar e ajustar os primeiros exemplos contidos neste documento. O processo de criação de aplicativos compilados a partir de XAML será abordado posteriormente neste documento.

Para iniciar XAMLPad, clique no menu Start, aponte para Todos os Programas , aponte para Microsoft Windows SDK, aponte para Ferramentas e clique em XAMLPad. No painel de renderização, XAMLPad processa o código XAML escrito no painel de código. Você pode editar o código XAML, e as alterações imediatamente aparecem no painel de renderização.

Tem tinta?

Para iniciar seu primeiro aplicativo WPF que ofereça suporte a tinta:

  1. Abra Microsoft Visual Studio 2005

  2. Crie um novo Windows Application (WPF).

  3. Digite <InkCanvas/> entre as marcas <Grid>

  4. Pressione F5 para iniciar o aplicativo no depurador

  5. Usando um mouse ou caneta, escrever Olá mundo na janela

Você escreveu o equivalente de tinta de um aplicativo "alô mundo" com apenas 12 pressionamentos de tecla!

Aprimore de seu aplicativo

Vamos aproveitar alguns recursos do WPF. Substitua tudo entre as marcas de abertura <Window> e de fechamento </Window> com a marcação a seguir para obter um plano de fundo com pincel de gradiente sobre a superfície de escrita à tinta.

<Page>
  <InkCanvas Name="myInkCanvas">
    <InkCanvas.Background>
      <LinearGradientBrush>
        <GradientStop Color="Yellow" Offset="0.0" />
        <GradientStop Color="Blue" Offset="0.5" />
        <GradientStop Color="Green" Offset="1.0" />
      </LinearGradientBrush>
    </InkCanvas.Background>
  </InkCanvas>


...


</Page>

Usando animação

Por diversão, vamos animar as cores do pincel de gradiente. Adicione o seguinte XAML após o a marca de fechamento </InkCanvas>, mas antes da marca de fechamento </Page>.

<Page.Triggers>
  <EventTrigger RoutedEvent="Page.Loaded">
    <EventTrigger.Actions>
      <BeginStoryboard>
        <Storyboard RepeatBehavior="Forever" AutoReverse="True">
          <ColorAnimation  Storyboard.TargetName="myInkCanvas"
          Storyboard.TargetProperty=
            "(InkCanvas.Background).(LinearGradientBrush.GradientStops)[0].(GradientStop.Color)"
          From="Yellow" To="Blue" Duration="0:0:5"/>
          <ColorAnimation Storyboard.TargetName="myInkCanvas"
          Storyboard.TargetProperty=
            "(InkCanvas.Background).(LinearGradientBrush.GradientStops)[1].(GradientStop.Color)"
          From="Blue" To="Red" Duration="0:0:5"/>
          <ColorAnimation Storyboard.TargetName="myInkCanvas"
          Storyboard.TargetProperty=
            "(InkCanvas.Background).(LinearGradientBrush.GradientStops)[2].(GradientStop.Color)"
          From="Green" To="Blue" Duration="0:0:5"/>
        </Storyboard>
      </BeginStoryboard>
    </EventTrigger.Actions>
  </EventTrigger>
</Page.Triggers>

Adicionando um pouco de código por trás do XAML

Enquanto XAML facilita a criação da interface do usuário, qualquer aplicativo do mundo real precisa adicionar código para tratar eventos. Aqui está um exemplo simples que ampliará a tinta em resposta a um clique com o botão direito do mouse de um mouse:

Defina o tratador MouseRightButtonUp no seu XAML:

<InkCanvas Name="myInkCanvas" MouseRightButtonUp="RightMouseUpHandler">

No Gerenciador de Soluções do Visual Studio, expanda Windows1.xaml e abra o code-behind file, Window1.xaml.cs ou Window1.xaml.vb se você estiver usando Visual Basic. Adicione o seguinte código tratador de eventos:

Private Sub RightMouseUpHandler(ByVal sender As Object, _
                                ByVal e As System.Windows.Input.MouseButtonEventArgs)

    Dim m As New Matrix()
    m.Scale(1.1, 1.1)
    CType(sender, InkCanvas).Strokes.Transform(m, True)

End Sub 'RightMouseUpHandler
private void RightMouseUpHandler(object sender, 
                                 System.Windows.Input.MouseButtonEventArgs e)
{
    Matrix m = new Matrix();
    m.Scale(1.1d, 1.1d);
    ((InkCanvas)sender).Strokes.Transform(m, true);
}

Agora, execute o aplicativo. Adicione um pouco de tinta e, em seguida, clique com o botão direito do mouse ou faça uma ação equivalente ao pressionar-e-segurar com uma caneta.

Usando código procedural em vez do XAML

Você pode acessar todos os recursos do WPF a partir do código procedural. Aqui está um aplicativo "Alô Mundo da Tinta" para WPF que não usa XAML de forma alguma. Cole o código a seguir em um Aplicativo de Console vazio no Visual Studio. Adicione referências aos conjuntos de módulos (assemblies) PresentationCore, PresentationFramework, e WindowsBase, e compile o aplicativo pressionando F5 :

Imports System
Imports System.Windows
Imports System.Windows.Controls


Class Program
    Inherits Application
    Private win As Window
    Private ic As InkCanvas


    Protected Overrides Sub OnStartup(ByVal args As StartupEventArgs)
        MyBase.OnStartup(args)
        win = New Window()
        ic = New InkCanvas()
        win.Content = ic
        win.Show()

    End Sub 'OnStartup

End Class 'Program

Module Module1

    Sub Main()
        Dim prog As New Program()
        prog.Run()

    End Sub

End Module
using System;
using System.Windows;
using System.Windows.Controls;
class Program : Application
{
    Window win;
    InkCanvas ic;

    protected override void OnStartup(StartupEventArgs args)
    {
        base.OnStartup(args);
        win = new Window();
        ic = new InkCanvas();
        win.Content = ic;
        win.Show();
    }

    [STAThread]
    static void Main(string[] args)
    {
        new Program().Run();
    }
}

Consulte também

Conceitos

Coleta de tinta

Handwriting Recognition

Storing Ink

Outros recursos

Digital Ink